Sdílet prostřednictvím

Vlastní formátování založené na datech (C#)

od Scotta Mitchella

Stáhnout PDF

Úprava formátu Objektu GridView, DetailsView nebo FormView na základě dat vázaných na něj lze dosáhnout několika způsoby. V tomto kurzu se podíváme na to, jak provádět formátování vázané na data pomocí obslužných rutin událostí DataBound a RowDataBound.

Úvod

Vzhled ovládacích prvků GridView, DetailsView a FormView lze přizpůsobit prostřednictvím řadu vlastností souvisejících se stylem. Vlastnosti jako CssClass, Font, , BorderWidth, BorderStyle, BorderColorWidtha Height, mimo jiné, určují obecný vzhled vykresleného ovládacího prvku. Vlastnosti, včetně HeaderStyle, RowStyle, AlternatingRowStylea další umožňují použít stejná nastavení stylu pro konkrétní oddíly. Podobně se tato nastavení stylu dají použít na úrovni pole.

V mnoha scénářích ale požadavky na formátování závisí na hodnotě zobrazených dat. Pokud například chcete upoutat pozornost na vyprodané produkty, sestava s informacemi o produktu může nastavit barvu pozadí na žlutou pro ty produkty, jejichž pole UnitsInStock a UnitsOnOrder jsou rovna 0. Abychom zdůraznili dražší produkty, můžeme chtít zobrazit ceny těchto produktů, které stojí více než 75,00 USD tučným písmem.

Úprava formátu Objektu GridView, DetailsView nebo FormView na základě dat vázaných na něj lze dosáhnout několika způsoby. V tomto kurzu se podíváme na to, jak provádět formátování vázané na data pomocí obslužných rutin událostí DataBound a RowDataBound. V dalším kurzu prozkoumáme alternativní přístup.

Použití procedury zpracování událostí ovládacího prvku DetailsView

Pokud jsou data svázaná s DetailsView, buď z ovládacího prvku zdroje dat, nebo prostřednictvím programového přiřazování dat k vlastnosti ovládacího prvku DataSource a volání jeho DataBind() metody, dojde k následující posloupnosti kroků:

  1. Událost datového webového ovládacího prvku DataBinding se spustí.
  2. Data jsou navázána na webový ovládací prvek.
  3. Událost datového webového ovládacího prvku DataBound se spustí.

Vlastní logiku je možné vložit okamžitě po krocích 1 a 3 prostřednictvím obslužné rutiny. Vytvořením obslužné rutiny události pro DataBound událost můžeme programově určit data, která jsou svázaná s ovládacím prvku data Web, a podle potřeby upravit formátování. Pro ilustraci tohoto příkladu vytvoříme DetailsView, který zobrazí obecné informace o produktu, ale zobrazí UnitPrice hodnotu tučným písmem kurzívou, pokud překročí 75,00 USD.

Krok 1: Zobrazení informací o produktu v detailsView

CustomColors.aspx Otevřete stránku ve CustomFormatting složce, přetáhněte ovládací prvek DetailsView z panelu nástrojů do Návrháře, nastavte hodnotu jeho vlastnosti ID na ExpensiveProductsPriceInBoldItalic, a vytvořte vazbu na nový ovládací prvek ObjectDataSource, který vyvolá metodu ProductsBLL třídy GetProducts(). Podrobné kroky pro dosažení tohoto postupu jsou zde vynechány kvůli stručnosti, protože jsme je podrobně prozkoumali v předchozích kurzech.

Jakmile svážete ObjectDataSource s DetailsView, věnujte chvíli úpravě seznamu polí. Rozhodl jsem se odebrat ProductID, SupplierID, CategoryID, UnitsInStock, UnitsOnOrder, ReorderLevel a Discontinued BoundFields a přejmenoval a přeformátoval zbývající BoundFields. Také jsem vymazal nastavení Width a Height. Vzhledem k tomu, že DetailsView zobrazuje jenom jeden záznam, musíme povolit stránkování, aby koncový uživatel mohl zobrazit všechny produkty. Uděláte to tak, že zaškrtnete políčko Povolit stránkování v inteligentní značce DetailsView.

Zaškrtněte políčko Povolit stránkování v inteligentní značce DetailsView.

Obrázek 1: Zaškrtněte políčko Povolit stránkování v inteligentní značce DetailsView (kliknutím zobrazíte obrázek v plné velikosti).

Po těchto změnách bude kód DetailsView následující:

<asp:DetailsView ID="DetailsView1" runat="server" AllowPaging="True"
    AutoGenerateRows="False" DataKeyNames="ProductID"
    DataSourceID="ObjectDataSource1" EnableViewState="False">
    <Fields>
        <asp:BoundField DataField="ProductName" HeaderText="Product"
          SortExpression="ProductName" />
        <asp:BoundField DataField="CategoryName" HeaderText="Category"
          ReadOnly="True" SortExpression="CategoryName" />
        <asp:BoundField DataField="SupplierName" HeaderText="Supplier"
          ReadOnly="True" SortExpression="SupplierName" />
        <asp:BoundField DataField="QuantityPerUnit"
          HeaderText="Qty/Unit" SortExpression="QuantityPerUnit" />
        <asp:BoundField DataField="UnitPrice" DataFormatString="{0:c}"
          HeaderText="Price"
            HtmlEncode="False" SortExpression="UnitPrice" />
    </Fields>
</asp:DetailsView>

Chvíli vyzkoušejte tuto stránku v prohlížeči.

Ovládací prvek DetailsView zobrazuje jeden produkt najednou.

Obrázek 2: Ovládací prvek DetailsView zobrazuje jeden produkt najednou (kliknutím zobrazíte obrázek v plné velikosti).

Krok 2: Programové určení hodnoty dat v obslužné rutině události DataBound

Abychom mohli zobrazit cenu tučným písmem, kurzívou pro produkty, jejichž UnitPrice hodnota přesahuje 75,00 KČ, musíme nejprve být schopni programově určit UnitPrice hodnotu. Pro DetailsView lze tohoto dosáhnout v obslužné rutině události DataBound. Chcete-li vytvořit obslužnou rutinu události klikněte na DetailsView v Návrháři a přejděte do okna Vlastnosti. Stisknutím klávesy F4 ho zobrazíte, pokud není viditelný, nebo přejděte do nabídky Zobrazení a vyberte možnost Okno vlastností. V okně Vlastnosti kliknutím na ikonu blesku zobrazíte seznam událostí DetailsView. Dále poklikejte na DataBound událost nebo zadejte název obslužné rutiny události, kterou chcete vytvořit.

Vytvoření obslužné rutiny události pro událost DataBound

Obrázek 3: Vytvoření obslužné rutiny pro DataBound událost

Tím se automaticky vytvoří obslužná rutina události a přejdete do části kódu, do které byla přidána. V tuto chvíli uvidíte:

protected void ExpensiveProductsPriceInBoldItalic_DataBound(object sender, EventArgs e)
{

}

K datům vázaným na DetailsView lze přistupovat prostřednictvím DataItem vlastnosti. Vzpomeňte si, že naše ovládací prvky jsou vázány na striktně typovaný DataTable, který se skládá z kolekce instancí striktně typovaných DataRow. Je-li DataTable vázán na DetailsView, první DataRow v DataTable je přiřazena k vlastnosti DataItem objektu DetailsView. Konkrétně je DataItem vlastnost přiřazena DataRowView objektu. Vlastnost DataRowView objektu Row můžeme použít k získání přístupu k podkladovému objektu DataRow, který je ve skutečnosti instancí ProductsRow. Jakmile máme tuto ProductsRow instanci, můžeme se rozhodnout jednoduše kontrolou hodnot vlastností objektu.

Následující kód ukazuje, jak určit, zda UnitPrice je hodnota vázaná na ovládací prvek DetailsView větší než $75,00:

protected void ExpensiveProductsPriceInBoldItalic_DataBound(object sender, EventArgs e)
{
    // Get the ProductsRow object from the DataItem property...
    Northwind.ProductsRow product = (Northwind.ProductsRow)
        ((DataRowView)ExpensiveProductsPriceInBoldItalic.DataItem).Row;
    if (!product.IsUnitPriceNull() && product.UnitPrice > 75m)
    {
        // TODO: Make the UnitPrice text bold and italic
    }
}

Poznámka:

Vzhledem k tomu, že UnitPrice může mít hodnotu NULL v databázi, nejprve zkontrolujeme, že se nejedná o hodnotu NULL, než získáme přístup k vlastnosti ProductsRowUnitPrice. Tato kontrola je důležitá, protože pokud se pokusíme o přístup k UnitPrice vlastnosti, pokud má NULL hodnotu ProductsRow objekt vyvolá StrongTypingException výjimka.

Krok 3: Formátování hodnoty UnitPrice v DetailsView

V tomto okamžiku můžeme zjistit, zda hodnota UnitPrice, která je svázaná s DetailsView, přesahuje 75,00 USD, ale ještě jsme nezjistili, jak programaticky upravit formátování DetailsView odpovídajícím způsobem. Chcete-li změnit formátování celého řádku v DetailsView, programově přistupujte k řádku pomocí DetailsViewID.Rows[index]; chcete-li upravit konkrétní buňku, použijte přístup DetailsViewID.Rows[index].Cells[index]. Jakmile budeme mít odkaz na řádek nebo buňku, můžeme jeho vzhled upravit nastavením jeho vlastností souvisejících se stylem.

Přístup k řádku prostřednictvím kódu programu vyžaduje, abyste znali index řádku, který začíná na 0. Řádek UnitPrice je pátý řádek v DetailsView, který poskytuje index 4 a programově přístupný pomocí ExpensiveProductsPriceInBoldItalic.Rows[4]. V tuto chvíli bychom mohli obsah celého řádku zobrazit tučným kurzívou pomocí následujícího kódu:

ExpensiveProductsPriceInBoldItalic.Rows[4].Font.Bold = true;
ExpensiveProductsPriceInBoldItalic.Rows[4].Font.Italic = true;

Tím se ale oba, popisek (Price) i hodnota, zformátují tučně a kurzívou. Pokud chceme nastavit jen tučné písmo a kurzívu, musíme toto formátování použít na druhou buňku na řádku, což lze provést pomocí následujícího:

ExpensiveProductsPriceInBoldItalic.Rows[4].Cells[1].Font.Bold = true;
ExpensiveProductsPriceInBoldItalic.Rows[4].Cells[1].Font.Italic = true;

Vzhledem k tomu, že naše návody doposud používaly šablony stylů k zachování čistého oddělení mezi vykreslovaným značkováním a informacemi souvisejícími se stylem, místo nastavování konkrétních vlastností stylu použijme raději třídu CSS. Styles.css Otevřete šablonu stylů a přidejte novou třídu CSS s názvem ExpensivePriceEmphasis s následující definicí:

.ExpensivePriceEmphasis
{
    font-weight: bold;
    font-style: italic;
}

Potom v obsluhovači události DataBound nastavte vlastnost buňky CssClass na ExpensivePriceEmphasis. Následující kód zobrazuje obslužnou rutinu DataBound události v plném rozsahu:

protected void ExpensiveProductsPriceInBoldItalic_DataBound(object sender, EventArgs e)
{
    // Get the ProductsRow object from the DataItem property...
    Northwind.ProductsRow product = (Northwind.ProductsRow)
        ((DataRowView)ExpensiveProductsPriceInBoldItalic.DataItem).Row;
    if (!product.IsUnitPriceNull() && product.UnitPrice > 75m)
    {
        ExpensiveProductsPriceInBoldItalic.Rows[4].Cells[1].CssClass =
            "ExpensivePriceEmphasis";
    }
}

Při prohlížení Chai, které stojí méně než 75,00 Kč, se cena zobrazí v normálním písmu (viz obrázek 4). Při prohlížení Mishi Kobe Niku, který má cenu 97,00 Usd, se však cena zobrazí tučně kurzívou (viz obrázek 5).

Ceny nižší než 75,00 Kč jsou zobrazeny v normálním písmu

Obrázek 4: Ceny nižší než 75,00 Kč se zobrazují v normálním písmu (kliknutím zobrazíte obrázek v plné velikosti).

Drahé ceny produktů jsou zobrazeny tučným písmem kurzívou

Obrázek 5: Ceny drahých produktů se zobrazují tučným písmem kurzívou (kliknutím zobrazíte obrázek v plné velikosti).

Používání obslužné rutiny události ovládacího prvku FormView

Kroky pro určení podkladových dat vázaných na FormView jsou stejné jako pro DetailsView: nejprve vytvořte obslužnou rutinu DataBound události, přetypujte vlastnost DataItem na příslušný typ objektu vázaného na ovládací prvek a určete, jak pokračovat. FormView a DetailsView se však liší v tom, jak se vzhled uživatelského rozhraní aktualizuje.

FormView neobsahuje žádné BoundFields, a proto chybí Rows kolekce. Místo toho se FormView skládá ze šablon, které mohou obsahovat kombinaci statického HTML, webového ovládacích prvků a syntaxe vazby dat. Úprava stylu FormView obvykle zahrnuje úpravu stylu jednoho nebo více webových ovládacích prvků v šablonách FormView.

Abychom to mohli ilustrovat, použijeme FormView k zobrazení seznamu produktů, jako je v předchozím příkladu, ale tentokrát zobrazíme jenom název produktu a jednotky na skladě s jednotkami na skladě zobrazenými červeným písmem, pokud je menší než nebo rovno 10.

Krok 4: Zobrazení informací o produktu ve formulářovém zobrazení

Přidat FormView na CustomColors.aspx stránku pod DetailsView a nastavit jeho ID vlastnost na LowStockedProductsInRed. Vytvořte vazbu FormView na ovládací prvek ObjectDataSource vytvořený z předchozího kroku. Tím se vytvoří objekt ItemTemplate, EditItemTemplatea InsertItemTemplate pro FormView. EditItemTemplate Odeberte a InsertItemTemplate zjednodušte ItemTemplate tak, aby zahrnoval pouze hodnoty ProductName a UnitsInStock, každou ve vlastním, vhodně pojmenovaném ovládacím prvku typu Popisek. Stejně jako u DetailsView z předchozího příkladu také zaškrtněte políčko Povolit stránkování v inteligentní značce FormView.

Po těchto úpravách by značení vašeho FormView mělo vypadat podobně jako to následující:

<asp:FormView ID="LowStockedProductsInRed" DataKeyNames="ProductID"
    DataSourceID="ObjectDataSource1" AllowPaging="True"
    EnableViewState="False" runat="server">
    <ItemTemplate>
        <b>Product:</b>
        <asp:Label ID="ProductNameLabel" runat="server"
         Text='<%# Bind("ProductName") %>'>
        </asp:Label><br />
        <b>Units In Stock:</b>
        <asp:Label ID="UnitsInStockLabel" runat="server"
          Text='<%# Bind("UnitsInStock") %>'>
        </asp:Label>
    </ItemTemplate>
</asp:FormView>

Všimněte si, že ItemTemplate obsahuje:

  • Statický HTML text "Product:" a "Units In Stock:" spolu s prvky <br /> a <b>.
  • Web řídí dva ovládací prvky ProductNameLabel Popisek a UnitsInStockLabel.
  • Syntaktická vazba syntaxe <%# Bind("ProductName") %> a <%# Bind("UnitsInStock") %>, která přiřazuje hodnoty z těchto polí k vlastnostem ovládacích prvků Text Label.

Krok 5: Programatické určení hodnoty dat v obslužné rutině události DataBound.

Po dokončení revize FormView je dalším krokem programově určit, zda UnitsInStock je hodnota menší nebo rovna 10. Tohoto dosáhneme u FormView naprosto stejným způsobem jako u DetailsView. Začněte vytvořením obslužné rutiny události pro událost FormView DataBound .

Vytvoření obslužné rutiny události DataBound

Obrázek 6: Vytvoření obslužné rutiny DataBound události

V obslužné rutině události přetypujte vlastnost FormView DataItem na instanci ProductsRow a určete, zda hodnota UnitsInPrice je taková, že ji potřebujeme zobrazit červenou barvou.

protected void LowStockedProductsInRed_DataBound(object sender, EventArgs e)
{
    // Get the ProductsRow object from the DataItem property...
    Northwind.ProductsRow product = (Northwind.ProductsRow)
        ((DataRowView)LowStockedProductsInRed.DataItem).Row;
    if (!product.IsUnitsInStockNull() && product.UnitsInStock <= 10)
    {
        // TODO: Make the UnitsInStockLabel text red
    }
}

Krok 6: Formátování ovládacího prvku Popisek UnitsInStockLabel v ItemTemplate FormView

Posledním krokem je naformátování zobrazené UnitsInStock hodnoty červenou barvou, pokud je hodnota 10 nebo menší. Abychom toho dosáhli, musíme k ovládacímu prvku UnitsInStockLabel programově přistupovat v ItemTemplate a nastavit jeho vlastnosti stylu tak, aby se text zobrazoval červeně. Pokud chcete získat přístup k webovému ovládacímu prvku v šabloně, použijte tuto metodu FindControl("controlID") :

WebControlType someName = (WebControlType)FormViewID.FindControl("controlID");

V našem příkladu chceme získat přístup k ovládacímu prvku Popisek, jehož ID hodnota je UnitsInStockLabel, takže bychom použili:

Label unitsInStock =
    (Label)LowStockedProductsInRed.FindControl("UnitsInStockLabel");

Jakmile budeme mít programový odkaz na webový ovládací prvek, můžeme podle potřeby upravit jeho vlastnosti související se stylem. Stejně jako v předchozím příkladu jsem vytvořil třídu CSS s Styles.css názvem LowUnitsInStockEmphasis. Chcete-li tento styl použít u ovládacího prvku Label Web, nastavte jeho CssClass vlastnost odpovídajícím způsobem.

protected void LowStockedProductsInRed_DataBound(object sender, EventArgs e)
{
    // Get the ProductsRow object from the DataItem property...
    Northwind.ProductsRow product = (Northwind.ProductsRow)
        ((DataRowView)LowStockedProductsInRed.DataItem).Row;
    if (!product.IsUnitsInStockNull() && product.UnitsInStock <= 10)
    {
        Label unitsInStock =
            (Label)LowStockedProductsInRed.FindControl("UnitsInStockLabel");

        if (unitsInStock != null)
        {
          unitsInStock.CssClass = "LowUnitsInStockEmphasis";
        }
    }
}

Poznámka:

Syntaxe pro formátování šablony prostřednictvím kódu programu pro přístup k webovému ovládacímu prvku pomocí FindControl("controlID") a nastavení jeho vlastností souvisejících se stylem lze použít také při použití TemplateFields v ovládacích prvcích DetailsView nebo GridView. V dalším kurzu prozkoumáme TemplateFields.

Obrázky 7 znázorňují FormView při prohlížení produktu, jehož UnitsInStock hodnota je větší než 10, zatímco produkt na obrázku 8 má hodnotu menší než 10.

Pro produkty s dostatečně velkými jednotkami na skladě se nepoužije žádné vlastní formátování.

Obrázek 7: Pro produkty s dostatečně velkými jednotkami na skladě se nepoužije žádné vlastní formátování (kliknutím zobrazíte obrázek s plnou velikostí)

Počet jednotek na skladě je zobrazen červeně u produktů s hodnotou 10 nebo méně

Obrázek 8: Počet jednotek na skladě je u těchto produktů s hodnotami 10 nebo méně zobrazen červeně (kliknutím zobrazíte obrázek plné velikosti).

Formátování pomocí události GridViewRowDataBound

Dříve jsme prozkoumali posloupnost kroků, které ovládací prvky DetailsView a FormView procházejí během vazby dat. Pojďme se na tyto kroky znovu podívat jako na aktualizační funkci.

  1. Událost datového webového ovládacího prvku DataBinding se spustí.
  2. Data jsou navázána na webový ovládací prvek.
  3. Událost datového webového ovládacího prvku DataBound se spustí.

Tyto tři jednoduché kroky jsou dostačující pro DetailsView a FormView, protože zobrazují pouze jeden záznam. Pro GridView, který zobrazí všechny záznamy vázané na něj (nejen první), krok 2 je o něco složitější.

V kroku 2 GridView vytvoří výčet zdroje dat a pro každý záznam vytvoří GridViewRow instanci a vytvoří s ním vazbu aktuálního záznamu. Pro každý GridViewRow přidaný do GridView jsou vyvolány dvě události:

  • RowCreated se spustí poté, co GridViewRow byl vytvořen
  • RowDataBound se aktivuje poté, co je aktuální záznam vázán na GridViewRow.

U objektu GridView je datová vazba přesněji popsána v následujícím pořadí kroků:

  1. Událost GridView DataBinding se aktivuje.

  2. Data jsou svázaná s objektem GridView.

    Pro každý záznam ve zdroji dat

    1. Vytvoření objektu GridViewRow
    2. Spusťte událost RowCreated
    3. Připojte záznam k GridViewRow
    4. Spusťte událost RowDataBound
    5. Přidejte GridViewRow do kolekce Rows

  3. Událost GridView DataBound se aktivuje.

Abychom přizpůsobili formát jednotlivých záznamů GridView, musíme pro danou událost vytvořit obslužnou rutinu RowDataBound události. Pro ilustraci přidáme GridView na CustomColors.aspx stránku se seznamem názvu, kategorie a ceny pro každý produkt a zvýrazníme produkty, jejichž cena je menší než 10,00 USD se žlutou barvou pozadí.

Krok 7: Zobrazení informací o produktu v gridview

Přidejte GridView pod FormView z předchozího příkladu a nastavte jeho ID vlastnost na HighlightCheapProducts. Vzhledem k tomu, že již máme ObjectDataSource, který vrací všechny produkty na stránce, vytvořte vazbu GridView na to. Nakonec upravte BoundFields GridView tak, aby zahrnoval pouze názvy produktů, kategorie a ceny. Po úpravách kódu GridView by měl vypadat takto:

<asp:GridView ID="HighlightCheapProducts" AutoGenerateColumns="False"
    DataKeyNames="ProductID" DataSourceID="ObjectDataSource1"
    EnableViewState="False" runat="server">
    <Columns>
        <asp:BoundField DataField="ProductName" HeaderText="Product"
          SortExpression="ProductName" />
        <asp:BoundField DataField="CategoryName" HeaderText="Category"
          ReadOnly="True" SortExpression="CategoryName" />
        <asp:BoundField DataField="UnitPrice" DataFormatString="{0:c}"
          HeaderText="Price"
            HtmlEncode="False" SortExpression="UnitPrice" />
    </Columns>
</asp:GridView>

Obrázek 9 ukazuje náš postup k tomuto bodu při prohlížení v prohlížeči.

GridView zobrazí seznam názvů, kategorií a cen pro každý produkt.

Obrázek 9: Objekt GridView obsahuje seznam názvů, kategorií a cen pro každý produkt (kliknutím zobrazíte obrázek v plné velikosti).

Krok 8: Programové určení hodnoty dat v obslužné rutině události RowDataBound

Když je ProductsDataTable vázána na GridView, její ProductsRow instance jsou vyčítány a pro každý ProductsRow je vytvořena GridViewRow. Vlastnost GridViewRow objektu DataItem je přiřazena konkrétnímu ProductRow, poté je vyvolána obslužná rutina události GridView RowDataBound. Abychom mohli určit UnitPrice hodnotu každého produktu vázaného na GridView, pak musíme vytvořit obslužnou rutinu události pro událost GridView RowDataBound . V této obslužné rutině události můžeme zkontrolovat UnitPrice hodnotu aktuálního GridViewRow a provést rozhodnutí o formátování pro daný řádek.

Tuto obslužnou rutinu události lze vytvořit pomocí stejné řady kroků jako u FormView a DetailsView.

Vytvoření obslužné rutiny události pro událost RowDataBound objektu GridView

Obrázek 10: Vytvoření obslužné rutiny události pro událost GridView RowDataBound

Vytvoření obslužné rutiny události tímto způsobem způsobí automatické přidání následujícího kódu do části kódu stránky ASP.NET:

protected void HighlightCheapProducts_RowDataBound(object sender, GridViewRowEventArgs e)
{

}

Když se RowDataBound událost aktivuje, obslužná rutina události se předává jako jeho druhý parametr objekt typu GridViewRowEventArgs, který má vlastnost s názvem Row. Tato vlastnost vrátí odkaz na GridViewRow, který byl právě svázán s daty. Pro přístup k ProductsRow instanci, která je vázaná na GridViewRow vlastnost, používáme DataItem následujícím způsobem:

protected void HighlightCheapProducts_RowDataBound(object sender, GridViewRowEventArgs e)
{
    // Get the ProductsRow object from the DataItem property...
    Northwind.ProductsRow product = (Northwind.ProductsRow)
        ((System.Data.DataRowView)e.Row.DataItem).Row;
    if (!product.IsUnitPriceNull() && product.UnitPrice < 10m)
    {
        // TODO: Highlight the row yellow...
    }
}

Při práci s obslužnou rutinou RowDataBound události je důležité mít na paměti, že GridView se skládá z různých typů řádků a že se tato událost aktivuje pro všechny typy řádků. GridViewRowTyp může být určen vlastností RowType a může mít jednu z možných hodnot:

  • DataRow řádek, který je svázán se záznamem z objektu GridView DataSource
  • EmptyDataRow řádek zobrazený, pokud je objekt GridView DataSource prázdný.
  • Footer řádek zápatí; zobrazení, pokud je vlastnost GridView ShowFooter nastavena na true
  • Header řádek záhlaví; zobrazení, pokud je vlastnost ShowHeader gridView nastavena na true (výchozí)
  • Pager Pro GridView, který implementuje stránkování, řádek zobrazující stránkovací rozhraní
  • Separator nepoužívá se pro GridView, ale používá vlastnosti RowType ovládacích prvků DataList a Repeater, dva datové webové ovládací prvky, které probereme v budoucích kurzech.

EmptyDataRow, Header, Footer a Pager řádky nejsou přidruženy k DataSource záznamu, takže vlastnost null bude mít vždy hodnotu DataItem. Z tohoto důvodu se před pokusem o práci s aktuální GridViewRowvlastností DataItem musíme nejprve ujistit, že pracujeme s objektem DataRow. Toho lze dosáhnout tak, že zkontrolujete vlastnost objektu GridViewRowRowType takto:

protected void HighlightCheapProducts_RowDataBound(object sender, GridViewRowEventArgs e)
{
    // Make sure we are working with a DataRow
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        // Get the ProductsRow object from the DataItem property...
        Northwind.ProductsRow product = (Northwind.ProductsRow)
            ((System.Data.DataRowView)e.Row.DataItem).Row;
        if (!product.IsUnitPriceNull() && product.UnitPrice < 10m)
        {
          // TODO: Highlight row yellow...
        }
    }
}

