Webalkalkalmazás fejlesztése ASP.NET-ben

Krizsán Zoltán

Adatok ellenőrzése

• Vezérlők tartalmának ellenőrzése• Érték ellenőrzés• Automatikus hibaüzenet kiírás, adatok

újrakérése• RequiredFieldValidator – kitöltött e?• <asp:RequiredFieldValidator

ControlToValidate="Name" Display="Dynamic" errormessage="You must enter your name!" runat=server/>

Form ellenőrzés

Két fajtája van, a programozó munkája ugyanaz Kliens oldali(uplevel client support): DHTML,

java szkriptSzerver oldali(downlevel client support):

ilyenkor visszaküldi az oldalt hibaüzenet a vezérlő mellett.

a feldolgozás alatt: Page.IsValid – akkor érvényes az oldal, ha minden vezérlő az! ha még nem volt ellenőrzés, akkor kivétel

keletkezik!

Ellenőrzés

1. Helyezzünk fel egy beviteli mezőt!2. Helyezzük fel az ellenőrző vezérlőt!3. Állítsuk be a ControlToValidate tulajdonságát

az ellenőrzőnek a beviteli vezérlőre!4. Állítsuk be a ErrorMessage tulajdonságát az

ellenőrzőnek a hiba jelzés szövegére!5. Text tulajdonságot állítsuk be! Ez mindig

megjelenik. pl. : *6. Helyezzünk egy ValidationSummary vezérlőt

a formra!

Ellenőrzők működése

Egy vezérlőhöz több ellenőrző is lehet.Minden vezérlőnek van egy kiemelt tulajdonsága

ValidationProperty attribútummal jelölt pl:[ValidationProperty("Text")]

Ellenőrzők ennek értékét figyelik.A web vezérlőknek van CausesValidation

tulajdonságaha false nincs adatellenőrzésha true (alapértelmezett a submit-olóknál): minden

ellenőrző lefutSzerver és kliens oldalon is lehetséges.

Ellenőrzés szabályai

Ha az ellenőrző hibát észlelt, akkor a hiba üzenet megjelenik az ellenőrző

pozíciójában,az oldal hibás állapotba kerül,ha van, akkor az összegzőbe felkerül a hiba

szövegeEllenőrzés az inicializálás (view state,

postback) után, de az eseményeink kezelése előtt fut le.

Ellenőrzés hamarabb is kikényszeríthető a Validate  metódussal, de ekkor 2x fut le.

Ellenőrzés szabályai II

Melyik vezérlőnél mit ellenőrzünk?

SelectedItem.ValueRadioButtonList

SelectedItem.ValueDropDownList

SelectedItem.ValueListBox

TextTextBox

ValueHtmlInputFile

ValueHtmlSelect

ValueHtmlTextArea

ValueHtmlInputText

Ellenőrzött tulajdonságVezérlő

EllenőrzőkFormája:<asp:CompareValidator id="comp1" ControlToValidate="txtComp" ControlToCompare = "txtCompTo" Type="String" runat="server"/>

•RequiredFieldValidator: a felhasználónak ki kell töltenie a vezérlőt• CompareValidator: egy konstans,vagy msáik vezérlő viszonya (<,=,>, …)• RangeValidator: konstans értékek közé esike? (szám betű, dátum)• RegularExpressionValidator: reguláris kifejezésre illik e?• CustomValidator: saját kód ellenőrzi• ValidationSummary: megjeleníti az oldalon használt ellenőrzők eredményeit

ControlToValidate: referencia az ellenőrzött vezérlőre.Display: static vagy dynamic hogyan jelenjen meg a

hibaszövegEnableClientScript (true a default)ErrorMessage: hibaszöveg ami a ValidationSummary-

ban jelenik meg ha kell.Text: ezen vezérlő helyén jelenik meg ha kell.IsValidSetFocusOnError: ráállítja a fókuszt a megjelölt

vezérlőre.Validate(): Ez hívódik automatikusan, de hívható

közvetlenül is.

Minden ellenőrző őseBaseValidator

Kliens oldalon is lehet ellenőrizni, de

