Error passing URL to custom console footer component to open Solution in new primary tab

Question

I've built a simple console footer component to display solutions using the solutions standardSetController So far so good.

Now I'm trying to get the links to open up properly in the console.

If I use an apex:outputlink with target = "_blank" the solution will open up in a subtab if I have a primary tab open, but if there is no primary tab open it just opens up in the console component itself - bad!

So I'm trying javascript + console integration toolkit and running into issues passing the URL to open properly.

If I hard-code the link to the solution, it opens fine in a new primary tab.

But if I actually try to build and pass the URL to the function, nothing happens, and I capture errors in the chrome debug console.

I'll post the code with commented out examples of what I've tried below. The fact that it works if I hard code the URL must mean that its just a matter of properly building the URL string, but I have no idea what to do since a formula field wouldnt work. This could just be a basic javascript issue, not a salesforce issue, in which case I can post elsewhere, but starting here.

I do have salesforce.com whitelisted in the console app, and added to remote site settings and CORS just for good measure.

Visualforce Page

<apex:page standardController="Solution" recordSetVar="sols">

 <apex:includeScript value="/support/console/39.0/integration.js"/>
 <script type="text/javascript">
        function openSolution(recURL) {
            sforce.console.openPrimaryTab(null,recURL,true);
        }
 </script>       

    <apex:pageBlock >
        <apex:form >
            <apex:panelGrid >
                <apex:selectList value="{!filterId}" size="1">
                <apex:actionSupport event="onchange" rerender="list"/>
                <apex:selectOptions value="{!listViewOptions}"></apex:selectOptions>
                </apex:selectList>
            </apex:panelGrid>
            <apex:pageblocksection >
                <apex:dataList var="s" value="{!sols}" id="list" style="padding: 0px;">
<!-- WORKS IF FULL URL IS HARD CODED
                <a href="#" onclick="openSolution('https://cs14.salesforce.com/501c00000000gg8');">{!s.SolutionName}</a>
-->

<!-- ERROR: Uncaught SyntaxError: missing ) after argument list 
        solURL__c is a formula field on solution to create the solution link using the partner URL
        also tried hard-coding the URL in the field, no difference

        <a href="#" onclick="openSolution({!URLENCODE(s.solURL__c)});">{!s.SolutionName}</a>
-->

<!-- ERROR: Uncaught SyntaxError: missing ) after argument list
            I tried adding + or & between the text and the {!s.Id}

        <a href="#" onclick="openSolution('https://cs14.salesforce.com/'{!s.Id});">{!s.SolutionName}</a>
-->

                </apex:dataList>
            </apex:pageblocksection>
        </apex:form>
    </apex:pageBlock>

Answer 1

You are having Syntax problem in both examples. Try any of these-

1. Missed enclosing the URL in single quotes:

   <a href="#" 
       onclick="openSolution('{!URLENCODE(s.solURL__c)}');"
       >{!s.SolutionName}</a>
   

2. Concatenation issue:

   <a href="#" 
       onclick="openSolution('https://cs14.salesforce.com/{!s.Id}');"
       >{!s.SolutionName}</a>