PLEASE NOTE: These forums are no longer utilized and are provided as an archive for informational purposes only. All support issues will be handled via email using our support ticket system. For more detailed information on this change, please see this blog post.

Block dates

Gravity Support Forums » Plugin Support » Gravity Forms

  1. judelgado
    Member

    Hello,

    I'm including a calendar on my form, but I want that people can select dates 48 hours from now. I meant today and past days could not be selected. Is there a way I can accomplish this?

    Regards

    Posted 11 years ago on Monday June 25, 2012 | Permalink

  2. Chris Hajer
    Key Master

    The date picker used by Gravity Forms is the standard jQuery UI date picker. You can set the default starting date.

    http://jqueryui.com/demos/datepicker/#min-max

    Posted 11 years ago on Tuesday June 26, 2012 | Permalink

  3. judelgado
    Member

    Hey! Thanks for the reply. Where do I put the script? Can I put it for each form, or I have to put the code at header file for my theme?

    Regards

    Posted 11 years ago on Tuesday June 26, 2012 | Permalink

  4. David Peralty

    You would want to put it in the header. We have a great page about where code goes here:
    http://www.gravityhelp.com/documentation/page/Where_Do_I_Put_This_Code%3F

    Posted 11 years ago on Tuesday June 26, 2012 | Permalink

  5. judelgado
    Member

    Hello,

    Thanks again. Followed the instructions, but no luck. PLease look at: http://billbeardcostarica.com/2012/06/zip-line-congo-tree-top-canopy-tour-12-day-2/

    I edited header.php:

    <!DOCTYPE HTML>
    <html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes(); ?>>
    <head>
    <meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
    <?php truethemes_meta_hook();// action hook, see truethemes_framework/global/hooks.php ?>
    <title><?php wp_title('«', true, 'right'); ?> <?php bloginfo('name'); ?></title>
    <link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
    <link rel="alternate" type="application/rss+xml" title="<?php bloginfo('name'); ?>" href="<?php bloginfo('rss2_url'); ?>" />
    <?php wp_head(); ?>
    <script type="text/javascript">
    jQuery(document).ready(function($) {
    $( "#datepicker" ).datepicker({ minDate: +2 });
    });
    </script>
    <!--[if lte IE 8]>
    <link rel="stylesheet" type="text/css" href="<?php echo get_template_directory_uri(); ?>/css/lt8.css" media="screen"/>
    <![endif]-->
    </head>

    But the calendar still shows all the dates. Any help will be appreciated.

    Regards

    Posted 11 years ago on Tuesday June 26, 2012 | Permalink

  6. judelgado
    Member

    Ok. I found out the problem. The code must include the the date input ID. Now my problem is that the small calendar disappeared and is like the code is messed.

    Two questions, tho

    1. Each form date input has its own ID (4_1, 3_1, etc) could this code be more generic so I don't have to put a line for each form?
    2. Why this script messed the css?

    Regards

    Posted 11 years ago on Tuesday June 26, 2012 | Permalink

  7. judelgado
    Member

    Wow, I'm tired, nothing seems to work here. I had to remove the script from the header.php since it was messing the entire css, worked for the datepicker but it deactivated the dropdown menus, and the image sliders... Any help will be appreciated.

    Regards

    Posted 11 years ago on Tuesday June 26, 2012 | Permalink

  8. David Peralty

    Can you post the last script you tried to use, and I'll see if I can get someone with some JS skills to take a look?

    Posted 11 years ago on Wednesday June 27, 2012 | Permalink

  9. judelgado
    Member

    Here's the script:

    <script type="text/javascript">
jQuery(document).ready(function($) {
$( "#input_1_1" ).datepicker({ minDate: +2 });
});
</script>
    Posted 11 years ago on Wednesday June 27, 2012 | Permalink

  10. David Peralty

    Can you try:

    <script type="text/javascript">
jQuery(document).ready(function($) {
$( "#input_1_1" ).datepicker({ minDate: +2d });
});
</script>
    Posted 11 years ago on Wednesday June 27, 2012 | Permalink

  11. Tobias
    Member

    You need to re-declare some things to get the image back. See this post: http://www.gravityhelp.com/forums/topic/how-to-highlight-current-date-or-future-date-in-jquery-datepicker#post-5606

    Posted 11 years ago on Wednesday June 27, 2012 | Permalink

  12. judelgado
    Member

    Thanks Tobias, now the calendar icon is showing, but my big problem is with the dropdown menues that only work where the form is, and the rest of the pages are affected.

    For example: Script applies to this form: http://billbeardcostarica.com/2012/06/zip-line-congo-tree-top-canopy-tour-12-day-2/

    If you roll over top menues the drop down will show, but if you go to other page/post the drop downs are not working... so weird...

    Thanks for the help!

    Posted 11 years ago on Wednesday June 27, 2012 | Permalink

  13. David Peralty

    Look at surrounding your JS with a php script to detect the page and only show on the pages you have forms:
    http://codex.wordpress.org/Function_Reference/is_page

    Posted 11 years ago on Wednesday June 27, 2012 | Permalink

  14. judelgado
    Member

    Wow, finally, thanks David you're very helpful. Last question: I have many different forms on my site, is there a generic script I can use for datepicker on all forms, or I'll have to create an script for each post with a date input form. My final code:

    <?php if (is_single('11176')) { ?>
<script type="text/javascript">
jQuery.noConflict();
  jQuery(document).ready(function($) {
		$( "#input_1_1" ).datepicker({ minDate: '+3d', gotoCurrent: true, prevText: '', showOn: 'both', buttonImage: '/wp-content/plugins/gravityforms/images/calendar.png', buttonImageOnly: true });

  });
</script><?php } ?>
    Posted 11 years ago on Wednesday June 27, 2012 | Permalink

  15. David Peralty

    I wish I knew... My JavaScript-fu is pretty weak. I am not sure how specific the selector needs to be, and if you want to have each one with a different minDate, then you definitely will need different scripts. If the selector can be more general, you might want to use something like $( ".gform_wrapper" ) but again, I don't know if that will work.

    If it does, or you can futz with the JS, then you can put an OR in your if statement.

    if (is_single('11176') || is_single('11177') || is_single('11178')) {...

    Posted 11 years ago on Wednesday June 27, 2012 | Permalink

  16. judelgado
    Member

    Well, thanks again David. I'll try to deal with this, because the #input1_1 also changes depending on the form number... there're two variables... post # and date input id.

    I'll keep working on a solution. Really appreciated your help.

    Posted 11 years ago on Wednesday June 27, 2012 | Permalink