Érvényesítési vezérlők hozzáadása a szerkesztő- és beszúrási felületekhez (VB)

által Scott Mitchell

PDF letöltése

Ebben az oktatóanyagban megtanuljuk, milyen egyszerűen lehet érvényesítési vezérlőket hozzáadni egy adat-webvezérlő EditItemTemplate és InsertItemTemplate eleméhez, hogy megbízhatóbb felhasználói felületet biztosítsunk.

Bevezetés

Az elmúlt három oktatóanyagban megismert Példák GridView és DetailsView vezérlői mind BoundFields és CheckBoxFields elemekből állnak (a Visual Studio által automatikusan hozzáadott mezőtípusok, amikor egy GridView-t vagy DetailsView-t egy adatforrás-vezérlőhöz kötnek az intelligens címkén keresztül). Egy GridView vagy DetailsView sor szerkesztésekor a nem írásvédett BoundFieldek szövegmezőkké alakulnak, amelyek segítségével a végfelhasználó módosíthatja a meglévő adatokat. Hasonlóképpen, amikor új rekordot szúr be egy DetailsView-vezérlőbe, a rendszer üres szövegmezőként jeleníti meg azokat a BoundFieldeket, amelyeknek InsertVisible a tulajdonsága (az alapértelmezett) értékre van állítva True , amelyekbe a felhasználó megadhatja az új rekord mezőértékeit. Hasonlóképpen, a normál, írásvédett felületen letiltott jelölőnégyzetek engedélyezetté válnak a szerkesztő és beszúró felületeken.

Bár a BoundField és a CheckBoxField alapértelmezett szerkesztési és beszúrási felületei hasznosak lehetnek, a felület nem rendelkezik semmilyen ellenőrzéssel. Ha egy felhasználó adatbeviteli hibát követ el – például kihagyja a ProductName mezőt, vagy érvénytelen értéket UnitsInStock ad meg (például -50) – kivétel keletkezik az alkalmazásarchitektúra mélységéből. Bár ez a kivétel az előző oktatóanyagban bemutatott módon kezelhető, ideális esetben a felhasználói felület szerkesztése vagy beszúrása érvényesítési vezérlőket is tartalmazna, amelyek megakadályozzák, hogy a felhasználó először ilyen érvénytelen adatokat adjon meg.

Ahhoz, hogy testre szabott szerkesztési vagy beszúrási felületet biztosíthassunk, a BoundField vagy a CheckBoxField mezőket sablonmezőre kell cserélnünk. A TemplateFields, amely a TemplateFields használata a GridView Controlban és a TemplateFields használata a DetailsView Controlban című oktatóanyagok témája volt, több sablonból állhat, amelyek különböző sorállapotokhoz külön interfészeket határoznak meg. A TemplateField ItemTemplate a DetailsView és a GridView vezérlők írásvédett mezőinek vagy sorainak megjelenítésekor használják, míg a EditItemTemplate és a InsertItemTemplate a szerkesztési és a beszúrási módokhoz használatos felületeket jelzik.

Ebben az oktatóanyagban meg fogjuk nézni, hogy milyen egyszerű érvényesítési vezérlőket hozzáadni a TemplateField EditItemTemplate és InsertItemTemplate -hez, így biztosítva a még megbízhatóbb felhasználói felületet. Ez az oktatóanyag a beszúrással, frissítéssel és törléssel kapcsolatos események vizsgálata című oktatóanyagban létrehozott példát veszi alapul, és kibővíti a szerkesztési és beszúrási felületeket a megfelelő ellenőrzéshez.

1. lépés: A példa replikálásaa beszúrással, frissítéssel és törléssel társított események vizsgálatából

A beszúrással, frissítéssel és törléssel kapcsolatos események vizsgálata oktatóanyagban létrehoztunk egy oldalt, amely egy szerkeszthető GridView-ban listázta a termékek nevét és árát. Emellett a lap tartalmazott egy DetailsView-t is, amelynek DefaultMode tulajdonsága be van állítva Insert, így mindig beszúrási módban jelenik meg. Ebből a DetailsView-ból a felhasználó megadhatja egy új termék nevét és árát, kattintson a Beszúrás gombra, és adja hozzá a rendszerhez (lásd az 1. ábrát).

1. ábra: Az előző példa lehetővé teszi a felhasználók számára új termékek hozzáadását és a meglévők szerkesztését (kattintással megtekintheti a teljes méretű képet)

Az oktatóanyag célja a DetailsView és a GridView kiegészítése az érvényesítési vezérlők biztosításához. Az érvényesítési logikánk különösen a következőkre lesz érvényes:

