I've inherited an externally facing form which has a date field on it that pulls up a date picker when selected. We are converting to HTTPS and since the whole page is totally custom, the standard SF calendar popup doesn't work and they coded one in. Unfortunately using HTTPS breaks it and though the date field still works, I can't get a datePicker calendar to pop up. I've tried using just the standard VF inputField and it doesn't work. Been scouring any article I can find and not having any luck finding this issue being addressed. One mentioned that it may be the API version, but jumping back to an old API version didn't make a difference.

Any ideas on how I might be able to get this working without needing to re-write the entire page would be highly appreciated.

Here is the datepicker function (init runs on page load)

function initDatepicker() {
    var vdate = $$( "input[id$='date-of-visit']" )
    if(vdate.length){
        vdate.datepicker({
            changeMonth: true,
            changeYear: true
        });
        vdate.attr('readonly', true);
        $$( "input[id$='date-of-visit']" ).click(function(){
            $$( "input[id$='date-of-visit']" ).datepicker('show');
        });
    }
}

And where it is being used in the VF form

<div class='input-container clearfix date-of-visit-container'>
    <apex:outputLabel for="date-of-visit"> Date of Visit
        <apex:outputText rendered="{!pkbCon.isFeedBack}" >
            <font color="red" >*</font>
        </apex:outputText>
    </apex:outputLabel>

    <div class="customInput date-of-visit">
        <div class="left"></div>
        <div class="middle">
            <div class="top"></div>
            <div>
                <apex:inputField id="date-of-visit" showdatepicker="false" value="{!pkbCon.theCase.Visit_Date_and_Time__c}" onchange="validateDate(false)" />
            </div>
            <div class="bottom"></div>
        </div>
        <div class="right"></div>
    </div>
</div>
  • Look in the javascript console for any errors loading the library. Most likely the library is being loaded via http and needs to be changed to https or something similar if the only change you made was https – Eric Mar 17 '17 at 18:08
  • jquery is supposed to use single $, u seem to be using $$, are you using noconflict mode ? – Avidev9 Mar 17 '17 at 19:15
  • Yes, I am using nonconflict. I was able to locate a JS library that was being loaded as http instead of https. Changing that fixed the issue. Will post as answer. – De'Anna Mar 21 '17 at 20:23
up vote 2 down vote accepted

Thanks to @Eric for the suggestion of locating a possible js library that was loading in http rather than https, turns out there was one that was buried and I had missed. Fixing that reference allowed the datepicker calendar to popup when the date was clicked.

Your Answer

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Not the answer you're looking for? Browse other questions tagged or ask your own question.