Wie rendere ich die Teilansicht mit jquery?
Wir können die Teilansicht folgendermaßen rendern:
<% Html.RenderPartial("UserDetails"); %>
Wie können wir dasselbe mit jquery machen?
Wie rendere ich die Teilansicht mit jquery?
Wir können die Teilansicht folgendermaßen rendern:
<% Html.RenderPartial("UserDetails"); %>
Wie können wir dasselbe mit jquery machen?
Antworten:
Sie können eine Teilansicht nicht nur mit jQuery rendern. Sie können jedoch eine Methode (Aktion) aufrufen, die die Teilansicht für Sie rendert und mit jQuery / AJAX zur Seite hinzufügt. Im Folgenden haben wir einen Schaltflächenklick-Handler, der die URL für die Aktion aus einem Datenattribut auf der Schaltfläche lädt und eine GET-Anforderung auslöst, um die in der Teilansicht enthaltene DIV durch den aktualisierten Inhalt zu ersetzen.
Dabei verfügt der Benutzercontroller über eine Aktion mit dem Namen details, die Folgendes ausführt:
Dies setzt voraus, dass Ihre Teilansicht ein Container mit der ID ist,
detailsDiv
sodass Sie einfach das gesamte Objekt durch den Inhalt des Ergebnisses des Aufrufs ersetzen.Schaltfläche "Übergeordnete Ansicht"
User
ist der Name des Controllers und derdetails
Name der Aktion in@Url.Action()
. UserDetails Teilansichtquelle
Ich habe Ajax Load verwendet, um dies zu tun:
quelle
UserDetails
ein Name einer Aktion keine Teilansicht, oder?@Url.Action("ActionName","ControllerName", new { area = "AreaName" } )
stattdessen tun Handprogrammierung .@ Tvanfosson rockt mit seiner Antwort.
Ich würde jedoch eine Verbesserung innerhalb von js und eine kleine Controller-Überprüfung vorschlagen.
Wenn wir den
@Url
Helfer verwenden, um eine Aktion aufzurufen, erhalten wir ein formatiertes HTML. Es wäre besser, den Inhalt (.html
) zu aktualisieren, nicht das eigentliche Element (.replaceWith
).Mehr dazu unter: Was ist der Unterschied zwischen jQuerys replaceWith () und html ()?
Dies ist besonders nützlich in Bäumen, in denen der Inhalt mehrmals geändert werden kann.
Am Controller können wir die Aktion je nach Anforderer wiederverwenden:
quelle
Eine andere Sache, die Sie versuchen können (basierend auf der Antwort von tvanfosson), ist folgende:
Und dann im Skriptbereich Ihrer Seite:
Dadurch wird Ihre @ Html.RenderAction mit Ajax gerendert.
Und um alles fany sjmansy zu machen, können Sie einen Einblendeffekt mit diesem CSS hinzufügen:
Mann ich liebe mvc :-)
quelle
<div class="renderaction fade-in" ...></div>
Elemente.Sie müssen auf Ihrem Controller eine Aktion erstellen, die das gerenderte Ergebnis der Teilansicht oder des Steuerelements "UserDetails" zurückgibt. Verwenden Sie dann einfach ein HTTP-Get oder -Post von jQuery, um die Aktion aufzurufen und das gerenderte HTML anzuzeigen.
quelle
Verwenden Sie den Standard-Ajax-Aufruf, um das gleiche Ergebnis zu erzielen
quelle
Ich habe es so gemacht.
Details Methode:
quelle
Wenn Sie auf einen dynamisch generierten Wert verweisen müssen, können Sie auch Abfragezeichenfolgenparameter nach der @ URL.Action wie folgt anhängen:
quelle