Modellkötés

A kliens (többnyire böngésző) és webszerver közti kommunikáció meglehetősen egyszerű - szöveges üzenetek alapján történik, mivel a kliens nem tud semmit arról, hogyan kezelje .NET objektumaidat. A régi, ASP Classic és ASP.NET WebForms időkben a modell frissítése emiatt nehézkes volt. Először írnod kellett egy űrlapot (FORM), ami tartalmaz minden mezőt, amit a felhasználó megváltoztathat. Amikor ez az űrlap visszaérkezett a szerverre, akkor minden mezőt ismét be kellett olvasnod, majd azok tartalmát a modellhez rendelni. Ha ezt a megközelítést használnánk ASP.NET MVC-ben is, akkor az valahogy így nézne ki:

<form method="post" action="/ModelBinding/UpdateFromOldSchoolForm">
    <input type="text" name="txtFirstName" value="@Model.FirstName" />
    <input type="text" name="txtLastName" value="@Model.LastName" />
    <input type="submit" value="Update" />
</form>

public IActionResult UpdateFromOldSchoolForm()
{
    WebUser webUser = LoadUserFromDatabase();

    webUser.FirstName = Request.Form["txtFirstName"];
    webUser.LastName = Request.Form["txtLastName"];

    UpdateUserInDatabase(webUser);

    return Content("User updated!");
}

Egy manuálisan készített űrlap, ami POST-olja az értékeket a metódusnak, ami aztán beolvassa az értékeket és hozzárendeli a modell objektumhoz. Nagyon alapszintű, régies megközelítés. Az ASP.NET MVC-vel viszont megjelent a modellkötés fogalma. Ez lehetővé teszi, hogy nézeteid a modelledben található információkból egy űrlapot generáljanak, de ami még hasznosabb, hogy az eredményt fogadó metódus az értékeket a megfelelő modell objektumként kapja meg, ahelyett hogy egy űrlapból stringeket kellene olvasson. A modellkötés mágiája segítségével a kliens és szerver közti minden lépésben objektumokkal dolgozhatsz. Lássuk, hogyan működik ez!

Modellkötés használata

Először is szükségünk van egy modellre. Ha nem tudod, mi az a modell, akkor javaslom, hogy ugorj pár cikkel visszább, és olvasd át őket. Egy egyszerű modellt (osztályt) írunk, ami a felhasználóról tárol információt:

public class WebUser
{
    public string FirstName { get; set; }
    public string LastName { get; set; }
}

A vezérlőnkben most ennek az osztálynak egy példányát adhatjuk a nézetnek. Egy valódi alkalmazásban alighanem ezt a WebUser példányt egy adatbázisból kapnánk, de az egyszerűség kedvéért itt most helyben egy újat fogunk csinálni:

[HttpGet]
public IActionResult SimpleBinding()  
{  
    return View(new WebUser() { FirstName = "John", LastName = "Doe" });  
}

Azzal, hogy az @model direktíva segítségével tudatjuk a nézettel, milyen modellre számítson, többféle segédmetódust használhatunk, amik asszisztálnak egy űrlap megalkotásában:

@using(var form = Html.BeginForm())
{
    <div>
    @Html.LabelFor(m => m.FirstName)
    @Html.TextBoxFor(m => m.FirstName)
    </div>

    <div>
    @Html.LabelFor(m => m.LastName)
    @Html.TextBoxFor(m => m.LastName)
    </div>

    <input type="submit" value="Submit" />
}

Az eredmény egy átlagos kinézetű űrlap lesz, a modelled tulajdonságainak megfelelő címkékkel és szövegdobozokkal:

Alapértelmezetten az űrlap ugyanarra az URL-re lesz visszaküldve, ahonnan az jött, ennek kezelésére szükségünk lesz egy POST-kezelő vezérlőmetódusra:

[HttpPost]
public IActionResult SimpleBinding(WebUser webUser)
{
    //TODO: Update in DB here...
    return Content($"User {webUser.FirstName} updated!");
}

A vezérlőakció csak egy paramétert kap, ugyanolyan típusút, mint az eredetileg használt modellünk: a WebUser típust. A háttérben az történik, hogy az ASP.NET MVC feldolgozza az űrlapot, majd a szerkeszthető mezőkben talált értékeket a WebUser osztály tulajdonságaihoz rendeli. Ez a modellkötés varázsa!

Összefoglaló

A modellkötésnek köszönhetően könnyebben kezelheted a modelljeid és nézeteid közötti viszonyt. Ebben a cikkben csak a felszínét kapargattuk ennek a témakörnek - a modellkötésben sokkal több lehetőség is rejlik, ahogy azt eljövendő cikkekben láthatod majd.