Discussions on Microsoft technologies: March 2011

Friday, March 25, 2011

Highliting Row in DataGrid on mouse over and adding row click eventt to gridview

Here is the example for adding mouseover effect and also adding row click event to the grid rows.

Aspx page with code behind:

<%@ Page Language="C#" %> 
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<script runat="server">  
  
    protected void grvContact_RowDataBound(object sender, GridViewRowEventArgs e) 
    { 
        if (e.Row.RowType == DataControlRowType.DataRow) 
        { 
            e.Row.Attributes.Add("onmouseover", "this.style.backgroundColor='#aaaaaa';this.style.cursor='hand'"); 
            e.Row.Attributes.Add("onmouseout", "this.style.backgroundColor='ffffff';"); 
            e.Row.Attributes.Add("onclick", ClientScript.GetPostBackClientHyperlink(this.grvContact, "Select$" + e.Row.RowIndex)); 
        } 
    } 
 
    //this code to avoid the validation request issue
    protected override void Render(HtmlTextWriter writer) 
    { 
        for (int i = 0; i < this.grvContact.Rows.Count; i++) 
        { 
            ClientScript.RegisterForEventValidation(this.grvContact.UniqueID, "Select$" + i); 
        } 
        base.Render(writer); 
    } 
 
    protected void grvContact_SelectedIndexChanged(object sender, EventArgs e) 
    { 
        Label1.Text = "Row with the contact ID <b>" + this.grvContact.SelectedDataKey.Value.ToString() + " </b> clicked."; 
    } 
</script> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head id="Head1" runat="server"> 
    <title></title> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 
        <asp:GridView ID="grvContact" runat="server" DataSourceID="SqlDataSource2" DataKeyNames="ContactID" 
            AutoGenerateColumns="False" 
            AllowPaging="true" OnRowDataBound="grvContact_RowDataBound"  
            onselectedindexchanged="grvContact_SelectedIndexChanged"> 
            <Columns> 
                <asp:BoundField DataField="ContactID" HeaderText="ContactID" /> 
                <asp:BoundField DataField="FirstName" HeaderText="FirstName" /> 
                <asp:BoundField DataField="MiddleName" HeaderText="MiddleName" /> 
                <asp:BoundField DataField="LastName" HeaderText="LastName" /> 
            </Columns> 
        </asp:GridView> 
    </div> 
    <asp:SqlDataSource ID="SqlDataSource2" runat="server" ConnectionString="<%$ ConnectionStrings:AdventureWorksConnectionString %>" 
        SelectCommand="SELECT TOP 100 [ContactID], [FirstName], [MiddleName], [LastName] FROM [AdventureWorks].[Person].[Contact]"> 
    </asp:SqlDataSource> 
    <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label> 
    </form> 
</body> 
</html>

Friday, March 18, 2011

Filter datagrid based on some condition

Hi,

Here is the code to filter or search the gridview based on some condition.Aspx page:

<%@ Page Language="C#" %>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Text box Search example</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <table border="1px solid">
            <tr>
                <td>
                    Enter product Name:
                </td>
                <td>
                    <asp:TextBox ID="txtProductName" runat="server"></asp:TextBox>
                </td>
                <td>
                    <asp:Button ID="btnSearch" runat="server" Text="Search" />
                </td>
            </tr>
            <tr>
                <td colspan="3">
                    <asp:GridView ID="grvProducts" runat="server" AllowPaging="True" AutoGenerateColumns="False"
                        DataKeyNames="ProductID" DataSourceID="SqlDataSource1" ShowFooter="True">
                        <Columns>
                            <asp:BoundField DataField="ProductID" HeaderText="ProductID" SortExpression="ProductID" />
                            <asp:BoundField DataField="ProductName" HeaderText="ProductName" SortExpression="ProductName" />
                            <asp:BoundField DataField="UnitsInStock" HeaderText="UnitsInStock" SortExpression="UnitsInStock" />
                            <asp:BoundField DataField="UnitPrice" HeaderText="UnitPrice" SortExpression="UnitPrice" />
                        </Columns>
                    </asp:GridView>
                </td>
            </tr>
        </table>
        <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
            SelectCommand="SELECT [ProductID], [ProductName], [UnitsInStock], [UnitPrice] FROM [Alphabetical list of products] WHERE ([ProductName] LIKE '%' + @ProductName + '%')">
            <SelectParameters>
                <asp:ControlParameter ControlID="txtProductName" DefaultValue="%" Name="ProductName"
                    PropertyName="Text" Type="String" />
            </SelectParameters>
        </asp:SqlDataSource>
    </div>
    </form>
</body>
</html>

Thursday, March 10, 2011

Master-detail scenario: dropdown and griedview using xmldatasource

Hi,
I creatde an example for how to use Xpath property of the XmlDatSource to filter the records based on the dropdown selected value.
Here in the below example on page load all the records in the grid are displayed, once the user selected the employee name from the dropdown then records will be filterd based on the dropdown's selected item.
Here is the compelete Aspx page with code:

<%@ Page Language="C#" %> 
 
<%@ Import Namespace="System.Data" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<script runat="server"> 
 
    protected void ddlEmployee_SelectedIndexChanged(object sender, EventArgs e) 
    { 
        if (ddlEmployee.SelectedItem.Text != "Select....") 
            grvDataSource.XPath = "/Employees/Employee[@Name='" + ddlEmployee.SelectedItem.Text + "']"; 
        else 
            grvDataSource.XPath = "/Employees/Employee"; 
    } 
 
</script> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head id="Head1" runat="server"> 
    <title>Read XML Example</title> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 
        <table> 
            <tr> 
                <td> 
                    Select Employee : 
                </td> 
                <td> 
                    <asp:DropDownList ID="ddlEmployee" runat="server" DataSourceID="ddlDataSource" DataTextField="Name" 
                        DataValueField="Id" AppendDataBoundItems="true" AutoPostBack="True" OnSelectedIndexChanged="ddlEmployee_SelectedIndexChanged"> 
                        <asp:ListItem Selected="True">Select....</asp:ListItem> 
                    </asp:DropDownList> 
                </td> 
            </tr> 
            <tr> 
                <td colspan="2"> 
                    <asp:GridView ID="grvEmployee" runat="server" DataSourceID="grvDataSource"> 
                    </asp:GridView> 
                </td> 
            </tr> 
        </table> 
    </div> 
    <asp:XmlDataSource ID="ddlDataSource" runat="server" DataFile="~/App_Data/empData.xml"> 
    </asp:XmlDataSource> 
     <asp:XmlDataSource ID="grvDataSource" runat="server" DataFile="~/App_Data/empData.xml"> 
    </asp:XmlDataSource> 
    </form> 
</body> 
</html>

empData.xml:

<?xml version="1.0" encoding="utf-8" ?>
<Employees>
  <Employee Id="1" Name="ABC" Department="Computers" Salary="10000">
  </Employee>
  <Employee Id="2" Name="CDE" Department="Civil" Salary="20000">
  </Employee>
  <Employee Id="3" Name="FDS" Department="Computers" Salary="15000">
  </Employee>
</Employees>

Tuesday, March 8, 2011

GridView paging, retaining the old page afetr navigating

Hi,
This can be achived by storing the page index in the session variable and reassign the page index to the grid while populating data back.
Here I have an example how we can achive this .

AspxPage:(RememberPageGrid.aspx)

<%@ Page Language="C#" %> 
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<script runat="server"> 
    protected void Page_Load(object sender, EventArgs e) 
    { 
        if (!IsPostBack) 
        { 
            if (Session["PageIndex"] != null && !string.IsNullOrEmpty(Session["PageIndex"].ToString())) 
                GridView1.PageIndex = (int)Session["PageIndex"]; 
        } 
    } 
 
    protected void GridView1_PageIndexChanging(object sender, GridViewPageEventArgs e) 
    { 
        Session["PageIndex"] = e.NewPageIndex; 
    } 
 
    protected void Button1_Click(object sender, EventArgs e) 
    { 
        Response.Redirect("OtherPage.aspx"); 
    } 
     
</script> 
<html> 
<head id="Head1" runat="server"> 
    <title>GridView example to remember page number</title> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 
        <asp:GridView ID="GridView1" runat="server" DataKeyNames="ProductID" AutoGenerateColumns="False" 
            AllowPaging="True" AllowSorting="True" OnPageIndexChanging="GridView1_PageIndexChanging" 
            DataSourceID="sqlDataSource"> 
            <Columns> 
                <asp:BoundField ReadOnly="True" HeaderText="ProductID" DataField="ProductID" SortExpression="ProductID"> 
                </asp:BoundField> 
                <asp:BoundField HeaderText="ProductName" DataField="ProductName" SortExpression="ProductName"> 
                </asp:BoundField> 
                <asp:BoundField DataField="UnitPrice" HeaderText="UnitPrice" SortExpression="UnitPrice" /> 
            </Columns> 
        </asp:GridView> 
        <asp:SqlDataSource ID="sqlDataSource" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>" 
            SelectCommand="SELECT [ProductID], [ProductName], [UnitPrice] FROM [Alphabetical list of products]"> 
        </asp:SqlDataSource> 
    </div> 
    <asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Go to some other page" /> 
    </form> 
</body> 
</html>

RedirectedPage(OtherPage.aspx):

<%@ Page Language="C#" %> 
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<script runat="server"> 
 
    protected void Button1_Click(object sender, EventArgs e) 
    { 
        Response.Redirect("RememberPageGrid.aspx"); 
    } 
</script> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 
        <asp:Button ID="Button1" runat="server" Text="Go back" onclick="Button1_Click"  
            style="height: 26px" /> 
    </div> 
    </form> 
</body> 
</html>