Monday, November 8, 2010

Using Query Strings

A lot of options are available for state management in Asp.net. In this post i will show you how to use query strings to transfer data from one web form to another. I will be using Visual Web developer 2010 express.

Query Strings?
 Query string is client based state management tool. It is passed with the URL from one page to another. The query string variable starts after a '?' ;
Note: 
Its not a great idea to use query strings to contain sensitive information like password or other private stuff.
Some browsers have blogged very large URL's so its good to keep your query string as short as possible.

Lets Do it:
As I mentioned earlier that i will be using visual web developer 2010. If you are using a previous version it does not really matter. 
So in this example we will take the name, age and email address of the user and simply display it on the other page using query strings. 
In the design view of your default.aspx page drag and drop three text boxes. change the id if you want i'm going to change them to something understandable.

here is my source:

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
        .style1
        {
            width: 100%;
        }
        .style2
        {
            width: 166px;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <table class="style1">
        <tr>
            <td class="style2">
                Name:</td>
            <td>
                <asp:TextBox ID="Text_name" runat="server" Height="22px" Width="139px"></asp:TextBox>
            </td>
        </tr>
        <tr>
            <td class="style2">
                Age:</td>
            <td>
                <asp:TextBox ID="Text_age" runat="server" Height="22px" Width="137px"></asp:TextBox>
            </td>
        </tr>
        <tr>
            <td class="style2">
                Email:</td>
            <td>
                <asp:TextBox ID="Text_email" runat="server" Height="22px" Width="134px"></asp:TextBox>
            </td>
        </tr>
        <tr>
            <td class="style2">
                <asp:Button ID="Button1" runat="server" Height="26px" onclick="Button1_Click" 
                    Text="Button" Width="61px" />
            </td>
            <td>
                &nbsp;</td>
        </tr>
    </table>
    </form>
</body>
</html>


Now my design view looks something like this:


Now double click on the button, and lets write the c# code for the button click even:

here goes:

//code start

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }
    protected void Button1_Click(object sender, EventArgs e)
    {
        string url = "page2.aspx?";
        string name = Text_name.Text; //from name text box 
        string age = Text_age.Text;  //from name text box
        string email = Text_email.Text;  //from name text box

        url += "name=" + name + "&" + "age=" + age + "&" + "email=" + email; //three query string variables used

        Response.Redirect(url);


    } 
}

//code end-------------------------------------------

Now I created added another web form by name "page2.aspx" lets check. In the design view i have drag dropped three label controls and my page source looks something like this:


<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    
        Name:
        <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
    
    </div>
    <p>
        Age:
        <asp:Label ID="Label2" runat="server" Text="Label"></asp:Label>
    </p>
    <p>
        Email:
        <asp:Label ID="Label3" runat="server" Text="Label"></asp:Label>
    </p>
    </form>
</body>
</html>


Now the C# code behind for requesting the query string data:

//code goes here:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class page2 : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        Label1.Text = Request.QueryString["name"];
        Label2.Text = Request.QueryString["age"];
        Label3.Text = Request.QueryString["email"];
    }
}
//code ends

Thats all there is!! enjoy!!
Output:

Page 1:









3 comments:

  1. Thanks for sharing excellent post about creating new and rich web application with ado.net.
    DOT NET Training in Chennai

    ReplyDelete
  2. This technical post helps me to improve my skills set, thanks for this wonder article I expect your upcoming blog, so keep sharing...
    Regards,
    Python Training in Chennai

    ReplyDelete