Gravatar for jlynch@sonusnet.com

Question by Jim Lynch, Feb 24, 2016 12:11 PM

URL with # prevents ApexPages from parsing URL parameters

I want to dynamically display a calendar when a particular tab is selected which can be done using the 'rendered' attribute of apex:variable (see below).

Initially I thought I would parse the URL but because Coveo uses the # to separate the URL from the parameters, the ApexPages function will not parse the parameters from the URL (Function: ApexPages.currentPage().getParameters().get('t');) If I could get the value of the 't' parameter, I would know the tab and then use that as the 'rendered' condition below.

The code to display the calendar except because the # is used in the URL, it will not work. If I modify the URL to use the ?, then it work fine.

                    <apex:variable value="" var="" rendered="{!$CurrentPage.parameters.t=='WBASearch'}">
                    <apex:form >  
                    <table>
                        <tr>
                          <th><label>Start Date:</label></th>
                          <th><input  size="10" id="startDate" onfocus="DatePicker.pickDate(false, this , false);" /></th>
                        </tr>
                    </table>            
                    </apex:form>
                </apex:variable>

Is there an alternative way using CoveoTab to execute some logic ?

Thanks Jim

1 Reply
Gravatar for mlaporte@coveo.com

Answer by Martin Laporte, Feb 25, 2016 4:32 AM

VisualForce markup is interpreted server-side and thus only runs for the initial rendering of the page. Changes in the JS UI state do not trigger a page re-render, and in any case browsers do not sent the # part of the url to the server.

But there is a much easier way to achieve this same result: in your HTML just put a data-tab attribute on the tag that you want to only show up when a particular tab is active, and it'll be automatically shown/hidden as appropriate.

For example, if you have a tab that looks like this:

<a class="CoveoTab" data-id="foo" data-caption="Foo"></a>

You can use an HTML div around your calendar:

<div data-tab="foo">Only visible then Foo is active</div>

(beware that the id is case-sensitive)

Gravatar for jlynch@sonusnet.com

Comment by Jim Lynch, Feb 25, 2016 10:54 AM

Excellent ! Works perfectly.

Ask a question