• A név megadásának megkövetelése egy termék beszúrásakor vagy szerkesztésekor
• A rekord beszúrásakor meg kell adni az árat; rekord szerkesztésekor továbbra is árra lesz szükségünk, de a GridView korábbi oktatóanyagból már meglévő eseménykezelőjének programozott logikáját RowUpdating fogjuk használni
• Ellenőrizze, hogy az árhoz megadott érték érvényes pénznemformátum-e

Mielőtt megvizsgálhatnánk az előző példa érvényesítésre való kibővítését, először replikálnunk kell a példát az DataModificationEvents.aspx oldalról az oktatóanyag lapjára. UIValidation.aspx Ehhez át kell másolnunk a DataModificationEvents.aspx lap deklaratív korrektúrát és annak forráskódját is. Először másolja át a deklaratív jelölést a következő lépések követésével:

1. Nyissa meg a DataModificationEvents.aspx oldalt a Visual Studióban
2. Nyissa meg a lap deklaratív korrektúrát (kattintson az oldal alján található Forrás gombra)
3. Másolja a szöveget a <asp:Content> és </asp:Content> címkék közötti részből (3–44. sor), a 2. ábrán látható módon.

2. ábra: A szöveg másolása a <asp:Content> vezérlőn belül (ide kattintva megtekintheti a teljes méretű képet)

1. UIValidation.aspx A lap megnyitása
2. Ugrás az oldal deklaratív jelölésére
3. Illessze be a szöveget a <asp:Content> vezérlőbe.

A forráskód másolásához nyissa meg a DataModificationEvents.aspx.vb lapot, és másolja csak az EditInsertDelete_DataModificationEvents szöveget. Másolja ki a három eseménykezelőt (Page_LoadGridView1_RowUpdatingés ObjectDataSource1_Inserting), de ne másolja ki az osztálydeklarációt. Illessze be a másolt szöveget azEditInsertDelete_UIValidation osztályon belül UIValidation.aspx.vb.

Miután áthelyezte a tartalmat és a kódot DataModificationEvents.aspx-ról UIValidation.aspx-re, szánjon egy kis időt arra, hogy tesztelje a fejlődést egy böngészőben. Ugyanazt a kimenetet kell látnia, és mindkét oldalon ugyanazt a funkciót kell tapasztalnia (az 1. ábrára visszautalva megtekintheti a működés közbeni képernyőfelvételt DataModificationEvents.aspx).

2. lépés: A BoundFields átalakítása sablonmezőkké

Ha érvényesítési vezérlőket szeretne hozzáadni a szerkesztő- és beszúrási felületekhez, a DetailsView és a GridView vezérlők által használt BoundFieldeket Sablonmezőkké kell konvertálni. Ehhez kattintson az Oszlopok szerkesztése és a Mezők szerkesztése hivatkozásra a GridView és a DetailsView intelligens címkéiben. Itt jelölje ki az egyes BoundFields mezőket, és kattintson a "Mező átalakítása Sablonmezővé" hivatkozásra.

3. ábra: A DetailsView és a GridView BoundFields mezőinek konvertálása sablonmezőkké (ide kattintva megtekintheti a teljes méretű képet)

Ha egy BoundFieldet Sablonmezővé alakít át a Mezők párbeszédpanelen, létrehoz egy Sablonmezőt, amely ugyanazokat az írásvédett, szerkesztési és beszúrási felületeket tartalmazza, mint maga a BoundField. Az alábbi jelölés a DetailsView ProductName mező deklaratív szintaxisának ábrázolását mutatja, miután sablonmezővé lett átalakítva:

<asp:TemplateField HeaderText="ProductName" SortExpression="ProductName">
    <EditItemTemplate>
        <asp:TextBox ID="TextBox1" runat="server"
         Text='<%# Bind("ProductName") %>'></asp:TextBox>
    </EditItemTemplate>
    <InsertItemTemplate>
        <asp:TextBox ID="TextBox1" runat="server"
         Text='<%# Bind("ProductName") %>'></asp:TextBox>
    </InsertItemTemplate>
    <ItemTemplate>
        <asp:Label ID="Label1" runat="server"
         Text='<%# Bind("ProductName") %>'></asp:Label>
    </ItemTemplate>
</asp:TemplateField>

Vegye figyelembe, hogy ez a TemplateField három sablont hozott létre ItemTemplateautomatikusan, EditItemTemplateés InsertItemTemplate. A ItemTemplate egy címke webvezérlő segítségével egyetlen adatmezőértéket (ProductName) jelenít meg, míg a EditItemTemplate és a InsertItemTemplate az adatmező értékét egy TextBox webvezérlőben jelenítik meg, amely a TextBox Text tulajdonságához társítja az adatmezőt kétirányú adatkötéssel. Mivel ebben a lapon csak a DetailsView-t használjuk a beszúráshoz, eltávolíthatja a ItemTemplateEditItemTemplate két TemplateFields-et, bár nem árt, ha elhagyjuk őket.

