Selle peatüki ülejäänud osas vaatleme mõningaid MVC põhifunktsioone, luues lihtsa andmesisestusrakenduse. Me kiirendame selles jaotises asju veidi. Meie eesmärk on demonstreerida MVC-d tegevuses, nii et jätame mõned selgitused selle kohta, kuidas see kõik töötab. Kuid ärge muretsege, me käsitleme neid teemasid üksikasjalikult järgmistes peatükkides.

Visandame plaani

Kujutagem ette, et sõber on otsustanud korraldada aastavahetuse peo ja et ta on palunud meil luua veebisait, mis võimaldab tema sõpradel ja tuttavatel vastu võtta RSVP-kutse (allkiri kutsel, mis kutsub saajat RSVP-le osalema). sündmus). Sait peaks sisaldama järgmist:

• Koduleht, kus kuvatakse peoinfo
• Vorm, mida saab kasutada RSVP jaoks
• RSVP vormi kinnitamine, mis kuvab tänulehe
• Täidetud ja saadetud vastus peol osalemise nõusoleku kohta

Järgmistes osades lähtume peatüki alguses loodud MVC projektist ja lisame need võimalused. Saame teha loendi esimese üksuse, rakendades varem saadud teadmisi, see tähendab, et saame lisada HTML-i olemasolevatele vaadetele, kus see antakse detailne info peo kohta. B näitab täiendusi, mida tegime faili Views/Home/Index.cshtml.

Nimekiri 2-7: Partei teabe kuvamine

@( Paigutus = null; )

Oleme õigel teel. Kui käivitate rakenduse, näete peo kohta teavet või pigem selle teabe kohatäit, kuid saate aru. Näide on näidatud .

Joonis 2-12: Vaate lisamine

Andmemudeli disain

MVC-s M tähistab mudel, ja see on rakenduse kõige olulisem osa. Mudel on reaalsete objektide, protsesside ja reeglite esitus, mis määratlevad objekti, mida nimetatakse domeeni, meie rakendus. Mudel, mida sageli nimetatakse domeeni mudel, sisaldab C# objekte (tuntud kui domeeniobjektid), mis moodustavad meie rakenduse tuuma, ja meetodid, mis võimaldavad meil nendega manipuleerida. Vaated ja kontrollerid paljastavad domeeni klientidele järjepidevalt ning hästi läbimõeldud MVC-rakendus algab hästi läbimõeldud mudelist, mis toimib seejärel kontrollerite ja vaadete lisamisel fookuspunktina.

Me ei vaja PartyInvites rakenduse jaoks keerulist mudelit, kuid loome ühe domeeniklassi, mida kutsume GuestResponse'iks. See üksus vastutab RSVP-de salvestamise, kinnitamise ja kinnitamise eest.

Mudelklassi lisamine

MVC kokkuleppe kohaselt paigutatakse mudeli moodustavad klassid kausta Mudelid. Klõpsake paremklõps hõljutage kursorit Solution Exploreri aknas mudelite kohal ja valige hüpikmenüüst Lisa ja seejärel Klass. Nimetage faili GuestResponse.cs ja klõpsake klassi loomiseks nuppu Lisa. Muutke klassi sisu vastavalt.

Nõuanne

Kui teil pole klassi menüüelementi, jätsite ilmselt siluri tööle. Visual Studio. Visual Studio piirab muudatusi, mida saate rakenduse töötamise ajal projektis teha.

Nimekiri 2-8: GuestResponse'i domeeniklass

nimeruum PartyInvites.Models ( avalik klass GuestResponse ( avalik string Nimi ( hanki; määra; ) avalik string E-post ( hanki; määra; ) avalik string Telefon ( hanki; määra; ) public bool? WillAttend ( hanki; määra; ) ) )

Nõuanne

Võib-olla olete märganud, et atribuut WillAttend on bool tüüpi? (Nulleeritav ), see tähendab, et see võib olla tõene, väär või null. Selgitame seda selle peatüki hilisemas jaotises "Valideerimise lisamine".

Viide tegevusmeetodile

Üks meie rakenduse eesmärke on lisada RSVP-vorm, seega peame lisama sellele lingi meie Index.cshtml-vaatest, nagu on näidatud .

Nimekiri 2-9: RSVP vormi lingi lisamine

@( Paigutus = null; )

Html.ActionLink on abimeetod HTML. MVC Framework on loodud koos mugavate sisseehitatud abimeetodite komplektiga HTML-i töötlemine lingid, tekstisisendid, märkeruudud, valikud ja isegi kasutaja juhtelemendid. ActionLinki meetodil on kaks parameetrit: esimene on lingis kuvatav tekst ja teine ​​​​toiming, mis tehakse, kui kasutaja lingil klõpsab. Selgitame toetamist HTML meetodid peatükkides 19-21. Kuvatud on meie lisatud link.

Joonis 2-13: Lisage vaatele link

Kui hõljutate oma brauseris lingi kohal, näete, et link osutab aadressile http://yourserver/Home/RsvpForm. Meetod Html.ActionLink kontrollis meie rakenduse URL-i konfiguratsiooni ja tegi kindlaks, et /Home/RsvpForm on HomeControlleri toimingu RsvpForm URL. Pange tähele, et erinevalt traditsioonilistest ASP.NET-i rakendustest ei vasta MVC URL-id füüsilistele failidele. Igal toimingumeetodil on oma URL ja MVC kasutab nende URL-ide toiminguteks tõlkimiseks marsruutimissüsteemi ASP.NET.

Tegevusmeetodi loomine

Kui klõpsate lingil, näete viga 404 Ei leitud. Seda seetõttu, et me pole veel loonud tegevusmeetodit, mis ühtiks /Home/RsvpForm URL-iga. Teeme seda, lisades oma HomeControlleri klassi meetodi RsvpForm, nagu näidatud .

Nimekiri 2-10: Uue tegevusmeetodi lisamine kontrollerile

süsteemi kasutamine; kasutades System.Collections.Generic; kasutades System.Linq; kasutades System.Web; kasutades System.Web.Mvc; nimeruum PartyInvites.Controllers ( avalik klass HomeController: Controller ( public ViewResult Index() ( int tund = DateTime.Now.Hour; ViewBag.Greeting = tund< 12 ? "Good Morning" : "Good Afternoon"; return View(); } public ViewResult RsvpForm() { return View(); } } }