Krok 9: Zvýraznění žlutého řádku, pokud je hodnota UnitPrice menší než 10,00 USD

Posledním krokem je programově zvýraznění celého GridViewRow řádku, pokud UnitPrice je hodnota pro tento řádek menší než 10,00 USD. Syntaxe pro přístup k řádkům nebo buňkám objektu GridView je stejná jako u DetailsView: použijte GridViewID.Rows[index] pro přístup k celému řádku a GridViewID.Rows[index].Cells[index] pro přístup k určité buňce. Pokud však obslužná rutina události RowDataBound aktivuje datovou vazbu GridViewRow, ještě není přidána do kolekce Rows GridView. Proto nelze získat přístup k aktuální GridViewRow instanci z RowDataBound obslužné rutiny události pomocí kolekce Řádky.

Místo GridViewID.Rows[index] můžeme v obslužné rutině události GridViewRow odkazovat na aktuální instanci RowDataBound pomocí e.Row. To znamená, že abychom zvýraznili aktuální instanci GridViewRow z obslužné rutiny události RowDataBound, použili bychom:

e.Row.BackColor = System.Drawing.Color.Yellow;

Místo přímého nastavení vlastností GridViewRowBackColor se držme používání tříd CSS. Vytvořil jsem třídu CSS s názvem AffordablePriceEmphasis , která nastaví barvu pozadí na žlutou. Dokončený obslužný program události RowDataBound:

protected void HighlightCheapProducts_RowDataBound(object sender, GridViewRowEventArgs e)
{
    // Make sure we are working with a DataRow
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        // Get the ProductsRow object from the DataItem property...
        Northwind.ProductsRow product = (Northwind.ProductsRow)
            ((System.Data.DataRowView)e.Row.DataItem).Row;
        if (!product.IsUnitPriceNull() && product.UnitPrice < 10m)
        {
            e.Row.CssClass = "AffordablePriceEmphasis";
        }
    }
}

Nejdostupnější produkty jsou zvýrazněné žlutě

Obrázek 11: Nejdostupnější produkty jsou zvýrazněné žlutě (kliknutím zobrazíte obrázek s plnou velikostí)

Shrnutí

V tomto kurzu jsme viděli, jak formátovat GridView, DetailsView a FormView na základě dat vázaných na ovládací prvek. Abychom toho dosáhli, vytvořili jsme obslužnou rutinu pro události DataBound a RowDataBound, ve které byla podkladová data prozkoumána spolu se změnou formátování, pokud to bylo potřebné. Pro přístup k datům vázaným na DetailsView nebo FormView používáme DataItem vlastnost v DataBound obslužné rutině události; pro GridView vlastnost každé GridViewRow instance DataItem obsahuje data svázaná s tímto řádkem, která je k dispozici v RowDataBound obslužné rutině události.

