how to use jquerydate picker with partial views in asp.net mvc?

Question

hello i am working on asp.net mvc. at staring i used the jquery which works fine but now i am converting my pages in to partial pages at this point am using ajax function to convert it in to partial view but every thing is working fine except date picker plz tell me the solution.

the script that i have used:

                         $(document).ready(function() {
                             $("#txtTransationDate").datepicker();
                         });
                        </script>

<input id="txtTransationDate" name="txtTransationDate" type="text" />

thank you......

Answer 1

in the success call back of your ajax function set up the calendar.

$.ajax({
    url: url,
    data: yourData, 
    type: 'POST',
    success: function(){
       $("#datepicker").datepicker();

    },
    error: function(){
           //your error stuff
    }
});

something like that should work. i've got calendars in partial views with out any issue.

Answer 2

Add a class to all of your textboxes that you want to convert to datepicker, like such:

<input class="useDatePicker" id="txtTransationDate" name="txtTransationDate" type="text" />
<input class="useDatePicker" id="txtInvoiceDate" name="txtInvoiceDate" type="text" />
<input class="useDatePicker" id="txtWhateverDate" name="txtWhateverDate" type="text" />

Then in your master page, add this script:

<script type="text/javascript">

    $(document).ready(function () {
        $(".useDatePicker").live('click', function () {
            $(this).datepicker('destroy').datepicker({
                showOn: 'focus'
            }).focus();
        });
    });

</script>