Tugevalt trükitud vaate lisamine

Tahame oma RsvpForm tegevusmeetodile vaate lisada, kuid kavatseme teha midagi enamat: see tähendab luua tugevasti trükitud esitus. Tugevalt trükitud vaated on loodud käsitlema teatud tüüpi domeeni. Kui täpsustame tüübi, millega soovime töötada (selles näites GuestResponse), pakub MVC lisafunktsioone, mis muudavad meie jaoks lihtsamaks.

Tähelepanu

Enne alustamist veenduge, et teie MVC projekt oleks kompileeritud. Kui lõite GuestResponse'i klassi, kuid ei kompileerinud seda, ei saa MVC luua tugevalt trükitud vaadet seda tüüpi. Rakenduse kompileerimiseks vali Visual Studio Build menüüst Build Solution.

Paremklõpsake toimingumeetodil RsvpForm ja valige vaate loomiseks hüpikmenüüst Lisa vaade. Märkige dialoogiaknas Vaate lisamine ruut Loo tugevasti trükitud vaade ja valige rippmenüüst valik GuestResponse. Tühjendage märkeruut Kasuta paigutust või põhilehte ja veenduge, et esitlusmootoriks on valitud Razor ja et suvand Scaffold template on seatud väärtusele Tühjenda, nagu näidatud .

Joonis 2-14: Tugevalt trükitud vaate lisamine

Klõpsake nuppu Lisa ja Visual Studio loob uus fail nimega RvspForm.cshtml ja avage see redigeerimiseks. Algset sisu näete aadressil. Nagu olete märganud, on see erinev HTML-faili, kuid see sisaldab väljendit Razor @model. Kohe näete, et see on tugevalt trükitud vaate ja selle pakutavate võimaluste võti.

Nimekiri 2-12: RsvpForm.cshtml faili esialgne sisu

@model PartyInvites.Models.GuestResponse@( Paigutus = null; )

Vormi ehitamine

Nüüd, kui oleme loonud tugevasti trükitud vaate, saame luua RsvpForm.cshtml sisu, et muuta see HTML-vormiks GuestResponse'i objektide redigeerimiseks. Muutke vaade sobivaks.

Nimekiri 2-13: Vormi esitamise loomine

@using(Html.BeginForm()) {

Teie nimi: @Html.TextBoxFor(x => x.Name)

Teie e-post: @Html.TextBoxFor(x => x.Email)

Teie telefon: @Html.TextBoxFor(x => x.Phone)

Kas osalete? @Html.DropDownListFor(x => x.WillAttend, new ( new SelectListItem() (tekst = "Jah, ma olen kohal", väärtus = bool.TrueString), new SelectListItem() (tekst = "Ei, ma ei saa tulla", väärtus = bool.FalseString) ), "Vali valik")

}

Mudelklassi GuestResponse iga atribuudi puhul kasutame sobiva HTML-i sisendi juhtelemendi renderdamiseks HTML-abimeetodit. Need meetodid võimaldavad teil valida lambda-avaldise abil atribuudi, millele sisendelement kuulub, näiteks järgmiselt:

@Html.TextBoxFor(x => x.Phone)

Meetod HTML TextBoxFor abimees genereerib sisendelemendi jaoks HTML-i, määrab tüübi parameetri tekstiks ning ID ja nime atribuudiks Telefon , mis on valitud domeeniklassi atribuudi nimi, näiteks järgmiselt:

See mugav funktsioon töötab, kuna meie RsvpForm-vaade on tugevasti trükitud ja oleme MVC-le öelnud, et GuestResponse on tüüp, mida tahame vaatega käsitleda, nii et HTML-i abistajad saavad avaldise @mudel abil välja mõelda, millist tüüpi andmeid me lugeda tahame. .

Ärge muretsege, kui te pole C# lambda avaldistega tuttav. Me käsitleme neid 4. peatükis, kuid alternatiivina lambda-avaldistele võite mudelitüübi atribuudi nimele viidata stringina, näiteks järgmiselt:

@Html.TextBox("E-post")

Leiame, et lambda-avaldise tehnika aitab meil vältida trükivigu mudelitüübi atribuudi nimes, kuna Visual Studio IntelliSense hüppab ja võimaldab meil atribuudi automaatselt valida, nagu näidatud .

Joonis 2-15: Visual Studio IntelliSense lambda-avaldiste jaoks HTML-i abistajates

Teine mugav abimeetod on Html.BeginForm, mis genereerib HTML-vormi elemendi, mis on konfigureeritud edastama andmeid tagasi tegevusmeetodile. Kuna me ei andnud abimeetodile parameetreid edasi, eeldatakse, et tahame sama URL-i tagasi anda. Kena trikk on mähkida see C#-sse, kasutades avaldust, näiteks järgmiselt:

Tavaliselt tagab kasutamise käsk sellisel kasutamisel, et objekt kõrvaldatakse, kui see ulatub väljapoole. Seda kasutatakse laialdaselt andmebaasiga ühenduse loomiseks, näiteks tagamaks, et see suletakse pärast päringu lõpetamist. (See rakendus märksõna kasutamine erineb selle poolest, et see puudutab klassi ulatust).

Objekti kustutamise asemel sulgeb abimees HtmlBeginForm HTML-vormi elemendi, kui see ulatub väljapoole. See tähendab, et abimeetod Html.BeginForm loob vormielemendi mõlemad osad järgmiselt:

Ärge muretsege, kui te pole C#-s objektide kustutamisega tuttav. Meie eesmärk on praegu näidata, kuidas luua vormi kasutades HTML-abistaja meetodit. Vormi näete vaates RsvpForm, kui käivitate rakenduse ja klõpsate linki RSVP Now. Tulemust näidatakse.

Joonis 2-16: RspvFormi vaade

Märge

See ei ole raamat CSS-i ega veebidisaini kohta. Enamasti loome näiteid, mille välimust võiks kirjeldada kui aegunud (kuigi eelistame seda terminit klassikaline, mille puhul ta tunneb vähem tähelepanuta). MVC vaated genereerivad väga puhast ja lihtsat HTML-i ning teil on täielik kontroll elementide paigutuse ja klasside üle, kuhu need kuuluvad, nii et teil ei teki probleeme disainitööriistade või valmismallide kasutamisel, et teie MVC projekt ilusaks näeks.

