.NET Tutorials, Forums, Interview Questions And Answers
Welcome :Guest
 
Sign In
Register
 
Win Surprise Gifts!!!
Congratulations!!!


Top 5 Contributors of the Month
david stephan

Home >> Articles >> ASP.NET >> Post New Resource Bookmark and Share   

 Subscribe to Articles

Client side evaluation of GridView data

Posted By:shankey       Posted Date: February 22, 2011    Points: 100    Category: ASP.NET    URL: http://www.dotnetspark.com  

Client side evaluation of GridView data. Following is the screen which evaluate the grid view data on client side
 

CLIENT SIDE EVALUATION OF GRIDVIEW

Following is the screen which evaluate  the grid view data on client side. Based on the data we can set the content/status of the controls. As shown below, the text of the user name column, check/uncheck of is male column, and the setting of green dot image for active user and red dot image for the inactive user are set at the client side.

Following is the structure  of sample data table with UserName,Ismale,IsActive column which has string,Boolean,Boolean data respectively.

  //Creation of static datatable

         DataTable dt = new DataTable();

        dt.Columns.Add("UserName", typeof(string));

        dt.Columns.Add("IsMale", typeof(bool));

        dt.Columns.Add("IsActive", typeof(Boolean));

 

Following is the sample data for the above datatable which we will bind to the gridview at server side.

dt.Rows.Add("Dharmedra","true","true");

        dt.Rows.Add("Katrina", "false", "true");

        dt.Rows.Add("Sunny", "true", "false");

        dt.Rows.Add("Baba ramdev", "true", "true");

        dt.Rows.Add("Sanjay dutt", "true", "false");

        dt.Rows.Add("Kareena kapoor", "false", "false");

 

Following is the way we bind the datatable to the grid view:

 

        //Binding static datatable to the grid view

        dgv.DataSource = dt;

        dgv.DataBind();

Now the main task we have to do i.e. Client side evaluation of the datatable binded to the grid view.

Following is the gridview we created using aspx page. The lines highlighted with yellow color are the controls used in the itemtemplate  section gridview control. These three control evaluate the data of the grid at the client side.

<asp:GridView ID="dgv" runat="server" AllowPaging="True" AllowSorting="True" AutoGenerateColumns="False"

        CssClass="GridViewStyle" GridLines="None" Width="100%">

        <Columns>

            <asp:TemplateField HeaderText="Name">

                <HeaderTemplate>

                    <table width="100%" border="0" cellspacing="0" cellpadding="0">

                        <tr align="center">

                            <th align="left" width="60%">

                                <asp:Label runat="server" ID="Label1" Text='User Name'>asp:Label>

                            th>

                            <th align="center" width="20%">

                                <asp:Label runat="server" ID="Label2" Text='Is Male?'>asp:Label>

                            th>

                            <th align="center" width="20%">

                                <asp:Label runat="server" ID="Label3" Text='Is Active?'>asp:Label>

                            th>

                        tr>

                    table>

                HeaderTemplate>

                <ItemTemplate>

                    <table width="100%" border="0" cellspacing="0" cellpadding="0">

                        <tr>

                            <td align="left" width="60%">

                                <asp:Label runat="server" ID="lbluser" Text='<%#Eval("UserName") %>'>asp:Label>

                            td>

                            <td align="center" width="20%">

                                <asp:CheckBox runat="server" ID="chk" Checked='<%# Eval("IsMale") %>'>asp:CheckBox>

                            td>

                            <td align="center" width="20%">

                                <asp:Image runat="server" ID="img" ImageUrl='<%# (Eval("IsActive").ToString().ToLower() == "true" ? "~/Images/Green.png" : "~/Images/Red.png" ) %>' />

                            td>

                        tr>

                    table>

                ItemTemplate>

            asp:TemplateField>

        Columns>

        <RowStyle CssClass="RowStyle" />

        <EmptyDataRowStyle CssClass="EmptyRowStyle" />

        <PagerStyle CssClass="PagerStyle" />

        <SelectedRowStyle CssClass="SelectedRowStyle" />

        <HeaderStyle CssClass="HeaderStyle" />

        <EditRowStyle CssClass="EditRowStyle" />

        <AlternatingRowStyle CssClass="AltRowStyle" />

    asp:GridView>

 

 

 

<asp:Label runat="server" ID="lbluser" Text='<%#Eval("UserName") %>'>asp:Label>

 

<asp:CheckBox runat="server" ID="chk" Checked='<%# Eval("IsMale") %>'>asp:CheckBox>

 

<asp:Image runat="server" ID="img" ImageUrl='<%# (Eval("IsActive").ToString().ToLower() == "true" ? "~/Images/Green.png" : "~/Images/Red.png" ) %>' />

 

In all the above lines

<%#Eval("UserName") %> evaluates the UserName column of the datagrid

 

<%# Eval("IsMale") %> evaluates the IsMale column

 

<%# (Eval("IsActive").ToString().ToLower() == "true" ? "~/Images/Green.png" : "~/Images/Red.png" ) %> evaluates the IsActive column and set path for the ImageUrl attribute of the Image control.

 


 Subscribe to Articles

     

Further Readings:

Responses

No response found. Be the first to respond this post

Post Comment

You must Sign In To post reply
Find More Articles on C#, ASP.Net, Vb.Net, SQL Server and more Here

Hall of Fame    Twitter   Terms of Service    Privacy Policy    Contact Us    Archives   Tell A Friend