Date Picker Not Working « Gravity Support Forums

Gravity Support Forums » Plugin Support » Gravity Forms

mmoriart
Member

Hi - Can't seem to get the date picker working - I just get a single line input field with no popup. Any ideas?

Posted 14 years ago on Saturday August 14, 2010 | Permalink
David Smith
Member

More than likely there is a javascript error on your page that is conflicting with the date picker script. Could you provide a link to the form in question?

Posted 14 years ago on Saturday August 14, 2010 | Permalink
Kevin Flahaut
Administrator
Yep, hard to diagnose the issue without seeing the actual form. A link would be helpful.

This usually happens because the necessary scripts/CSS (ui.datepicker.js, etc) didn't get loaded.

When using a Gravity Form in a sidebar widget or embedding it anywhere using the function call, you need to manually enqueue the scripts and CSS by placing a short script block in your theme's functions.php file.
```
wp_enqueue_script("gforms_ui_datepicker", WP_PLUGIN_URL . "/gravityforms/js/jquery-ui/ui.datepicker.js", array("jquery"), "1.3.9", true);

wp_enqueue_script("gforms_datepicker", WP_PLUGIN_URL . "/gravityforms/js/datepicker.js", array("gforms_ui_datepicker"), "1.3.9", true);

wp_enqueue_script("gforms_conditional_logic_lib", WP_PLUGIN_URL . "/gravityforms/js/conditional_logic.js", array("gforms_ui_datepicker"), "1.3.9", true);

wp_enqueue_style("gforms_css", WP_PLUGIN_URL . "/gravityforms/css/forms.css");
```
Without this, the conditional logic scripts, datepicker script, form CSS and other elements needed for the full form functionality aren't loaded.

You can find more information at the URL below

http://www.gravityhelp.com/documentation/embedding-a-form/
Posted 14 years ago on Saturday August 14, 2010 | Permalink
mmoriart
Member

Hi - Thanks for the response. I included the code block in the theme's function.php file - although I'm not embedding the form with a function call - just using the insert form button above the editor. There doesn't seem to be any javascript included in the form page preview:

http://limo.smallplanetwebsites.com/wp-content/plugins/gravityforms/preview.php?id=1

Thanks for your help

Posted 14 years ago on Tuesday August 17, 2010 | Permalink
mmoriart
Member