Szerver oldalon kötelező

Ellenőrzés helye

<asp:TextBox runat="server" ID="Name" />

<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server"ControlToValidate="Name" ErrorMessage="Name is required"Display="dynamic">*</asp:RequiredFieldValidator>

RequiredFieldValidator

Data Type Description

String A string data type.

Integer A 32-bit signed integer data type.

Double A double-precision floating point number data type.

Date A date data type.

Currency A decimal data type that can contain currency symbols.

RangeValidator I

MinimumValue, MaximumValue, Type

<asp:TextBox runat="server" ID="DayOff" />

<asp:RangeValidator ID="RangeValidator1" runat="server" Display="dynamic"ControlToValidate="DayOff" Type="Date"ErrorMessage="Day Off is not within the valid interval"MinimumValue="2008-08-05" MaximumValue="2008-08-20">*</asp:RangeValidator>

RangeValidator II

Két vezérlő tartalmát, vagy egy fix érték és a vezérlő tartalma hasonlítja össze.

ControlToCompareValueToCompareType tulajdonság

CompareValidator

Operation JelentésEqual =

NotEqual !=

GreaterThan >

GreaterThanEqual

>=

LessThan <

LessThanEqual <=

DataTypeCheckOlyan típusú e

CompareValidator operátor tulajdonság

<asp:TextBox runat="server" ID="Age" />

<asp:CompareValidator ID="CompareValidator1" runat="server" Display="dynamic"ControlToValidate="Age" ValueToCompare="18"ErrorMessage="You must be at least 18 years old"Type="Integer" Operator="GreaterThanEqual">*</asp:CompareValidator>

CompareValidator III

<asp:TextBox runat="server" TextMode="Password" ID="Password" /><asp:TextBox runat="server" TextMode="Password" ID="Password2" />

<asp:CompareValidator ID="CompareValidator2" runat="server"ControlToValidate="Password2" ControlToCompare="Password"ErrorMessage="The passwords don't match"Type="String" Display="dynamic"><img src="imgError.gif" alt="The passwords don't match" /></asp:CompareValidator>

CompareValidator IV

<asp:TextBox runat="server" ID="Email" />

<asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server"ControlToValidate="Email" ValidationExpression=".*@.{2,}\..{2,}"ErrorMessage="E-mail is not in a valid format" Display="dynamic">*</asp:RegularExpressionValidator>

RegularExpressionValidator

Ha a beépített ellenőrzők már nem elegendőek.

Lehet kliens vagy szerver oldali vezérlés.Ellenőrzés hasonló. Metódus 2 paraméterrel:ServerValidate(object source, ServerValidateEventArgs args)

Value-ban kapjuk a vizsgált értéketIsValid-ot állítsuk be (true vagy false)

Kliens oldal esetén ClientValidationFunction tulajddonság

CustomValidator

<asp:TextBox runat="server" ID="EmpID" />

<asp:CustomValidator ID="CustomValidator1" runat="server" ControlToValidate="EmpID"ClientValidationFunction="EmpIDClientValidate" OnServerValidate="EmpIDServerValidate"ErrorMessage="ID must be a multiple of 5" Display="dynamic">*</asp:CustomValidator>

CustomValidator

