ASP.NET MVC jQueryUs datepicker non funziona quando si utilizza AJAX.BeginForm

Question

Possiedo una vista parziale MVC ASP.NET che contiene un Html.TextBox configurato per l'utilizzo di datepicker da JQueryUI. Questo viene fatto assicurandosi che lo stile sia impostato su .datepicker. Tutto ha funzionato bene. Tuttavia, ho modificato i miei moduli in Ajax.BeginForm e incluso Ajax.ActionLink che lo visualizza dopo aver fatto clic sul collegamento. Da quando lo aggiungi, il datepicker non viene visualizzato. Di fatto, nessun JavaScript che ha funzionato in precedenza è stato persino invocato dopo aver restituito una partialview dal controller. Anche se PUT THE JavaScript/JQuery nella vista parziale stessa non lo usa ancora. Sono davvero confuso, qualcuno può aiutarmi per favore?

esempi riportati di seguito

<div id="claims"> 
     <div id="divViewClaims"> 
      <% Html.RenderPartial("ViewClaim", Model.Claims ?? null); %> 
     </div> 
     <br /><br /> 
     <div id="claim"> 
      <% Html.RenderPartial("AddEditClaim", new Claim()); %>   
     </div> 
    </div> 

azione di collegamento, quando clickon chiama azione di controllo per tornare PartialView, La JavaScript chiamato sugli incendi onSuccess ma nient'altro, che in precedenza è stato collegato dalla funzione document.ready. Tutti i miei script sono in file separati e fanno riferimento alla pagina principale.

<%= Ajax.ActionLink(string.Format("Add A{0} Claim", Model.Count > 0 ? "nother" : string.Empty), "AddClaim", "Driver", new AjaxOptions { HttpMethod = "GET", UpdateTargetId = "claim", OnSuccess="showAddClaim" }, new { @class = "ControlLink" })%> 

azione controller

public ActionResult AddClaim() 
{ 
     return PartialView("AddEditClaim", new Claim()); 
} 

Vista parziale, che mostra la casella di testo con lo stile impostato datepicker

<% var ajaxOptions = new AjaxOptions { HttpMethod = "POST", UpdateTargetId = "divViewClaims", InsertionMode = InsertionMode.Replace, OnSuccess="hideAddClaim" }; %> 
     <% using (Ajax.BeginForm("AddEditClaim", "Claim", ajaxOptions, new { @name = "ClaimControl", @id = "ClaimControl" })) 
      { %> 

    <fieldset> 
     <legend><%= Model.Id==0?"Add":"Edit" %> Claim</legend> 
     <p> 
      <label for="Title">Claim Date</label> 
      <%= Html.TextBox("Date", Model.Date.ToString().TrimEnd('0', ':', ' ') ?? "", new { @class = "datepicker" })%> 
     </p> 

Apprezzo tutto l'aiuto su questo.

Answer 1

Se l'elemento viene creato dopo document.ready, è necessario eseguire nuovamente la corrispondenza dell'elemento a jQuery.

Partenza jQuery Live

Answer 2

Ciò che funziona per me è quello di utilizzare la proprietà OnSuccess dalle AjaxOptions. Così, il vostro codice potrebbe essere simile a questo:

using (Ajax.BeginForm("AddEditClaim", "Claim", ajaxOptions, new { @name = "ClaimControl", @id = "ClaimControl", OnSuccess="the_javascript_function_below" }) 

dove the_javascript_function è il nome di una funzione che fa questo:

$(".datepicker").datepicker();