Mivel a GridView nem támogatja a DetailsView beépített beszúrási funkcióit, a GridView ProductName mező sablonmezővé alakítása csak a ItemTemplate és a EditItemTemplate eredményezi.

<asp:TemplateField HeaderText="ProductName" SortExpression="ProductName">
    <EditItemTemplate>
        <asp:TextBox ID="TextBox1" runat="server"
         Text='<%# Bind("ProductName") %>'></asp:TextBox>
    </EditItemTemplate>
    <ItemTemplate>
        <asp:Label ID="Label1" runat="server"
          Text='<%# Bind("ProductName") %>'></asp:Label>
    </ItemTemplate>
</asp:TemplateField>

A "Mező konvertálása Sablonmezővé" gombra kattintva a Visual Studio létrehozott egy Sablonmezőt, amelynek sablonjai a konvertált BoundField felhasználói felületét utánozzák. Ezt úgy ellenőrizheti, ha egy böngészőben felkeresi ezt a lapot. Azt fogja tapasztalni, hogy a TemplateFields megjelenése és viselkedése megegyezik a BoundFields használatakor használt felülettel.

Megjegyzés:

Igény szerint testre szabhatja a sablonok szerkesztési felületeit. Előfordulhat például, hogy azt szeretnénk, ha a UnitPrice TemplateFields-ben található TextBox kisebb szövegdobozként jelenne meg, mint a ProductName szövegdoboz. Ehhez beállíthatja a TextBox tulajdonságát Columns egy megfelelő értékre, vagy abszolút szélességet adhat meg a Width tulajdonságon keresztül. A következő oktatóanyagban megtudhatja, hogyan szabhatja testre teljesen a szerkesztőfelületet úgy, hogy a TextBoxot egy másik adatbeviteli webvezérlőre cseréli.

3. lépés: Az érvényesítési vezérlők hozzáadása a GridView-hozEditItemTemplate

Adatbeviteli űrlapok létrehozásakor fontos, hogy a felhasználók minden szükséges mezőt beírjanak, és hogy az összes megadott bemenet legális, megfelelően formázott érték legyen. A felhasználói bemenetek érvényességének biztosítása érdekében ASP.NET öt beépített érvényesítési vezérlőt biztosít, amelyek egyetlen bemeneti vezérlő értékének ellenőrzésére szolgálnak:

• A RequiredFieldValidator biztosítja, hogy egy érték meg lett adva
• A CompareValidator érvényesít egy értéket egy másik webvezérlő értékével vagy állandó értékével, vagy biztosítja, hogy az érték formátuma jogi legyen egy adott adattípus esetében
• A RangeValidator biztosítja, hogy egy érték egy értéktartományon belül legyen
• A RegularExpressionValidator egy értéket érvényesít egy reguláris kifejezéssel
• A CustomValidator egy egyéni, felhasználó által definiált metódussal érvényesít egy értéket

Az öt vezérlőről további információt a ASP.NET rövid útmutatókEllenőrzési vezérlők szakaszában talál.

Az oktatóanyaghoz egy RequiredFieldValidatort kell használnunk a DetailsView és a GridView ProductName TemplateFields elemében, valamint egy RequiredFieldValidatort a DetailsView UnitPrice TemplateFieldben. Ezenkívül hozzá kell adnunk egy CompareValidatort mindkét vezérlő TemplateFields eleméhez UnitPrice , amely biztosítja, hogy a megadott ár értéke 0-nál nagyobb vagy egyenlő legyen, és érvényes pénznemformátumban jelenik meg.

Megjegyzés:

Bár az 1.x ASP.NET ugyanazzal az öt érvényesítési vezérlővel rendelkezik, ASP.NET 2.0 számos fejlesztéssel bővült, a fő kettő az Internet Exploreren kívüli böngészők ügyféloldali szkripttámogatása, valamint a lap érvényesítési vezérlőinek érvényesítési csoportokba való particionálása. A 2.0-s verzió új érvényesítési vezérlőinek funkcióiról további információt a "Dissecting the Validation Controls in ASP.NET 2.0" című részben talál.