Syntaxe pro programové úpravy formátování webového ovládacího prvku dat závisí na webovém ovládacím prvku a způsobu zobrazení dat. U ovládacích prvků DetailsView a GridView lze k řádkům a buňkám přistupovat pomocí pořadového indexu. Pro FormView, který používá šablony, FindControl("controlID") metoda se běžně používá k vyhledání webového ovládacího prvku z šablony.

V dalším kurzu se podíváme na to, jak používat šablony s GridView a DetailsView. Kromě toho uvidíme další techniku přizpůsobení formátování na základě podkladových dat.

Šťastné programování!

O autorovi

Scott Mitchell, autor sedmi knih ASP/ASP.NET a zakladatel 4GuysFromRolla.com, pracuje s webovými technologiemi Microsoftu od roku 1998. Scott pracuje jako nezávislý konzultant, trenér a spisovatel. Jeho nejnovější kniha je Sams: Nauč se ASP.NET 2.0 za 24 hodin. Může být dosažitelný na mitchell@4GuysFromRolla.comadrese .

Zvláštní díky

Tato série kurzů byla zkontrolována mnoha užitečnými recenzenty. Vedoucí hodnotící tohoto kurzu byli E.R. Gilmore, Dennis Patterson a Dan Jagers. Chcete si projít nadcházející články MSDN? Pokud ano, napište mi zprávu na mitchell@4GuysFromRolla.com.

Další

  • Last updated on