Gravity Support Forums Topic: Datepicker jQuery

Gravity Support Forums Topic: Datepicker jQuery - modify function and styling https://legacy.forums.gravityhelp.com/topic/datepicker-jquery-modify-function-and-styling Gravity Support Forums Topic: Datepicker jQuery - modify function and styling en-US Tue, 21 Apr 2026 15:28:13 +0000 http://bbpress.org/?v=1.0.1 <![CDATA[Search]]> q https://legacy.forums.gravityhelp.com/search.php David Peralty on "Datepicker jQuery - modify function and styling" https://legacy.forums.gravityhelp.com/topic/datepicker-jquery-modify-function-and-styling#post-99629 Thu, 06 Dec 2012 10:46:27 +0000 David Peralty 99629@https://legacy.forums.gravityhelp.com/ <p>I'm glad you were able to figure it out, and that's something we all must do sometimes. I can't tell you the number of times in working with PHP that I am left searching for the missing semi-colon that is right in front of my eyes. </p> twentyfourten on "Datepicker jQuery - modify function and styling" https://legacy.forums.gravityhelp.com/topic/datepicker-jquery-modify-function-and-styling#post-99590 Thu, 06 Dec 2012 09:09:27 +0000 twentyfourten 99590@https://legacy.forums.gravityhelp.com/ <p>10 minutes later, I've looked back at form and realised I've missed the # off the input IDs. Apologies ... and let this be a lesson to everyone to take a break once in a while and look at your code with fresh eyes.</p> <p>Cheers </p> twentyfourten on "Datepicker jQuery - modify function and styling" https://legacy.forums.gravityhelp.com/topic/datepicker-jquery-modify-function-and-styling#post-99583 Thu, 06 Dec 2012 08:42:07 +0000 twentyfourten 99583@https://legacy.forums.gravityhelp.com/ <p>Hi,</p> <p>Looked through support and wider online resources but hitting a wall and in need of some assistance.</p> <p>I have a WordPress site, with a Contact page.<br /> Using Gravity forms for the Contact form.<br /> I have two date pickers, essentially a 'start' and 'end'.<br /> I want selection of 1st to be reflected in the 2nd - in that the end datepicker can display no dates earlier than the start date.</p> <p>In a 'test' html page I have this working perfectly:<br /> <a href="http://dev.twentyfourten.com/clients/daleygolfholidays/test.html" rel="nofollow">http://dev.twentyfourten.com/clients/daleygolfholidays/test.html</a></p> <p>Code used is this:<br /> <pre><code><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script> <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" /> <script type="text/javascript"> jQuery.noConflict(); jQuery(document).ready(function($) { $("#txtFromDate").datepicker({ minDate: 0, maxDate: "+365D", numberOfMonths: 2, dateFormat: 'dd/mm/yy', onSelect: function(selected) { $("#txtToDate").datepicker("option","minDate", selected) } }); $("#txtToDate").datepicker({ minDate: "+7D", maxDate:"+365D", numberOfMonths: 2, dateFormat: 'dd/mm/yy', onSelect: function(selected) { $("#txtFromDate").datepicker("option","maxDate", selected) } }); }); </script></code></pre> <p>However, when I try and work this code in to my WordPress Contact page I don't get the same results:<br /> <a href="http://www.daleygolfholidays.co.uk/contact-us/" rel="nofollow">http://www.daleygolfholidays.co.uk/contact-us/</a></p> <p>Here I am using the following code up in the wp-head section:<br /> <pre><code><script type="text/javascript"> jQuery.noConflict(); jQuery(document).ready(function($) { $("input_1_5").datepicker({ minDate: 0, maxDate: "+365D", numberOfMonths: 2, dateFormat: 'dd/mm/yy', onSelect: function(selected) { $("input_1_6").datepicker("option","minDate", selected) } }); $("input_1_6").datepicker({ minDate: "+7D", maxDate:"+365D", numberOfMonths: 2, dateFormat: 'dd/mm/yy', onSelect: function(selected) { $("input_1_5").datepicker("option","maxDate", selected) } }); }); </script></code></pre> <p>* Datepicker IDs are changed from test version to Gravity form inputs</p> <p>And down in my footer after all other scripts I am using the following refs:<br /> <pre><code><script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script> <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" /></code></pre> <p>As you can see when viewing the page and using the datepickers, neither the function nor styling is as seen in the test page.</p> <p>I've tried moving the script in the header down into the footer, the links in the footer up to being with the header script, no dice - the original Gravity form settings still seem to be 'in control'.</p> <p>Would appreciate some help!</p> <p>Cheers </p>