Kezdjük azzal, hogy hozzáadja a szükséges érvényesítési vezérlőket a EditItemTemplate GridView TemplateFields sablonmezőihez. Ehhez kattintson a GridView intelligens címkéjének Sablonok szerkesztése hivatkozására a sablonszerkesztő felület megnyitásához. Itt kiválaszthatja, hogy melyik sablont szeretné szerkeszteni a legördülő listából. Mivel bővíteni szeretnénk a szerkesztőfelületet, érvényesítési vezérlőket kell hozzáadnunk az ProductName és UnitPriceEditItemTemplate-khoz.

4. ábra: Ki kell terjesztenünk az ProductName és UnitPriceEditItemTemplate-eit (kattintson ide a teljes méretű kép megtekintéséhez)

A ProductNameEditItemTemplate címkéknél adjon hozzá egy RequiredFieldValidatort úgy, hogy azt az eszközkészletből a sablonszerkesztési felületre húzza, és a szövegdoboz után helyezze el.

5. ábra: Adjon hozzá egy RequiredFieldValidatort a ProductNameEditItemTemplate (kattintson ide a teljes méretű kép megtekintéséhez)

Az összes érvényesítési vezérlő egyetlen ASP.NET webes vezérlő bemenetének ellenőrzésével működik. Ezért azt kell jeleznünk, hogy az imént hozzáadott RequiredFieldValidatornak érvényesítenie kell a szövegmező ellen EditItemTemplate; ezt úgy lehet elérni, hogy az érvényesítési vezérlő ControlToValidate tulajdonságát a ID megfelelő webes vezérlőhöz állítjuk. A TextBox jelenleg meglehetősen nem leíró jellegű IDTextBox1, de változtassuk meg a megfelelőbbre. Kattintson a sablon szövegdobozára, majd a Tulajdonságok ablakban módosítsa a ID értékét TextBox1-ről EditProductName-re.

6. ábra: A Szövegdoboz értékének IDEditProductName módosítása (Ide kattintva megtekintheti a teljes méretű képet)

Ezután állítsa a RequiredFieldValidator tulajdonságát ControlToValidate a következőre EditProductName: . Végül állítsa az ErrorMessage tulajdonságot "Meg kell adnia a termék nevét" értékre, a Text tulajdonságot pedig "*" értékre. Ha Text meg van adva a tulajdonság értéke, az érvényesítési vezérlő által megjelenített szöveg, ha az érvényesítés sikertelen. A ErrorMessage szükséges tulajdonságértéket a ValidationSummary vezérlő használja; ha a Text tulajdonság értéke hiányzik, akkor a ErrorMessage tulajdonságérték az érvénytelen bemeneten az érvényesítési vezérlő által megjelenített szöveg is.

A RequiredFieldValidator három tulajdonságának beállítása után a képernyőnek a 7. ábrához hasonlóan kell kinéznie.

Állítsa be a RequiredFieldValidator ControlToValidate, ErrorMessage és Text tulajdonságait.

7. ábra: A RequiredFieldValidator ControlToValidate, ErrorMessage, és Text tulajdonságainak beállítása (ide kattintva megtekintheti a teljes méretű képet)

A RequiredFieldValidator hozzá van adva a ProductNamefájlhoz, csak a szükséges ellenőrzés hozzáadása marad meg a EditItemTemplateUnitPrice.EditItemTemplate Mivel úgy döntöttünk, hogy ennél az oldalnál a UnitPrice opcionális, amikor egy bejegyzést szerkesztünk, nem szükséges hozzáadni egy RequiredFieldValidatort. Azonban hozzá kell adnunk egy CompareValidatort annak érdekében, hogy a UnitPricemegadott pénznem megfelelően legyen formázva, és 0-nál nagyobb vagy egyenlő legyen.

Mielőtt hozzáadnánk a CompareValidatort a UnitPriceEditItemTemplate, először változtassuk meg a TextBox webvezérlő azonosítóját TextBox2-ről EditUnitPrice-re. A módosítás elvégzése után adja hozzá a CompareValidatort, és állítsa a tulajdonságát ControlToValidateEditUnitPriceErrorMessage a következőre: "Az árnak nullánál nagyobbnak vagy egyenlőnek kell lennie, és nem tartalmazhat pénznemszimbólumot", tulajdonságát Text pedig "*" értékre.

Annak jelzésére, hogy az UnitPrice értéknek 0-nál nagyobbnak vagy egyenlőnek kell lennie, állítsa a CompareValidator Operátor tulajdonságátGreaterThanEqual értékre, a ValueToCompare tulajdonságát "0"-ra, és a Type tulajdonságátCurrency értékre. Az alábbi deklaratív szintaxis a UnitPrice TemplateFieldet EditItemTemplate mutatja a módosítások elvégzése után:

<EditItemTemplate>
    <asp:TextBox ID="EditUnitPrice" runat="server"
      Text='<%# Bind("UnitPrice", "{0:c}") %>'
      Columns="6"></asp:TextBox>
    <asp:CompareValidator ID="CompareValidator1" runat="server"
        ControlToValidate="EditUnitPrice"
        ErrorMessage="The price must be greater than or equal to zero and
                       cannot include the currency symbol"
        Operator="GreaterThanEqual" Type="Currency"
        ValueToCompare="0">*</asp:CompareValidator>
</EditItemTemplate>

A módosítások elvégzése után nyissa meg a lapot egy böngészőben. Ha egy termék szerkesztésekor megkísérli kihagyni a nevet, vagy érvénytelen árértéket ad meg, a szövegmező mellett csillag jelenik meg. A 8. ábrán látható, hogy a pénznemszimbólumot (például 19,95 USD) tartalmazó árérték érvénytelennek minősül. A CompareValidator CurrencyType lehetővé teszi a számjegyelválasztók (például vesszők vagy időszakok, a kulturális beállításoktól függően) és a kezdő plusz- vagy mínuszjelek megadását, de nem engedélyezi a pénznem szimbólumát. Ez a viselkedés zavarba hozhatja a felhasználókat, mivel a szerkesztőfelület jelenleg a UnitPrice pénznemformátumot jeleníti meg.

Megjegyzés:

Ne feledje, hogy a beszúrással, frissítéssel és törléssel kapcsolatos események oktatóanyagban a BoundField tulajdonságát DataFormatString úgy állítottuk be, hogy {0:c} pénznemként formázzuk. Emellett igaz értékre állítjuk a ApplyFormatInEditMode tulajdonságot, így a GridView szerkesztőfelülete pénznemként formázza a UnitPrice tulajdonságot. Amikor a BoundFieldet Sablonmezővé konvertálta, a Visual Studio ezeket a beállításokat jegyezte fel, és pénznemként formázta a TextBox tulajdonságát Text, a databinding szintaxis <%# Bind("UnitPrice", "{0:c}") %> használatával.

8. ábra: Csillag jelenik meg a szövegdobozok mellett érvénytelen bemenettel (kattintson ide a teljes méretű kép megtekintéséhez)

Bár az ellenőrzés as-isműködik, a felhasználónak manuálisan kell eltávolítania a pénznemszimbólumot egy rekord szerkesztésekor, ami nem elfogadható. Ennek orvoslására három lehetőségünk van:

1. Konfigurálja úgy EditItemTemplate , hogy az UnitPrice érték ne legyen pénznemként formázva.
2. A CompareValidator eltávolításával és regularExpressionValidatorra való lecserélésével lehetővé teszi a felhasználó számára, hogy pénznemszimbólumot adjon meg, amely megfelelően ellenőrzi a megfelelően formázott pénznemértékeket. A probléma itt az, hogy a pénznemérték ellenőrzésére használható reguláris kifejezés nem szép, és kódírást igényelne, ha kulturális beállításokat szeretnénk beépíteni.
3. Távolítsa el teljesen az érvényesítési vezérlőt, és támaszkodhat a GridView eseménykezelőjében RowUpdating a kiszolgálóoldali érvényesítési logikára.

Válasszuk az 1. lehetőséget ehhez a gyakorlathoz. Jelenleg a UnitPrice pénznemként van formázva a EditItemTemplate szövegmező adatkötési kifejezése miatt: <%# Bind("UnitPrice", "{0:c}") %>. Módosítsa a Bind utasítást a következőre Bind("UnitPrice", "{0:n2}"): az eredmény két számjegyből álló számként formázható. Ez közvetlenül elvégezhető a deklaratív szintaxissal, vagy az EditUnitPrice Sablonmező UnitPrice Szövegdobozában található Adatkötések szerkesztése linkre kattintva (lásd a 9. és 10. ábrát).

9. ábra: Kattintson a Szövegdoboz Szerkesztés DataBindings hivatkozására (ide kattintva megtekintheti a teljes méretű képet)

10. ábra: Adja meg a Formátumkijelölőt az Bind utasításban (kattintson ide a teljes méretű kép megtekintéséhez)

Ezzel a módosítással a szerkesztőfelület formázott árat tartalmaz, amely a vesszőket használja csoportelválasztóként és a pontot tizedeselválasztóként, de a pénznemszimbólumot elhagyja.

Megjegyzés:

A UnitPriceEditItemTemplate nem tartalmaz RequiredFieldValidatort, ami lehetővé teszi a keresztülvitelt és a frissítési logika megkezdését. Azonban a RowUpdating eseménykezelő, amelyet a beszúrással, frissítéssel és törléssel kapcsolatos események vizsgálata oktatóanyagból másoltak át, tartalmaz egy programozott ellenőrzést, amely biztosítja, hogy a UnitPrice meg legyen adva. Nyugodtan távolítsa el ezt a logikát, hagyja meg a(z) as-is-ben, vagy adjon hozzá egy RequiredFieldValidatort a UnitPriceEditItemTemplate-hez.

4. lépés: Adatbeviteli problémák összegzése

Az öt érvényesítési vezérlő mellett ASP.NET a ValidationSummary vezérlőt is tartalmazza, amely megjeleníti az ErrorMessage érvénytelen adatokat észlelő érvényesítési vezérlők s-jét. Ezek az összefoglaló adatok megjeleníthetők szövegként a weblapon vagy egy modális, ügyféloldali üzenetmezőn keresztül. Bővítsük ezt az oktatóanyagot úgy, hogy tartalmazzon egy ügyféloldali üzenetmezőt, amely összefoglalja az ellenőrzési problémákat.

Ehhez húzzon egy ValidationSummary vezérlőt az eszközkészletből a Tervezőbe. Az Érvényesítési vezérlő helye nem igazán számít, mivel úgy fogjuk konfigurálni, hogy csak üzenetmezőként jelenítse meg az összegzést. A vezérlőelem hozzáadása után állítsa a ShowSummary tulajdonságotFalse értékre, és a ShowMessageBox tulajdonságotTrue értékre. Ezzel a kiegészítéssel az ellenőrzési hibák egy ügyféloldali üzenetmezőben vannak összefoglalva.

11. ábra: Az érvényesítési hibák egy Client-Side üzenetmezőben vannak összegezve (ide kattintva megtekintheti a teljes méretű képet)

5. lépés: Az érvényesítési vezérlők hozzáadása a DetailsView-hozInsertItemTemplate

Ebben az oktatóanyagban csak az van hátra, hogy hozzáadja az érvényesítési vezérlőket a DetailsView beszúrási felületéhez. Az érvényesítési vezérlők a DetailsView sablonjaihoz való hozzáadásának folyamata megegyezik a 3. lépésben vizsgáltéval; ezért ebben a lépésben végigvezetjük a feladatot. Ahogyan azt tettük a GridView EditItemTemplate-val, javaslom, hogy nevezze át a TextBox ID-ket a nem egyértelmű TextBox1 és TextBox2 nevekről InsertProductName és InsertUnitPrice nevekre.

Adjon hozzá egy RequiredFieldValidatort a ProductNameInsertItemTemplate. Állítsa a ControlToValidate a TextBox ID értékére a sablonban, Text tulajdonságát "*" értékre, és ErrorMessage tulajdonságát "Meg kell adnia a termék nevét" értékre.

Mivel ehhez a UnitPrice laphoz egy új rekord hozzáadásakor szükség van rá, adjon hozzá egy RequiredFieldValidatort a UnitPriceInsertItemTemplate elemhez, és állítsa be a ControlToValidate, Text és ErrorMessage tulajdonságait megfelelően. Végül adjon hozzá egy CompareValidatort a UnitPriceInsertItemTemplate is, és konfigurálja annak ControlToValidate, Text, ErrorMessage, Type, Operator, és ValueToCompare tulajdonságait ugyanúgy, ahogy a UnitPrice CompareValidatorját a GridView EditItemTemplate-ban.

Az érvényesítési vezérlők hozzáadása után nem adható hozzá új termék a rendszerhez, ha nem adja meg a nevét, vagy ha az ára negatív szám, vagy illegálisan formázott.

12. ábra: Az érvényesítési logika hozzá lett adva a DetailsView beszúrási felületéhez (ide kattintva megtekintheti a teljes méretű képet)

6. lépés: Az érvényesítési vezérlők particionálása érvényesítési csoportokba

A lap két logikailag különböző ellenőrzési vezérlőből áll: a GridView szerkesztőfelületének megfelelő és a DetailsView beszúrási felületének megfelelő vezérlőkből. Alapértelmezés szerint amikor visszaadás történik, az oldal összes érvényesítési vezérlője ellenőrizve van. Azonban, amikor egy rekordot szerkesztünk, nem szeretnénk, ha a DetailsView beszúró felületének érvényesítő vezérlői érvényesítenének. A 13. ábra az aktuális dilemmát mutatja be, amikor egy felhasználó tökéletesen jogi értékekkel szerkeszt egy terméket. A Frissítés gombra kattintva érvényesítési hiba történik, mert a beszúrási felületen a név és az árértékek üresek.

13. ábra: A termék frissítésekor a beszúrási felület érvényesítési vezérlői aktiválódnak (kattintson a teljes méretű kép megtekintéséhez)