OK it seems to have something to do with the multisite installation. Works on my primary site - javascript included OK (http://smallplanetwebsites.com) - but not on sub domain (limo.smallplanetwebsites.com) no javascript included

Posted 14 years ago on Tuesday August 17, 2010 | Permalink
mmoriart
Member

Sorry -Seem to be having a few teething problems here... The gravity forms css is conflicting with my theme CSS - I have set the Gravity Form settings to not output css yet the forms.css file continues to be included. I don't think its a caching problem. Including and excluding CSS seems to work on my primary site but once again not on the virtual/sub domain??

http://limo.smallplanetwebsites.com/limousine-bookings/

I realise excluding the CSS will break the date picker so wondering if there's a way I can include just the date picker CSS - Guess I could copy to my theme CSS? Need to get the file includes working properly on my sub domains so I can turn off css but ensure javascript is included - hope this all makes sense

Regards

Michael

Posted 14 years ago on Wednesday August 18, 2010 | Permalink
Kevin Flahaut
Administrator

The scripts are only loaded if the form requires them (datepicker, conditional logic, etc.) so you should only see those on forms that use those elements. If you are using that functionality and it's a multi-site issue, we may have to dig deeper.

There isn't a way to piece-meal the CSS. Yes, you'll want to copy the datepicker styles from the plugins forms.css file and append those to your theme's style sheet. That way, any customizations you make are safe when you auto-update the plugin. We recommend that you do any customizations this way.

Posted 14 years ago on Wednesday August 18, 2010 | Permalink
mmoriart
Member

Thanks Kevin - I am using the date picker functionality but javascripts are not being included on any site other than the primary website. Also enabling and disabling the inclusion of CSS only works on the primary website. I'm using WP version 3.1 Multisite enabled. Plugin is Network enabled.

Where should I start digging?

Posted 14 years ago on Wednesday August 18, 2010 | Permalink
Carl Hancock
Administrator

Do you have any sort of caching going on? Each site works as it's own WordPress install, complete with it's own database tables so if it works on one it should work on all of them. Something else is going on that is interfering with the output. Either that or there is a bug in WP 3.1 Multisite that is preventing the enqueue from functioning.

Posted 14 years ago on Wednesday August 18, 2010 | Permalink
wcdco
Member

Interesting enough I am having a similar issue, I don’t believe I am having any JS conflicts etc … possibly because I am working on a sub domain?

Posted 14 years ago on Tuesday August 24, 2010 | Permalink
Carl Hancock
Administrator

@wcdco The user above encountered the issue due to something the theme they were using, a themeforest theme, was doing that broke the WordPress enqueue functionality.

It wasn't a bug in Gravity Forms (which uses built in WordPress enqueue functionality) but rather a bug in a poorly developed theme that contained functionality in the functions.php files that broke the built in enqueue functionality when running in multi-site mode.

Try activating the default TwentyTen theme on the site you are having the problem with and let me know if is still occurs. If it does not and it works then there is something in your theme that is causing an issue.

Posted 14 years ago on Tuesday August 24, 2010 | Permalink
wcdco
Member

Well well well … I built my theme from scratch, my wp header was above my call for jQuery.
Carl, Its all your fault … thanks for the quick response.

Posted 14 years ago on Tuesday August 24, 2010 | Permalink
conversationware
Member

Hi
I was feeling very positive when I found this thread. However, I copied the said code both as it appears on this page and on http://www.gravityhelp.com/documentation/embedding-a-form/ and on both occasions the code appeared on my site above my header image and the date picker still didn't appear.

Any ideas on what I did wrong?

Thanks
Rob

Posted 14 years ago on Thursday November 4, 2010 | Permalink
Kevin Flahaut
Administrator

The enqueue scripts go in your theme's function.php file. Are you placing it there or in your page template or header file?

Posted 14 years ago on Thursday November 4, 2010 | Permalink
conversationware
Member

Hey Kevin

Thanks for the quick response.

I did put it into the functions.php but initially outside of the php tags - that was when the code was visible above the header.

I corrected that but then the form would not show at all.

Back to my original position right now.

Heeeeeeeelp

Posted 14 years ago on Thursday November 4, 2010 | Permalink
conversationware
Member

btw, form page is http://privatejethiredirect.com/request-a-quote

Posted 14 years ago on Thursday November 4, 2010 | Permalink
Carl Hancock
Administrator

@conversationware The datepicker JS is not being output on your page so however you implemented the code is not correct. There is no way to determine how you implemented the code without actually accessing your site. You would have to provide us with a WordPress Admin login for this site via our Contact Us form and reference this forum post and we can take a look.

Posted 14 years ago on Thursday November 4, 2010 | Permalink
Carl Hancock
Administrator

@conversationware Your footer.php file was missing the wp_footer() function call that all themes should have. Similar to the wp_head() function call in the header.php file it allows plugins to insert code into the footer of the site. The datepicker javascript is inserted into the footer, without this function call it wasn't happening.

Posted 14 years ago on Thursday November 4, 2010 | Permalink
conversationware
Member

Carl

Thanks, great service.

Rob

Posted 14 years ago on Friday November 5, 2010 | Permalink
ConnP
Member

hi all,

I enqued the lines Kevin mentioned above, and the form disappeared (lol). After some tests, I realized that the form disappears after loading conditional_logic.js. If I skip the conditional_logic.js line, the form works ok, but without the datepicker. Any hints?

Extra info: when I click preview in the backend, the datepicker works fine. My best guess is some kind of css conflict, not js. Just trying to find the right place to dig. =/

Posted 13 years ago on Thursday October 6, 2011 | Permalink
Chris Hajer
Key Master

ConnP, I am going to close this thread because it is so old and is pre-purchase. Please open a new support topic and post a URL to your form. The issue is going to be related to a JavaScript error. JavaScript is required to display a form with conditional logic. Unless the JavaScript is present, the "display:none" CSS will be applied and you will not see your form.

We'll need a link to your form to help you figure it out. Thanks.

Posted 13 years ago on Thursday October 6, 2011 | Permalink

This topic has been resolved and has been closed to new replies.