Ich bin sehr verwirrt mit dieser Teilansicht ...
Ich möchte eine Teilansicht in meine Hauptansicht laden ...
Hier ist das einfache Beispiel ...
Ich lade Index.cshtml der Aktion Homecontroller Index als Hauptseite.
in index.cshtml erstelle ich einen Link über
@Html.ActionLink("load partial view","Load","Home")
In HomeController füge ich eine neue Aktion mit dem Namen hinzu
public PartialViewResult Load()
{
return PartialView("_LoadView");
}
in _LoadView.cshmtl habe ich gerade eine
<div>
Welcome !!
</div>
ABER, wenn das Projekt ausgeführt wird, wird index.cshtml zuerst gerendert und zeigt mir den Link "Teilansicht laden" ... wenn ich darauf klicke, wird eine neue Seite aufgerufen, auf der die Begrüßungsnachricht von _LoadView.cshtml in die Datei index.cshtml gerendert wird .
Was kann falsch sein?
Hinweis: Ich möchte keine Seite über AJAX laden oder Ajax.ActionLink nicht verwenden
quelle
Ajax.ActionLink
in derUpdateTargetId
Kurzansicht platziert und die ID eines übergeordneten Divs festgelegt. Wenn ich jetzt auf den Link klicke, ersetzt das Ajax-Ergebnis die gesamte Seite.Ich hatte genau das gleiche Problem wie Leniel. Ich habe hier vorgeschlagene Korrekturen und ein Dutzend anderer Orte ausprobiert. Die Sache, die schließlich für mich funktionierte, war einfach hinzuzufügen
@Scripts.Render("~/bundles/jquery") @Scripts.Render("~/bundles/jqueryval")
zu meinem Layout ...
quelle
Wenn Sie dies mit einem
@Html.ActionLink()
tun, wird das Laden der PartialView als normale Anforderung behandelt, wenn Sie auf ein Ankerelement klicken, dh eine neue Seite mit der Antwort der PartialViewResult-Methode laden.Wenn Sie es sofort laden möchten, verwenden Sie
@Html.RenderPartial("_LoadView")
oder@Html.RenderAction("Load")
.Wenn Sie dies bei Benutzerinteraktion tun möchten (dh auf einen Link klicken), müssen Sie AJAX -> verwenden
@Ajax.ActionLink()
quelle
Für mich funktionierte dies, nachdem ich die AJAX Unobtrusive-Bibliothek über NuGet heruntergeladen hatte:
Fügen Sie in der Ansicht die Verweise auf jquery und AJAX Unobtrusive hinzu:
@Scripts.Render("~/bundles/jquery") <script src="~/Scripts/jquery.unobtrusive-ajax.min.js"> </script>
Als nächstes wollen wir mit Ajax ActionLink und div die Ergebnisse rendern:
@Ajax.ActionLink( "Click Here to Load the Partial View", "ActionName", null, new AjaxOptions { UpdateTargetId = "toUpdate" } ) <div id="toUpdate"></div>
quelle
Microsoft.jQuery.Unobtrusive.Ajax
. Dies trotz der Tatsache, dass ich jquery.unobstrusive-ajax.min.js installiert hatte. Danke, du hast mir viel Kopfschmerzen erspart.Wenn Sie den Inhalt Ihrer Teilansicht in Ihre Ansicht einfügen möchten, können Sie ihn verwenden
@Html.Partial("PartialViewName")
oder
{@Html.RenderPartial("PartialViewName");}
Wenn Sie eine Serveranforderung stellen und die Daten verarbeiten möchten, und dann die Teilansicht an Ihre Hauptansicht zurückgeben möchten, die mit den Daten gefüllt ist, die Sie verwenden können
... @Html.Action("Load", "Home") ... public PartialViewResult Load() { return PartialView("_LoadView"); }
Wenn Sie möchten, dass der Benutzer auf den Link klickt und dann die Daten der Teilansicht auffüllt, können Sie Folgendes verwenden:
@Ajax.ActionLink( "Click Here to Load the Partial View", "ActionName", "ControlerName", null, new AjaxOptions { UpdateTargetId = "toUpdate" } )
quelle
Kleine Woche zu den oben genannten
@Ajax.ActionLink( "Click Here to Load the Partial View", "ActionName", "ControlerName", null, new AjaxOptions { UpdateTargetId = "toUpdate" } ) <div id="toUpdate"></div>
quelle
RenderParital ist besser für die Leistung zu verwenden.
{@Html.RenderPartial("_LoadView");}
quelle