Mehrere Formen in ASP.NET MVC

StackOverflow https://stackoverflow.com/questions/822751

  •  03-07-2019
  •  | 
  •  

Frage

Kontext
Let`s sagen, ich habe:
In Layout Site.Master: 

<div class="leftColumn">
    <asp:ContentPlaceHolder ID="MainContent" runat="server" />
</div>
<div class="rightColumn">
    <% Html.RenderPartial("_Login"); %>
    <asp:ContentPlaceHolder ID="SideContent" runat="server" />
</div>

Login PartialView wie folgt aussieht: 

<form action="/myApp/Account/Login" method="post">
    <input name="name" />Name<br />
    <input name="password" type="password" />Password<br />
    <button>Login</button>
</form>

Ist es möglich, nur Login-Widget Form, nicht die gesamte Content-Seite zu aktualisieren?

War es hilfreich?

Lösung

Wenn Sie einen http Post beziehen, nur ein Post eingeleitet (es kann auch durch Javascript initiiert werden kann) durch einen Submit-Button aus dem Formular wird an den Server gesendet werden.

Wenn Sie Ihre Formulare verschachtelt sind, dann wird dies nicht funktionieren. Die äußere Form wird immer an den Server senden.

In der HTML-Beispiel unten auf die Schaltfläche auf dem ersten Formular klicken, werden die Werte aus der zweiten Form an den Server senden. Ebenso die zweite Submit-Button klicken, werden die Werte aus der ersten Form veröffentlichen. 

<html>
...
  <body> 
    <div>

      <form action="/Login/Login" method="post">
        <input type="text" name="username" value="" />
        <input type="text" name="passowrd" value="" />
        <input type="submit" name="login" value="Login" />
      </form>


      <form action="/Login/AdminLogin" method="post">
        <input type="text" name="username" value="" />
        <input type="text" name="passowrd" value="" />
        <input type="submit" name="login" value="Login Admin" />
      </form>
    </div>
</body>
</html>

Wenn Sie nur aktualisieren möchten / ändern einer der Formularabschnitt, dann kann kein diese nicht ohne die Verwendung von Javascript getan werden, und Durchführen einer Javascript Post (auch bekannt als Ajax ).

Andere Tipps

Wenn Sie eine Controller-Methode erstellen, die eine Formcollection und Ihre Sicht akzeptiert hat zwei Formen definiert, wird der Formcollection zurückgegeben entweder mit Werten aus Form A oder Form B bestückt werden können Sie die Formcollection inspizieren und verzweigen Sie Ihre Logik basierend auf dem Wert darin. Wenn Sie die sehr explizit sein wollen könnten Sie die gleiche verborgene Variable auftreten haben in beiden Formen mit einem Wert, der Ihr Make Ihrer Wahl helfen würde.

Das ist ein Ansatz. es gibt ein paar Möglichkeiten, mit diesem Ich bin sicher, fertig zu werden.

Wenn Sie zwei einfache Formen haben, können Sie diese aproach verwenden:

Sie erstellen zwei verschiedene Teilansichten. 

@model CustomerInfoModel
@using (Ajax.BeginForm("CustomerInfo", "Customer", new AjaxOptions { HttpMethod = "Post", OnBegin = "InfoLoading", OnComplete = "InfoCompleted" }, new { id = "info", @class = "form-horizontal" }))
    {
    <input type="text" class="form-control" name="Name" id="Name" value="@Model.Name" />
    <input type="email" class="form-control" name="Email" id="Email"  value="@Model.Email" />
    <button type="submit" id="save-info" class="btn-medium red">Save</button>
    }

und 

@model CustomerPasswordChangeModel
@using (Ajax.BeginForm("CustomerPasswordChange", "Customer", new AjaxOptions { HttpMethod = "Post", OnBegin = "InfoLoading", OnComplete = "InfoCompleted" }, new { id = "change", @class = "form-horizontal" }))
{
<input type="password" class="form-control" name="OldPassword" id="OldPassword"  value="" />
<input type="password" class="form-control" name="NewPassword" id="NewPassword"  value="" />
<button type="submit" id="save-change" class="btn-medium red" autocomplete="off">Save</button>
}

In Ihrer geordneten Ansicht, 

@Html.Partial("CustomerInfo", Model.CustomerInfo)

und 

@Html.Partial("CustomerPasswordChange", Model.CustomerPasswordChange)

Controller: 

    [HttpPost]
    public ActionResult CustomerInfo([Bind(Include = "Name,Email")] CustomerInfoModel model)
    {
        if (ModelState.IsValid)
            return new Json(new { success=true, message="Updated.", errors=null);

// do you logic

        return new Json(new { success=false, message="", errors=getHtmlContent(ModelState.Values.SelectMany(v => v.Errors).ToList(), "ModelError"));
    }

    [HttpPost]
    public ActionResult CustomerPasswordChange([Bind(Include = "OldPassword,NewPassword")] CustomerPasswordChangeModel model)
    {
        if (ModelState.IsValid)
            return new Json(new { success=true, message="Updated.", errors=null);

// do you logic

        return new Json(new { success=false, message="", errors=getHtmlContent(ModelState.Values.SelectMany(v => v.Errors).ToList(), "ModelError"));
    }

Dies wird tun, was Sie tun wollen.

Hinweis: getHtmlContent Methode eine Fehlermeldung nur generiert auf Seite angezeigt werden. Nichts ist so etwas Besonderes. Ich kann es teilen, falls erforderlich.

Ihre Frage ist nicht ganz klar.

Aber soweit ich konnte verstehen, die Antwort ist wahrscheinlich ja. Sie können Sie auf der Benutzereingabe aktualisieren etwas abhängig wollen. 

if(pass != true) 
{ 
 ViewData["Message'] = "Hey your login failed!"; Return View("Login") 
}

Auf Viewpage 

<form action="/tralala/Account/Login" method="post"> 
  <input name="name" />Name<br /> 
  <input name="password" type="password" />Password<br /> 

  <button>Login</button> 
 <div style="color: red"><%=ViewData["Message"] %><div> 
</form>
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top