Vormi töötlemine

Me pole MVC-le öelnud, mida me teha tahame, kui vorm serverisse saadetakse. Praegu eemaldab nupul Esita RSVP klõpsamine lihtsalt kõik vormi sisestatud väärtused. Selle põhjuseks on asjaolu, et vorm saadetakse tagasi kodukontrolleri RsvpForm toimingumeetodile, mis lihtsalt käsib MVC-l vaadet uuesti töödelda.

Märge

Teid võib üllatada asjaolu, et sisend kaob vaate uuesti töötlemisel. Kui jah, siis olete tõenäoliselt arendanud rakendusi, kasutades ASP.NET Web Forms, mis salvestab selles olukorras andmed automaatselt. Peagi näitame teile, kuidas MVC-ga sama tulemust saavutada.

Esitatud vormiandmete vastuvõtmiseks ja töötlemiseks teeme midagi tarka ja lahedat. Lisame teise RsvpForm toimingumeetodi järgmise loomiseks:

• Meetod, mis vastab HTTP GET-i päringutele: GET-päring on see, millega brauser tegeleb pärast iga lingiklõpsu. See suvand vastutab esialgse tühja vormi kuvamise eest, kui keegi külastab esimest korda /Home/RsvpForm.
• Meetod, mis vastab HTTP POST-i päringutele: Vaikimisi saadab brauser POST-i päringutena HTML.BeginForm() abil töödeldud vormid. See valik vastutab esitatud andmete vastuvõtmise ja nendega edasise tegevuse otsustamise eest.

GET- ja POST-päringute käsitlemine eraldi C#-meetodites aitab meie koodi korras hoida, kuna mõlemal meetodil on erinevad kohustused. Mõlemat toimingumeetodit kutsutakse välja sama URL-i kaudu, kuid MVC tagab sobiva meetodi kutsumise sõltuvalt sellest, kas tegemist on GET- või POST-päringuga. B näitab muudatusi, mida peame HomeController klassis tegema.

Nimekiri 2-14: Toimingumeetodi lisamine POST-päringute toetamiseks

