ASP.NET MVC.NET JQueryUI datepicker inside a div loaded/updated with ajax.actionlink

Posted by ArjanW on Stack Overflow See other posts from Stack Overflow or by ArjanW
Published on 2009-09-29T21:00:14Z Indexed on 2010/06/12 5:22 UTC
Read the original article Hit count: 363

Filed under:
|

Im trying to incorporate jqueryUI's datepicker inside a partialview like this:

  <% using (Ajax.BeginForm("/EditData", 
                            new AjaxOptions { HttpMethod = "POST", 
                                             UpdateTargetId = "div1"   }))
  {%>
    Date: 
   <%= Html.TextBox("date", String.Format("{0:g}", Model.date), new { id = "datePicker"})%>
   <% } %>

        <script type="text/javascript">

        $(function() {
            $("#datePicker").datepicker();
        });
        </script>

when i directly call the url to this partial view, so it renders only this view the datepicker works perfectly. (for the purpose of testing this i added the needed jquerry and jquerryui script and css references directly to the partial view)

But if i use a Ajax.Actionlink to load this partial view inside a div (called div2, submitting the above form should update div1) like this:

      <div id="div1">
    <%= Ajax.ActionLink("Edit", "/EditData", new { id = Model.id }, new AjaxOptions { HttpMethod = "GET", UpdateTargetId = "div2" } )%>                  

</div>
<div2>placeholder for the form</div>

the datepicker wont apear anymore. My best guess is the javascript included in the loaded html doesnt get executed, ($(document).ready(function() { $("#datepicker").datepicker(); }); doesnt work either

if that's the case how and where should i call the $("datepicker").datepicker(); ? (putting it in the ajaxoptions of the ajax.actionlink as oncomplete = "$(function() { $('#datepicker').datepicker();});" still doesnt work.

if thats not the case, then where's my problem?

© Stack Overflow or respective owner

Related posts about asp.net-mvc

Related posts about datepicker