<script type="text/javascript">function EmpIDClientValidate(ctl, args){// the value is a multiple of 5 if the modulus by 5 is 0args.IsValid=(args.Value%5 == 0);}</script>

CustomValidator kliens oldal

ServerValidate eseményprotected void EmpIDServerValidate(object sender, ServerValidateEventArgs args){

try{

args.IsValid = (int.Parse(args.Value) % 5 == 0);}catch{

args.IsValid = false;}

}

CustomValidator szerver oldal

Nem végez ellenőrzést.Megjeleníti az összes vezérlő ErrorMessage

tulajdonságát.Ha ShowMessageBox igaz, akkor megjelenik

a kliens oldalon. Ha nem, akkor az oldalon az adott helyen.

DisplayMode tulajdonság a megjelenés módját szabályozza:

HeaderText: Bevezető szöveget definiál.

ValidationSummary

if (this.IsPostBack) { this.Validate(); if (!this.IsValid) {

(IValidator aValidator in this.Validators) {

if (!aValidator.IsValid) { msg += "<br />" +aValidator.ErrorMessage;

} }

}

Ellenőrzés kikényszerítése

<asp:RangeValidator id="rangeValInteger" Type="Integer" ControlToValidate="txtComp1" MaximumValue="10" MinimumValue="1" runat="server"/>

<asp:ValidationSummary ID="valSum" runat="server" HeaderText="You must enter a value in the following fields:" Font-Name="verdana" Font-Size="12" />

<asp:RegularExpressionValidator id="RegularExpressionValidator1" runat="server" ControlToValidate="TextBox1" ValidationExpression="^\d{5}$" Display="Static" Font-Name="verdana" Font-Size="10pt"> Zip code must be 5 numeric digits </asp:RegularExpressionValidator>

Ellenőrzés példák

Msdn.microsoft.comWeb development

ASP.NET 4 and Visual Studio 2010ASP.NET Walkthroughs by Scenario

Walkthrough: Validating User Input in a Web Forms Page

http://msdn.microsoft.com/en-us/library/a0z2h4sw(v=vs.100).aspx

Gyakorlat

Alapértelmezetten bekapcsolt.EnableClientScript tulajdonságHa engedélyezve van, akkor generálódik a

megfelelő kód, nem kell tenni semmit.aspnet_client  mappában vannak a szkriptek.Submit előtt futnak le, tehát kell submit-oló

vezérlő.

Kliens oldali ellenőrzés

Page_IsValid figyelése, ami itt globális változó.

Page_Validators ellenőrzők listája.Page_ValidationActive    igaz, ha

engedélyezett a kliens oldali ellenőrzés.<script language="javascript" src="/aspnet_client/system_web/1_0_3617_0/WebUIValidation.js"> </script>

Kliens oldali ellenőrzés

ValidationGroup tulajdonság (string)A post-oló, a vizgált bemeneti és az ellenörző

vezérlőt tegyük egy csoportba!Ha egy vezérlő post-ol, akkor csak az abban a

csoportban levő ellenőrzők futnak le.Érdemes több ellenőrző csoportot létrehozni

a form-on, rakjuk panelekre.Kliens, és szerver oldalon is működik.

Ellenőrző csoportok

Hozzuk létre a következő egy szerű alkalmazást!

Feladat – ellenőrző csoportok

Az ellenőrzők a mellettük lévő beviteli mezőt ellenőrizzék!

Az alsó label-be írjuk be az oldal betöltésének idejét!(Label1.Text = DateTime.Now.ToString();)

Ne felejtsük el kitölteni az ErrorMessage-et!Első esetben ne állítsunk be ellenőrző

csoportokat (üresen hagyni)!A gombok eseménykezelőjében a label1-be

írjuk be, hogy melyik gomb eseménye futott le, ha érvényes az oldal (Page.IsValid)

Feladat – ellenőrző csoportok

Példa 1Töltsük ki az első mezőt!Nyomjuk meg az első gombot!

Példa 2Töltsük ki az első mezőt!Nyomjuk meg a második gombot!

Probák

Kapcsoljuk ki a kliens oldali ellenőrzés!futtassuk le a teszteket

Állítsunk be ellenőrző osztályokat! (Azonos soroknak azonos legyen.)futtassuk le a teszteket

Kapcsoljuk be a kliens oldali ellenőrzés!futtassuk le a teszteket

Közben vizsgáljuk meg a HTML válaszokat a böngészőben!

Beállítások - futások

1. Page and its controls are created, based on ASPX file.

2. Page_Load event fires.3. Page and control properties are saved to a

hidden field.4. Page and controls are turned into HTML.5. Everything is thrown away.

Első oldal kiszolgálás

1. Page and its controls are created based on ASPX file.

2. Page and control properties are recovered from hidden field.

3. Page controls are updated based on user input.4. Page_Load event fires.5. Change notification events fire.6. Page and control properties are saved to a

hidden field.7. Page and controls are turned into HTML.8. Everything is thrown away again.

Postback kiszolgálás