süsteemi kasutamine; kasutades System.Collections.Generic; kasutades System.Linq; kasutades System.Web; kasutades System.Web.Mvc; kasutades PartyInvites.Models; nimeruum PartyInvites.Controllers ( avalik klass HomeController: Controller ( public ViewResult Index() ( int tund = DateTime.Now.Hour; ViewBag.Greeting = tund< 12 ? "Good Morning" : "Good Afternoon"; return View(); } public ViewResult RsvpForm() (taga vaade(); ) avalik ViewResult RsvpForm (külalise vastuse külalisvastus) { // TODO: E-posti vastus peo korraldajale return View("Aitäh", guestResponse); } } }

Oleme lisanud oma olemasolevale RsvpForm tegevusmeetodile atribuudi HttpGet. See ütleb MVC-le, et seda meetodit tuleks kasutada ainult GET-päringute jaoks. Seejärel lisasime RsvpFormi ülekoormuse, mis võtab parameetri GuestResponse ja rakendab atribuuti HttpPost. Atribuut ütleb MVC-le seda uus meetod tegeleb POST-i päringutega. Pange tähele, et importisime ka nimeruumi PartyInvites.Models – nii saame viidata mudelitüübile GuestResponse, ilma et peaksime klassi nime määrama. Järgmistes jaotistes käsitleme seda, kuidas meie loendi lisandmoodulid töötavad.

Mudelandmete sidumise kasutamine

RsvpForm tegevusmeetodi ülekoormuse esimene variant käsitleb sama vaadet nagu varem. See genereerib vormis näidatud vormi. Teine ülekoormatud meetodi valik on parameetri tõttu huvitavam, kuid arvestades, et toimingumeetodit kutsutakse vastuseks HTTP POST-i päringule ja GuestResponse on C#-klassi tüüpi, kuidas neid kombineerida?

Vastus on mudeli andmete sidumine– Äärmiselt kasulik MVC-funktsioon, kus sisendandmeid sõelutakse ja HTTP-päringu võtme/väärtuse paare kasutatakse domeenimudeli tüübi atribuutide täitmiseks. See protsess on vastupidine HTML-abiliste kasutamisele; Just siis genereerisime kliendile saatmiseks vormiandmete loomisel HTML-i sisendelemendid, kus mudeliklassi omaduste nimedest saadi atribuutide id ja name väärtused.

Seevastu mudeliandmete sidumise puhul kasutatakse sisendelementide nimesid mudeliklassi eksemplari atribuutide väärtuste täpsustamiseks, mis seejärel edastatakse meie POST-i toega tegevusmeetodile.

Andmete esitusmudel on võimas ja kohandatav funktsioon, mis välistab HTTP-päringutega otse töötamise ja võimaldab meil töötada C#-objektidega, mitte tegeleda Request.Form ja Request.QueryString väärtustega. Objekti GuestResponse, mis edastatakse parameetrina meie tegevusmeetodile, täidetakse automaatselt vormiväljade andmetega. Peatükis 22 vaatleme üksikasjalikult andmete esitusmudelit, sealhulgas seda, kuidas seda saab kohandada.

Teiste vaadete käsitlemine

RsvpFormi tegevusmeetodi ülekoormuse teine ​​variant näitab ka seda, kuidas saame käskida MVC-l vastuseks päringule töödelda konkreetset vaadet, mitte vaikevaadet. Siin on vastav väljend:

return View("Aitäh", guestResponse);

See vaatemeetodi kutse annab MVC-le käsu leida ja töödelda vaade, mille nimi on Aitäh , ning edastada vaatele meie GuestResponse'i objekt. Meie määratud vaate loomiseks paremklõpsake ühel HomeControlleri meetodil ja valige hüpikmenüüst Lisa vaade. Määrake vaate nimeks Aitäh, nagu näidatud .

Joonis 2-17: Tänuvaate lisamine

Loome veel ühe tugevasti trükitud vaate, seega märkige see ruut dialoogiboksis Vaade lisamine. Selle vaate jaoks valitud andmeklass peab ühtima klassiga, mille andsime vaatele meetodil Vaade. Seega veenduge, et rippmenüüst oleks valitud GuestResponse. Veenduge, et ruut Kasuta paigutust või juhtlehte on märkimata, Vaatemootori seadeks on Razor ja Scaffold malliks on määratud Tühi.

Uue vaate loomiseks klõpsake nuppu Lisa. Kuna vaade on seotud kodukontrolleriga, loob MVC vaate kujul ~/Views/Home/Thanks.cshtml . Muutke uut vaadet, et see vastaks: tõstsime esile selle, mida on vaja lisada.

Nimekiri 2-15: Vaata Aitäh

@model PartyInvites.Models.GuestResponse @( Layout = null; )

Tänuvaade kasutab Razorit sisu kuvamiseks atribuudi GuestResponse väärtuse põhjal, mille edastasime RsvpForm toimingumeetodis vaatemeetodile. Operaator Razor @model määrab domeenimudeli tüübi, millega vaade on seotud. Domeeniobjekti atribuudi väärtusele juurdepääsuks kasutame mudelit. Kinnistu nimi. Näiteks atribuudi Name väärtuse saamiseks kutsume välja Mudel.Nimi. Ärge muretsege, kui te Razori süntaksist aru ei saa, me selgitame seda üksikasjalikult 5. peatükis.

Nüüd, kui oleme tänuvaate loonud, on meil olemas põhiline töönäide vormide töötlemisest MVC abil.

Käivitage rakendus Visual Studios, klõpsake lingil RSVP Now, lisage vormi andmed ja klõpsake nuppu Esita RSVP. Näete tulemust (kuigi see võib erineda, kui teie nimi pole Joe ja olete öelnud, et ei saa osaleda).

Joonis 2-18: Töödeldud vaade Aitäh

Valideerimise lisamine

Nüüd oleme valmis oma rakendusele valideerimise lisama. Kui me seda ei teeks, saaksid meie kasutajad sisestada mõttetuid andmeid või isegi esitada tühja vormi.

MVC-rakenduses rakendatakse valideerimist tavaliselt domeenimudelile, mitte kasutajaliidesele. See tähendab, et me määratleme oma valideerimiskriteeriumid ühes kohas ja need jõustuvad kõikjal kasutatavas mudeliklassis. ASP.NET MVC toetab nimeruumi System.ComponentModel.DataAnnotations atribuutidega määratletud valideerimisreegleid. See näitab, kuidas neid atribuute saab rakendada mudeliklassile GuestResponse.

Nimekiri 2-16: Valideerimise rakendamine mudeliklassile GuestResponse

kasutades System.ComponentModel.DataAnnotations; nimeruum PartyInvites.Models ( avalik klass GuestResponse ( avalik string Nimi ( hanki; määra; ) avalik string E-post ( hanki; määra; ) avalik string Telefon ( hanki; määra; ) avalik bool? WillAttend(get;set;)))

Valideerimisreeglid on näidatud paksus kirjas. MVC avastab automaatselt atribuudid ja kasutab neid andmete kinnitamiseks andmemudeli esituse ajal. Pange tähele, et importisime valideerimisreegleid sisaldava nimeruumi, et saaksime neile viidata ilma nende nimesid täpsustamata.

Nõuanne

Nagu varem märgitud, kasutasime tüüpi bool? atribuudi WillAttend jaoks, nii et saime rakendada atribuuti Required validation. Kui kasutaksime tavalist tõeväärtust , saaks tänu andmemudelile saadav väärtus olla ainult tõene või väär ja me ei saaks öelda, kas kasutaja valis väärtuse. Tüüp bool? sellel on kolm võimalikku väärtust: true, false ja null. nullväärtus kasutatakse juhul, kui kasutaja pole väärtust valinud ja see põhjustab atribuudi Required teatamise valideerimisveast.

Saame kontrollida, kas valideerimisel oli viga, kasutades meie kontrolleriklassi atribuuti ModelState.IsValid. See näitab, kuidas seda saab teha meie RsvpFormi tegevusmeetodis koos POST-i toega.

Nimekiri 2-17: Vormi kinnitamise ajal vigade kontrollimine

public ViewResult RsvpForm(GuestResponse guestResponse) ( kui (ModelState.IsValid) { // TODO: E-posti vastus peo korraldajale return View("Aitäh", guestResponse); } muidu { // on valideerimisviga return View(); } }

Kui valideerimisviga pole, käsime MVC-l töödelda tänuvaadet nagu varem. Valideerimisvea korral töötleme RsvpForm-vaadet uuesti, kutsudes välja meetodi View ilma parameetriteta.

Lihtsalt vormi kuvamine tõrke korral ei ole eriti kasulik, me peame andma kasutajale teavet selle kohta, milles probleem on ja miks me ei saa tema vormi vastu võtta. Teeme seda kasutades RsvpForm-vaates abimeetodit Html.ValidationSummary, nagu näidatud .

Nimekiri 2-18: Html.ValidationSummary abimeetodi kasutamine

@model PartyInvites.Models.GuestResponse @( Layout = null; ) @using(Html.BeginForm()) ( @Html.ValidationSummary()

Teie nimi: @Html.TextBoxFor(x => x.Name)

Teie e-post: @Html.TextBoxFor(x => x.Email)

Teie telefon: @Html.TextBoxFor(x => x.Phone)

Kas osalete? @Html.DropDownListFor(x =>

}

Kui vigu pole, loob meetod Html.ValidationSummary vormi kohatäidisena peidetud loendiüksuse. MVC muudab kohatäite nähtavaks ja lisab valideerimisatribuutidega määratletud veateated. Saate vaadata, kuidas see välja näeb.

Joonis 2-19: Valideerimistulemuste kokkuvõte

Kasutajale ei kuvata tänuvaadet enne, kui kõik klassile GuestResponse rakendatud valideerimisreeglid on täidetud. Pange tähele, et vormi sisestatud andmed on salvestatud ja kuvatakse uuesti, kui kuvatakse vaade koos valideerimise kokkuvõttega. See on andmete linkimise teine ​​eelis.

Märge

Kui olete töötanud rakendusega ASP.NET Web Forms, siis teate, et Web Formsil on "serveri juhtelementide" kontseptsioon, mis salvestab oleku, jadades väärtused peidetud vormiväljale __VIEWSTATE. ASP.NET MVC andmete sidumine ei ole veebivormide kontseptsiooniga seotud serveri elemendid juhtimine, andmete tagastamine või vaatamise olek. ASP.NET MVC ei lisa renderdatud HTML-lehtedele peidetud välja __VIEWSTATE.

Kehtetute väljade esiletõstmine

HTML-i abimeetoditel, mis loovad tekstivälju, ripploendeid ja muid elemente, on väga mugav funktsioon, mida saab kasutada koos andmete sidumisega. Sama mehhanismi, mis salvestab kasutaja sisendi vormi, saab kasutada ka üksikute väljade esiletõstmiseks, mille valideerimine ebaõnnestub.

Kui mudeliklassi atribuuti ei kinnitata, genereerivad HTML-i abimeetodid veidi erineva HTML-i. Näiteks siin on HTML, mis genereerib väljakutse Html.TextBoxFor (x => x.Name), kui valideerimisviga pole:

Ja siin on HTML, mis genereerib sama kõne, kui kasutaja väärtust ei andnud (mis on valideerimisviga, kuna rakendasime mudeliklassis GuestResponse atribuudi Name atribuudi Required):

class="input-validation-error" data-val="true" data-val-required="Palun sisestage oma nimi" id="Nimi" name="Nimi" type="text" value="" />

Oleme erinevused esile toonud. See abimeetod on lisanud klassi nimega input-validation-error . Saame seda funktsiooni ära kasutada, luues tabeli CSS-stiilid, mis sisaldab selle klassi stiile ja teisi, mis kasutavad erinevaid HTML-i abistajaid.

MVC-projektide puhul on tavaks, et staatiline sisu, näiteks CSS-i stiililehed, paigutatakse kausta nimega sisu. Loosime kausta Sisu, paremklõpsates Solution Exploreris projekti PartyInvites ja valides hüpikmenüüst käsu Add New Folder. Loosime laaditabeli, paremklõpsates kausta Sisu, valides Lisa uus üksus ja seejärel valides dialoogiboksis Lisa uus üksus suvandi Style Sheet. Panime oma stiilitabelile nimeks Site.css, mis on nimi, mida Visual Studio kasutab projekti loomisel, kasutades MVC malli, mis ei ole tühi. Saate vaadata faili Content/Site.css sisu.

Nimekiri 2-19: Sisu/Site.css faili sisu

.field-validation-error (värv: #f00;) .field-validation-valid (kuva: puudub;) .input-validation-error (ääris: 1px solid #f00; taustavärv: #tasu; ) .validation- summary-errors (font-weight: bold; color: #f00;).validation-summary-valid (kuva: puudub;)

Selle stiililehe kasutamiseks lisasime uue lingi RsvpForm-vaate peaosale, nagu on näidatud . Lisate vaadetele lingielemente samamoodi nagu tavalises staatilises HTML-failis.

Nimekiri 2-20: RsvpFormi vaatesse lingielemendi lisamine

@model PartyInvites.Models.GuestResponse @( Layout = null; ) @using (Html.BeginForm()) ( @Html.ValidationSummary()

Teie nimi: @Html.TextBoxFor(x => x.Name)

Teie e-post: @Html.TextBoxFor(x => x.Email)

Teie telefon: @Html.TextBoxFor(x => x.Phone)

Kas osalete? @Html.DropDownListFor(x => x.WillAttend, new ( new SelectListItem()) (Tekst = "Jah, ma olen kohal", Väärtus = bool.TrueString), uus SelectListItem() (Tekst = "Ei, ma saan "t come", Value = bool.FalseString) ), "Vali valik")

}

Nõuanne

Kui kasutasite MVC 3, võite eeldada, et lisame vaatele CSS-faili, määrates atribuudiks href @Href("~/Content/Site.css") või @Url.Content("~/Content/Site .css") . MVC 4 puhul tuvastab Razor automaatselt atribuudid, mis algavad tähega ~/, ja lisab teie eest automaatselt @Href või @Url.

Kui vea põhjustanud andmed esitati, nagu näidatud , kuvatakse nüüd visuaalselt ilmsem valideerimisviga.

Joonis 2-20: Automaatselt esile tõstetud valideerimisvead

Täiendame näidet

Meie näidisrakenduse viimane nõue on saata meie sõbrale peokorraldajale täidetud RSVP-dega e-kiri. Seda saaksime teha, lisades toimingumeetodi meilisõnumi loomiseks ja saatmiseks .NET Frameworki meiliklasside abil. Selle asemel kasutame WebMaili abimeeste meetodit. See ei kuulu MVC reguleerimisalasse, kuid võimaldab meil selle näite lõpule viia, ilma et peaksime takerduma teiste meili saatjate loomise üksikasjadesse.

Märge

Kasutasime WebMaili abimeeste meetodit, kuna see võimaldab meil demonstreerida e-kirjade saatmist minimaalse pingutusega. Kuid tavaolukorras eelistaksime selle funktsiooni tegevusmeetodile maha laadida. Selgitame, miks, kui kirjeldame arhitektuuri MVC muster 3. peatükis.

Soovime, et tänuvaate töötlemisel saadetaks meilisõnum. B näitab muudatusi, mida peame tegema.

Nimekiri 2-21: WebMaili abimehe meetodi kasutamine

@model PartyInvites.Models.GuestResponse @( Layout = null; ) @{ proovi { WebMail.SmtpServer = "smtp.example.com"; WebMail.SmtpPort = 587; WebMail.EnableSsl = tõene; WebMail.UserName = "minuSmtpKasutajanimi"; WebMail.Password = "mySmtpPassword"; WebMail.From = " [e-postiga kaitstud]"; WebMail.Send(" [e-postiga kaitstud]", "RSVP teade", Model.Name + " on " + ((Model.WillAttend ?? vale) ? "" : "mitte") + "osalemine"); } püüda (erand) { @:Kahjuks ei saanud me teie vastuse kinnitamiseks meili saata. } }

Lisasime Razor-avaldise, mis kasutab WebMaili abimeetodit, et konfigureerida teavet meie meiliserveri kohta, sealhulgas serveri nime, seda, kas server vajab SSL-ühendust, ja kontoteavet. Kui oleme kõik seadistanud, kasutame meili saatmiseks meetodit WebMail.Send.

Lisasime proovi...catch blokki kogu meilikoodi, et saaksime kasutajat hoiatada, kui meili ei saadetud. Teeme seda tänuvaate väljundile tekstiploki lisamisega. Parem oleks välja panna eraldi esitlus vead, kui meili ei saanud saata, kuid tahtsime oma esimese MVC rakendusega selle lihtsana hoida.

Paljud veebisaidid sisaldavad sisu, mis on saadaval ainult inimestele, kes on sisse loginud (st kes on autentitud). Vaikimisi pakub ASP.NET veebisaidi projektimalle, mis sisaldavad lehti, mis võimaldavad teil autentimistoiminguid täita.

Selles juhendis illustreeritud ASP.NET-i veebiprojekti mall on Visual Studio 2010 uus.

See ülevaade näitab, kuidas kasutada ASP.NET-i veebiprojekti malli põhiliste sisselogimisfunktsioonidega veebisaidi loomiseks.

Selles ülevaates illustreeritud ülesanded hõlmavad järgmist:

ASP.NET-i veebisaidi loomine.

Liikmetele mõeldud lehe loomine. Leheküljele pääsevad ligi ainult autentitud kasutajad (kasutajad, kes on sisse logitud).

Registreerimislehe kasutamine, mis võimaldab kasutajatel registreeruda ja luua uue konto.

Sisselogimine ja juurdepääs teabele, mis on saadaval ainult autentitud kasutajatele.

Parooli muutmise lehe kasutamine, mis võimaldab kasutajatel, kellel on konto, oma parooli muuta.

Parooli muutmise lehe juurdepääsetavaks tegemine autentitud kasutajatele (kuid ainult autentitud kasutajatele).

Eeldused

Selle juhendi lõpuleviimiseks vajate:

Microsoft Visual Veebiarendaja 2010 Express või Visual Studio 2010.

SQL Server Express installitud teie arvutisse kohapeal. Teavet SQL Server Expressi installimise kohta leiate teemast Kuidas: ühenduda AdventureWorksLT andmebaasiga MDF-faili abil.

Uue veebisaidi projekti loomine

Alustuseks loote uue ASP.NET-i veebisaidi projekti. Kasutatav projektimall sisaldab paljusid elemente, mis on vajalikud autentimist toetava saidi loomiseks.

See ülevaade kasutab veebisaidi projekti. Selle asemel võite kasutada veebirakenduse projekti. Lisateavet nende veebiprojektitüüpide erinevuste kohta leiate jaotisest Veebirakendusprojektid ja veebisaidiprojektid.

Uue ASP.NET-i veebisaidi loomiseks

Käivitage Visual Studio või Visual Web Developer.

Aastal Fail menüü, klõpsake Uus veebisait. (Kui te seda valikut ei näe, klõpsake nuppu Uus ja seejärel klõpsake Veebisait.)

The Uus veebisait kuvatakse dialoogiboks.

Under Installitud mallid, klõpsake Visual Basic või C# ja seejärel valige ASP.NET veebisait.

Aastal Veebi asukoht kasti, valige Failisüsteem ja sisestage selle kausta nimi, kus soovite veebisaidi lehti hoida. Näiteks sisestage kausta nimi C:\Websites\Login ja seejärel klõpsake Okei.

Visual Studio loob kausta ja avab veebisaidi Allikas vaade. Pange tähele, et juurveebisait sisaldab mitut faili ja kausta, sealhulgas kausta Konto, faili Web.config, lehti About.aspx ja Default.aspx ning pealehte Site.master.

Veebisaidi avaleht kuvatakse brauseris. Pange tähele menüüelemente ( Kodu, Umbes) ja Logi sisse hüperlink.

Sulgege brauser.

Ainult liikmetele mõeldud lehe loomine

Selles jaotises loote ainult liikmetele mõeldud lehe. Sellele lehele pääsevad ligi ainult kasutajad, kes on sisse logitud (autentitud kasutajad). Lisate juhtlehele juhtelemendi, et suunata autentitud kasutajad ainult liikmetele mõeldud lehele. Kui kasutajad, kes pole sisse logitud (anonüümsed kasutajad), klõpsavad liikmetele mõeldud hüperlinki, suunatakse nad sisselogimislehele, kus nad saavad sisse logida või konto luua.

Ainult liikmetele mõeldud lehe loomiseks

sisse Lahenduste uurija, paremklõpsake kaustal Konto ja seejärel klõpsake Lisa uus üksus.

Veenduge, et loote uut lehte kaustas Konto.

Aastal Uued veebisaidid dialoogiboksis valige Veebivorm.

Aastal Nimi tekstikasti, sisestage MembersOnly.aspx.

Valige Valige juhtleht märkeruut ja seejärel klõpsake Lisama.

The Valige juhtleht kuvatakse dialoogiboks.

Under Kaustade sisu,valige Site.master ja seejärel klõpsake Okei.

Leht MembersOnly.aspx luuakse kausta Konto. Leht on lehe Site.master sisuleht.

sisse Lahenduste uurija, topeltklõpsake lehel MemberOnly.aspx selle avamiseks ja seejärel lülituge lehele Disain vaade.

Lisage avalehele sisu.

Näiteks saate lisada "Tere tulemast ainult liikmetele mõeldud lehele. Olete edukalt sisse loginud."

Lisaks teie loodud lehele sisaldab kaust Konto järgmisi lehti ja faile:

Register.aspx. See leht võimaldab uutel kasutajatel konto luua.

Login.aspx leht. See küsib kasutajanime ja parooli.

ChangePassword.aspx. See leht võimaldab registreeritud kasutajatel oma parooli muuta.

ChangePasswordSuccess.aspx. See leht kuvatakse, kui kasutajad on edukalt oma parooli muutnud.

Web.config fail.

Vaikimisi pole konto kaustas olevad lehed anonüümsetele kasutajatele juurdepääsetavad, välja arvatud leheküljed Register.aspx ja Login.aspx. Sätted, mis määravad juurdepääsu konto kaustas olevatele lehtedele, on konfigureeritud selle kausta failis Web.config. Sätted, mis määravad juurdepääsu sisselogimislehele, on konfigureeritud juurfailis Web.config.

Aastal Omadused aknad, muutke atribuut Text väärtuseks Muuda parooli. Võite nõustuda vaike-ID-ga.

Aastal Omadused aken, klõpsake NavigateUrl ja klõpsake ellipsil ( ... ) nuppu.

The Valige URL kuvatakse dialoogiboks.

Under Projekti kaustad, klõpsake Konto.

Under Kausta sisu Okei.

Lehe käivitamiseks vajutage klahvikombinatsiooni CTRL+F5.

Pange tähele, et Muuda salasõna link on juurdepääsetav, kui te pole sisse logitud.

Klõpsake Muuda salasõna.

Teid suunatakse sisselogimislehele sest parooli muutmise leht on juurdepääsetav ainult autentitud kasutajatele.

Sisestage varem loodud kasutajanimi ja parool ning seejärel klõpsake nuppu Logi sisse.

Klõpsake Logi välja.

Avalehele naasmisel sulgege brauser.

Järgmisena muudate Muuda salasõna hüperlink, et see oleks juurdepääsetav ainult kasutajatele, on sisse logitud. Selleks lisate hüperlingi juhtlehe HeadLoginView juhtelemendile.

Parooli muutmise lingi kättesaadavaks tegemiseks ainult sisselogitud kasutajatele

sisse Lahenduste uurija, topeltklõpsake selle avamiseks Site.master.aspx ja seejärel lülitage sisse Disain vaade.

Kustuta Muuda salasõna hüperlink, mille olete varem loonud.

Vaheta Allikas vaade.

Alates Standard sõlm Tööriistakast, lohistage juhtelement LoggedInTemplate elementi, mis asub LoginView juhtelemendi sees.

Määrake atribuudi Tekst väärtuseks Muuda parooli.

Pärast atribuuti runat="server" tippige "NavigateUrl=" ja seejärel topeltklõpsake Valige URL... hüpikakende loendist.

The Valige projekti üksus kuvatakse dialoogiboks.

Under Projekti kaustad, klõpsake Konto.

Under Sisu kaust, valige ChangePassword.aspx ja seejärel klõpsake Okei.

Hüperlingi märgistus sarnaneb järgmisega:

Muuda salasõna

Pange tähele, et seda hüperlinki ei kuvata Disain vaade, sest LoggedInTemplate elemendi sisu ei ole vaikimisi nähtav.

Veebisaidi testimine

Nüüd saate testida veebisaidi parooli muutmise funktsiooni.

Parooli muutmise lehe testimiseks

Saidi käivitamiseks vajutage klahvikombinatsiooni CTRL+F5.

Avaleht kuvatakse, kuid Muuda teie parool link pole nähtav.

Klõpsake Logi sisse ja sisestage oma kasutajanimi ja parool.

Teid suunatakse avalehele. Pange tähele, et teie nimi ja Muutke oma parool link on nüüd nähtav.

Klõpsake Ainult liikmed.

Teid suunatakse ainult liikmetele mõeldud lehele.

Klõpsake Muutke oma parool.

Kuvatakse parooli muutmise leht.

Sisestage uus parool.

Klõpsake Muuda salasõna. Kui muudatus õnnestub, kuvatakse õnnestumise leht.

Uue parooli testimine

Järgmisena kasutate oma uut parooli, et uuesti sisse logida ja pääseda ainult liikmetele mõeldud lehele.

Uue parooli testimiseks

Klõpsake Logi välja. Teid suunatakse avalehele, mida anonüümsed kasutajad näevad.

Klõpsake Logi sisse.

Sisestage oma kasutajanimi ja uus parool ja seejärel klõpsake Logi sisse.

Teid suunatakse avalehele. Nüüd pääsete juurde sisule, mis on saadaval autentitud kasutajatele. .

Klõpsake Ainult liikmed.

Teid suunatakse ainult liikmetele mõeldud lehele. Kui proovite sisse logida oma vana parooliga, autentimine ebaõnnestub.

Sulgege brauser.

Järgmised sammud

Selles juhendis kasutasite kasutajaid autentiva veebisaidi loomiseks lehti, mis on osa ASP.NET-i veebisaidi projektimallist. Soovi korral saate luua ka oma sisselogimislehed, et pakkuda samu funktsioone, mida on kirjeldatud juhendis. Lisateabe saamiseks vaadake .

Täna tahan tuua 10 head põhjust, miks ASP.NET algajatele kõige sobivam:

Kui töötate juba PHP või Javaga (või isegi .NET), või kui soovite lihtsalt aru saada, kuidas veebirakendusi luua, siis soovitan teil kaaluda ASP.NET-i.

1. System.Webi puudumine

Meie, WebFormi kasutajate jaoks ei saa me veebirakenduste arendamisel ilma selleta hakkama. Kui otsustate üle minna versioonile ASP.NET MVC Core 1.0, siis välistab see suhtluse System.Webi teegiga, mis võimaldab teil kiirendada ASP.NET-põhise saidi laadimist ja toimimist.

2. Uus ja täiustatud 2016 aasta mudel

ASP.NET MVC 4 algajatele ja ASP.NET MVC 5 on unustusehõlma vajunud... Mõni aeg tagasi kirjutati .NET täielikult ümber ja nimetati ümber ASP.NET Core 1.0-ks. See muutis arendajate elu veelgi lihtsamaks. Kompileerimise etapp jäeti tavapärasest koodi kirjutamise, koostamise ja testimise tsüklist välja. See kiirendab oluliselt arendusprotsessi.

3. Loomulikum tunne

Olen olnud Microsoftis arendaja alates klassikalise ASP-i aegadest ja WebFormsile üle minnes ei tundunud üleminek sugugi loomulik. MVC tulekuga muutus veebirakenduste arendamise protsess loomulikumaks ja mulle meeldis selline töövorm. MVC-l pole ViewState'i ega IsPostbacki ja te ei pea nende pärast kogu aeg muretsema. Kõik on väga sarnane PHP-ga.

4. Koolis populaarseim

Kuna ASP.NET põhineb ühel populaarseimal veebiserveril IIS, tundub MVC-ga töötamine üsna tuttav. Enamik ettevõtteid alustas klassikalise ASP ajal IIS-iga. Täna hõivavad IIS-i serverid 28% kogu Internetist ja on Apache'i ja nginxi järel populaarsuselt teisel kohal.

5. Lihtsustatud Javascripti integreerimine

WebFormsis võib Javascripti kasutada proovides tekkida igasuguseid probleeme, millest paljud meist isegi teadlikud pole. Olen näinud, kuidas arendajad võitlevad JavaScripti integreerimine WebForm Page_Load koodi! ASP.NET MVC for Beginners omakorda võimaldab Javascripti rakendustesse peaaegu veatult integreerida. Lihtsalt proovige mõnes WebFormsi veebirakenduses AngularJ-sid rakendada ja seejärel öelge mulle, kui palju juukseid teil pähe on jäänud.

6. Avatud lähtekoodiga

Nüüd saavad kõik koodi vaadata! Kui soovite vaadet laiendada ja luua oma ViewEngine, vaadake lihtsalt Githubi koodi ja vaadake, kuidas see on rakendatud. Juurdepääs lähtekoodile suurendab kujutlusvõimet!

7. Platvormideülene tugi

Nüüd saate luua veebirakendusi mis tahes platvormil: Apple, Linux või Windows.

8. Visual Studio sõltumatu

Peaaegu alates värskendatud .NET/ASP.NET-i väljalaske esmamainimisest on kõikvõimalikud arendajad ( sealhulgas Microsoft) hakkasid looma oma IDE-sid, mis näitavad võimalusi uus versioon.NET Sellised IDE-d (JetBrainsi Visual Studio Code või Rider in #C) võimaldavad teil arendada oma ASP.NET- ja C#-projekte ilma Visual Studiota. Nüüd pole enam nii oluline, millist keskkonda arendaja kasutab, sest klientidel on vaja lihtsalt valmis veebisaiti!

9. Piisav kogukond

ASP.NET MVC on imelihtne algajatele ja enamikule veebiarendajatele värske õhk. See tööriist viib meid selleni uus ajastu, kaugel WebFormidest. Märkimisväärne osa arendajatest on juba MVC-le üle läinud.

10. Ühiku testimine

Lisaks pakub ASP.NET MVC üksuste testimise võimalusi. See lihtsustab oluliselt testimisprotsessi. Mõne WebFormi arendaja jaoks tundub see täiesti uue kontseptsioonina, kuna mõne liidese ja ärikomponendi testimine tekitas varem suuri probleeme. ASP.NET MVC abil saate hõlpsalt testida kõiki komponente ja tagada, et teie rakendus töötab täielikult.

Kokkuvõtteks

Loodan, et olete täna saanud piisavalt teavet ASP.NET MVC omaduste kohta, mille tõttu tasub sellele tööriistale üle minna.

Artikli tõlge " 10 põhjust, miks alustada ASP.NET MVC kasutamist” koostas sõbralik projektimeeskond.

Hea halb

Viimati uuendatud: 31.10.2015

ASP.NET MVC on platvorm veebisaitide ja veebirakenduste loomiseks, kasutades MVC (mudel - vaade - kontroller) mustrit (või malli).

Töö uue platvormi kallal algas 2007. aastal ja esimene versioon ilmus 2009. aastal. Tänu sellele on praeguseks (2012) platvormist välja antud juba 4 versiooni ning raamistik ise on tänu oma paindlikkusele ja kohandatavusele kogunud maailmas suurt populaarsust.

Selle aluseks olev MVC muster uus platvorm, eeldab kolme komponendi koostoimet: kontroller (kontroller), mudel (mudel) ja esitlus (vaade). Mida need komponendid esindavad?

Kontroller tähistab klassi, millest rakendus tegelikult algab. See klass loob ühenduse mudeli ja vaate vahel. Võttes vastu kasutaja sisendi, pääseb kontroller sisemise loogika alusel vajadusel ligi mudelile ja genereerib vastava vaate.

Vaade on tegelik visuaalne osa või kasutajaliides rakendused – näiteks html-leht, mille kaudu saiti külastav kasutaja suhtleb veebirakendusega.

Mudel kujutab klasside komplekti, mis kirjeldavad kasutatavate andmete loogikat.

Üldist interaktsiooniskeemi saab lihtsustada järgmiselt:

ASP.NET MVC ja ASP.NET veebivormid

ASP.NET MVC on mingil moel traditsiooniliste veebivormide konkurent ja sellel on nende ees järgmised eelised:

Vastutuse jagamine. MVC-s koosneb rakendus kolmest osast: kontrollerist, vaatest ja mudelist, millest igaüks täidab oma spetsiifilisi funktsioone. Tänu sellele on rakendust tulevikus lihtsam hooldada ja muuta.

Tulenevalt vastutusalade lahususest on mvc rakendustel parem testitavus. Ja me saame testida üksikuid komponente üksteisest sõltumatult.

Kirjavahetus HTTP protokoll . MVC-rakendused, erinevalt veebivormidest, ei toeta olekuobjekte (ViewState). Platvormi selgus ja lihtsus võimaldavad teil saavutada rohkem kontrolli rakenduse kallal töötamine

Paindlikkus. Saate kohandada platvormi erinevaid komponente vastavalt oma soovile. Muutke MVC torujuhtme mis tahes osi või kohandage seda vastavalt oma vajadustele ja nõuetele.

Samal ajal ei tohiks te ASP.NET WebForms täielikult allahindlust teha. Sest sellel on ka oma tugevad küljed, näiteks ürituste mudel, mis on lähemal neile arendajatele, kes olid varem seotud kliendirakenduste loomisega.

Traditsiooniliste veebivormide abil saate märgistuse üle kontrollida ja saate reaalajas visuaalne redaktor Visual Studio, et näha, kuidas konkreetne leht välja näeb. MVC-ga töötades ei luba Visual Studio seda teha.

Igal juhul võite vabalt valida endale sobiva platvormi. Ja kui olete kirjutanud suuri projekte traditsiooniliste veebivormide abil, võib olla mõtet nendega edasi töötada. Veelgi enam, ASP.NET Web Forms ei ole veel suremas ja samuti areneb edasi.