4 Replies Latest reply on Feb 8, 2017 8:32 PM by Sanford Whiteman

    Adding jQuery Datepicker to Marketo Form?

    Jen Agatone

      Has anyone had success loading the jQuery Datepicker into a Marketo form field?

      https://jqueryui.com/datepicker/#min-max

       

      Because the form dynamically populates, the Datepicker script doesn't work. I want to use this script so I can set the selectable calendar dates 72 hours in the future. Unless that capability is available in Marketo somewhere.

       

      My script:

       

      <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">

      <script src="//code.jquery.com/jquery-1.12.4.js"></script>

      <script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

       

      And then within my form call...

       

      <script>MktoForms2.loadForm("http://app-sj02.marketo.com", "APPID", FORMID,

          function(form){

          $( function() {

          $( "#Lead_Source_Notes__c" ).datepicker({ minDate: -20, maxDate: "+1M +10D" });

        } );

      .... rest of form code

       

      I want the datepicker to apply to the Lead Source Notes field and it doesn't. Also tried it without the $( function() { in front of the datepicker form call and nada either.

       

       

      It DOES work on a text field outside of the Marketo form if I do this:

       

      <script>

        $( function() {

          $( "#Lead_Source_Notes__c" ).datepicker({ minDate: +3, maxDate: "+1M" });

        } );

        </script>

       

      <p>Date: <input type="text" id="Lead_Source_Notes__c"></p>

       

       

      So it's because Marketo is loading the form dynamically.

       

      Any help?