A ASP.NET 2.0 érvényesítési vezérlői a tulajdonságukon ValidationGroup keresztül particionálhatók érvényesítési csoportokba. Ha egy csoportban érvényesítési vezérlőket szeretne társítani, egyszerűen állítsa a tulajdonságukat ValidationGroup ugyanarra az értékre. Az oktatóanyagban állítsa be a ValidationGroup-t a GridView TemplateFields sablonmezőiben lévő érvényesítési vezérlők tulajdonságaira, és a EditValidationControls-t a DetailsView TemplateFields tulajdonságaira a következőre: ValidationGroup. Ezek a módosítások közvetlenül a deklaratív korrektúra vagy a Tulajdonságok ablakban végezhetők el a Tervező szerkesztési sablon felületének használatakor.

A 2.0-s ASP.NET gombokkal és gombokkal kapcsolatos vezérlői az érvényesítési vezérlők mellett egy tulajdonságot ValidationGroup is tartalmaznak. Az érvényesítési csoport érvényesítői csak akkor kerülnek ellenőrzésre, amikor egy olyan gomb idézi elő a visszaküldést, amely ugyanazzal a ValidationGroup tulajdonságbeállítással rendelkezik. Ahhoz például, hogy a DetailsView Beszúrás gombja aktiválja az InsertValidationControls érvényesítési csoportot, be kell állítani a CommandField tulajdonságát ValidationGroupInsertValidationControls (lásd a 14. ábrát). Emellett állítsa be a GridView CommandField ValidationGroup tulajdonságát a EditValidationControls értékre.

14. ábra: Állítsa be a DetailsView CommandField tulajdonságát ValidationGroupInsertValidationControls (kattintson ide a teljes méretű kép megtekintéséhez)

A módosítások után a DetailsView és a GridView TemplateFields és CommandFields mezőinek az alábbiakhoz hasonlóan kell kinézniük:

A DetailsView TemplateFields és CommandFields

<asp:TemplateField HeaderText="ProductName"
  SortExpression="ProductName">
    <InsertItemTemplate>
        <asp:TextBox ID="InsertProductName" runat="server"
         Text='<%# Bind("ProductName") %>'></asp:TextBox>
        <asp:RequiredFieldValidator ID="RequiredFieldValidator2"
          runat="server" ControlToValidate="InsertProductName"
            ErrorMessage="You must provide the product name"
            ValidationGroup="InsertValidationControls">*
        </asp:RequiredFieldValidator>
    </InsertItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="UnitPrice" SortExpression="UnitPrice">
    <InsertItemTemplate>
         <asp:TextBox ID="InsertUnitPrice" runat="server"
           Text='<%# Bind("UnitPrice") %>' Columns="6">
         </asp:TextBox>
         <asp:RequiredFieldValidator ID="RequiredFieldValidator3"
           runat="server" ControlToValidate="InsertUnitPrice"
            ErrorMessage="You must provide the product price"
            ValidationGroup="InsertValidationControls">*
         </asp:RequiredFieldValidator>
        <asp:CompareValidator ID="CompareValidator2" runat="server"
           ControlToValidate="InsertUnitPrice"
           ErrorMessage="The price must be greater than or equal to zero and
                          cannot include the currency symbol"
           Operator="GreaterThanEqual" Type="Currency" ValueToCompare="0"
           ValidationGroup="InsertValidationControls">*
        </asp:CompareValidator>
     </InsertItemTemplate>
 </asp:TemplateField>
<asp:CommandField ShowInsertButton="True"
  ValidationGroup="InsertValidationControls" />

A GridView CommandField és TemplateField mezői

<asp:CommandField ShowEditButton="True" ValidationGroup="EditValidationControls" />
<asp:TemplateField HeaderText="ProductName"
  SortExpression="ProductName">
    <EditItemTemplate>
        <asp:TextBox ID="EditProductName" runat="server"
          Text='<%# Bind("ProductName") %>'>
        </asp:TextBox>
        <asp:RequiredFieldValidator ID="RequiredFieldValidator1"
            runat="server" ControlToValidate="EditProductName"
            ErrorMessage="You must provide the product name"
            ValidationGroup="EditValidationControls">*
        </asp:RequiredFieldValidator>
    </EditItemTemplate>
    <ItemTemplate>
        <asp:Label ID="Label1" runat="server"
          Text='<%# Bind("ProductName") %>'></asp:Label>
    </ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="UnitPrice" SortExpression="UnitPrice">
    <EditItemTemplate>
        <asp:TextBox ID="EditUnitPrice" runat="server"
          Text='<%# Bind("UnitPrice", "{0:n2}") %>' Columns="6"></asp:TextBox>
        <asp:CompareValidator ID="CompareValidator1" runat="server"
            ControlToValidate="EditUnitPrice"
            ErrorMessage="The price must be greater than or equal to zero and
                           cannot include the currency symbol"
            Operator="GreaterThanEqual" Type="Currency"
            ValueToCompare="0"
            ValidationGroup="EditValidationControls">*
        </asp:CompareValidator>
    </EditItemTemplate>
    <ItemTemplate>
        <asp:Label ID="Label2" runat="server"
            Text='<%# Bind("UnitPrice", "{0:c}") %>'>
        </asp:Label>
    </ItemTemplate>
