Jquery Ui Date Picker Not Working?

Question

My form code is here.

<div class="threeleft second" id='displayallformshow' style="float: none;width: 80%;padding:10px;">
    <form action="investor_submit.php">
        <div class='formdiv'>
            <div style='width:35%;margin-top:12px;'>Published :</div>
            <div style='width:41%;text-align:justify'>
                <div style="float: left;">
                    <input type="radio" name="published" id="" value='publishedyes'>
                </div>
                <div style="float: left;width: 237px;">Yes, allow users who follow links to my venture URL the ability to see my venture page.</div>
                <br>
                <br>
                <div style="float: left;">
                    <input type="radio" name="published" id="" value='publishedno'>
                </div>
                <div style='float: left;width: 237px;'>No, display an error message to anybody who tries to follow links to my venture except for me.</div>
            </div>
        </div>
        <br>
        <br>
        <div class='formdiv'>
            <div style='width:35%;margin-top:12px;'>Listed and Discoverable :</div>
            <div style='width:41%;text-align:justify'>
                <div style='float: left;'>
                    <input type="radio" name="listedanddiscoverable" id="" value='listedanddiscoverableyes'>
                </div>
                <div style='float: left;width: 237px;'>Yes, I want my ventureto be listed in the browser section making it discoverable to RockThePost Visitors. (Required Paid Subscription)</div>
                <br>
                <br>
                <div style='float: left;'>
                    <input type="radio" name="listedanddiscoverable" id="" value='listedanddiscoverableno'>
                </div>
                <div style='float: left;width: 237px;'>No, do not list my venture anywhere automatically. I willmanually invite people to my venture with my venture URL.</div>
            </div>
        </div>
        <div class='formdiv'>
            <div style='width:35%;margin-top:12px;'>Describe Start Date :</div>
            <div style='width:55%;'>
                <input class='madetextboxlong' placeholder="Enter Describe Start Date" type="text" name="describestartdate" id="describestartdate">
            </div>
        </div>
        <div class='formdiv'>
            <div style='width:35%;margin-top:12px;'>Describe end Date :</div>
            <div style='width:55%;'>
                <input class='madetextboxlong' placeholder="Enter Describe end Date" type="text" name="describeenddate" id="describeenddate">
            </div>
        </div>
        <br>
        <br>
        <br>
        <div style="margin-left: 288px;margin-top: 423px;width: 100%;" class="formdiv">
            <input type="submit" id='publishform' class="madebtnsave" name="save" value="Save" />
        </div>
    </form>
</div>

that form i load on click event. user click on investor tab when load.

that form is working properly but the problem is not loading the jquery ui datepicker

this is my datepicker code.

$( "#describestartdate" ).datepicker();
$( "#describeenddate" ).datepicker();

Please help me to solve that problem how to working jquery datepicker.

when i load form without click event the datepicker is display successfully.

but i load form to click event the datepicker is not showing.

Solution 1

dear friend try this.

$("event tab ID").click(function(){
     $( "#displayallformshow #describestartdate" ).datepicker();
    $( "#displayallformshow #describeenddate" ).datepicker();
});

i hope this is used full for you.

Solution 2

If you load your form on a click event, you have to register the datepicker handlers

$( "#describestartdate" ).datepicker();
$( "#describeenddate" ).datepicker();

after having loaded it. Put these line to the end of the form-loading callback (the on-click event). Otherwise, these lines will be executed before the target items are available, i.e. $("#describestartdate") will return an empty list and nothing happens.

Comments

[Tats_innit]

working demo jsfiddle.net/98vRd ; Yo, make sure you have reference Jquery UI refernce correctly, hope demo will throw some light! :)

[Soundz]

any errors on the console?

[Admin]

not show any error in console.

[Admin]

@Tats_innit you are write datepicker is load but my form is display on click event when user click on button then display form so that i load form onclick event then datepicker is not show.