</asp:TemplateField>

Ezen a ponton a szerkesztésspecifikus érvényesítési vezérlők csak akkor aktiválódik, ha a GridView Frissítés gombjára kattint, és a beszúrásspecifikus érvényesítési vezérlők csak a DetailsView Beszúrás gombjára kattintva aktiválódik, a 13. ábra által kiemelt probléma megoldása érdekében. Ezzel a módosítással azonban a ValidationSummary vezérlő már nem jelenik meg az érvénytelen adatok megadásakor. A ValidationSummary vezérlő egy tulajdonságot ValidationGroup is tartalmaz, és csak az érvényesítési csoportban lévő érvényesítési vezérlők összefoglaló adatait jeleníti meg. Ezért ezen az oldalon két érvényesítési vezérlőre van szükség, egy az InsertValidationControls érvényesítési csoporthoz, és egy másik a EditValidationControls érvényesítési csoporthoz.

<asp:ValidationSummary ID="ValidationSummary1" runat="server"
    ShowMessageBox="True" ShowSummary="False"
    ValidationGroup="EditValidationControls" />
<asp:ValidationSummary ID="ValidationSummary2" runat="server"
    ShowMessageBox="True" ShowSummary="False"
    ValidationGroup="InsertValidationControls" />

Ezzel a kiegészítéssel az oktatóanyagunk befejeződött!

Összefoglalás

Bár a BoundFields képes beszúrási és szerkesztési felületet is biztosítani, a felület nem testreszabható. Általában érvényesítési vezérlőket szeretnénk hozzáadni a szerkesztési és beszúrási felülethez, hogy a felhasználó a szükséges bemeneteket jogi formátumban adja meg. Ehhez át kell alakítanunk a BoundFieldset TemplateFieldsre, és hozzá kell adnunk az érvényesítési vezérlőket a megfelelő sablon(ok)hoz. Ebben az oktatóanyagban kiterjesztettük a példát a Beszúráshoz, Frissítéshez és Törléshez kapcsolódó események vizsgálata oktatóanyagból, és érvényesítési vezérlőket adtunk hozzá mind a DetailsView beszúrási felületéhez, mind a GridView szerkesztőfelületéhez. Emellett azt is láthattuk, hogyan jeleníthet meg összefoglaló érvényesítési információkat a ValidationSummary vezérlővel, és hogyan particionálhatja az oldalon található érvényesítési vezérlőket különböző érvényesítési csoportokba.

Ahogy az oktatóanyagban láttuk, a TemplateFields lehetővé teszi a szerkesztési és beszúrási felületek kibővítését, hogy érvényesítési vezérlőket is tartalmazzon. A TemplateFields további beviteli webes vezérlőkkel is bővíthető, így a TextBoxot egy megfelelőbb webvezérlő válthatja fel. A következő oktatóanyagban azt fogjuk látni, hogyan helyettesítheti a TextBox vezérlőt egy adatkötésű DropDownList-vezérlővel, amely ideális idegen kulcsok (például CategoryID a SupplierID táblázatban vagy Products a táblázatban) szerkesztésekor.

Boldog programozást!

Tudnivalók a szerzőről

Scott Mitchell, hét ASP/ASP.NET-könyv szerzője és a 4GuysFromRolla.com alapítója, 1998 óta dolgozik a Microsoft webtechnológiáival. Scott független tanácsadóként, edzőként és íróként dolgozik. Legújabb könyve Sams Tanuld meg ASP.NET 2.0 24 óra alatt. Ő itt elérhető mitchell@4GuysFromRolla.com.

Külön köszönet

Ezt az oktatóanyag-sorozatot sok hasznos véleményező áttekintette. Az oktatóanyag vezető véleményezői Liz Shulok és Zack Jones voltak. Szeretné áttekinteni a közelgő MSDN-cikkeimet? Ha igen, írj egy sort a mitchell@4GuysFromRolla.com-ra.

ElőzőKövetkező