Hidden Field

Hidden Field is another client side state management technique. It is mainly used to store small values. It is not rendered in the browser as it is invisible to the browser. It can hold one value for a variable. 

      To add Hidden Field to the web application we only need to drag and drop the HiddenField component from the ToolBox. Then the source code will have the following code:

  <asp:HiddenField ID="HiddenField1" runat="server" />

This is the way to create a HiddenField. Now we only need to save the value of a variable to this and then access it when required.

Let us look at an example for further clarity.

In this example we just take a TextBox to input the name of the user and two buttons, one for saving the value of the TextBox to the HiddenField and the other button to retrieve the value from it to the TextBox.

Design  

Code Behind

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

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

        protected void Button1_Click(object sender, EventArgs e)    //Save Button Click method
        {
                HiddenField1.Value = TextBox1.Text;      //Saving the TextBox value in the HiddenField
                TextBox1.Text = "";
        }

        protected void Button2_Click(object sender, EventArgs e)    //Previous Button Click method 

        {
            if (HiddenField1.Value != null)
            {
                TextBox1.Text = HiddenField1.Value;      //Retrieving the value from the HiddenField
            }
        }
    }
} 

Output

 Before clicking save button:

After clicking save button:

After clicking Previous button:

As you can the username is retrieved from the HiddenField.

Point to Remember

•  It is used for same values.
• It is not rendered in the browser as it is invisible to the browser.
• It is preferable when a variable value changes frequently.

ABOUT ME

I am a Tech Lover. I like to know new tech news and stuffs like that. I am like you all learning and sharing knowledge that i have....

If you like my posts then please like and share and follow me for all the stuffs like these in future.

Thanks for your support. Keep supporting me like this.

Akhil Vijayan

Query String

Query String is used to send data from one page to another page through URL. The Query String are used to start with a "?" sign. If we want to add more Query String we use "&" sign.

Query Strings are mainly used to send small data across pages. In ASP.NET, to move from one page to another we can use Response.Redirect(It is one of the page navigation technique) which redirects the current page to the specified page.Response.Redirect takes URL to specify the path of the new page and with the URL we can pass the Query String and can code to access the value in another page.

I will discuss all the navigation techniques later. Let us stick to the Response.Redirect for now.

Let us take an example to make it clear. We will take the same example which I took for Cookies and ViewState variable. So we will take input name and blog name from the user and will try to move these details to another page and then display it on the new page.

Let us take the name of first page as Page1.aspx and second one as Page2.aspx.

Design

Page1.aspx

Page2.aspx

Code Behind

Page1.aspx.cs

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

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

        }

        protected void Button1_Click(object sender, EventArgs e)
        {
            //Redirecting to Page2.aspx and sending the values with it
            Response.Redirect("Page2.aspx?Name="+TextBox1.Text+"&Blog Name="+TextBox2.Text);
        }
    }
}

Page2.aspx.cs

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

namespace httpstateless
{
    public partial class Page2 : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            //Accessing the values send by Page1.aspx
            Label1.Text = Request.QueryString["Name"];
            Label2.Text = Request.QueryString["Blog Name"];
        }
    }
}

Output

Output before clicking the redirect button(current page is Page1.aspx):

Output after clicking the redirect button(loads the Page2.aspx):

Now in the above code when we send the data with the URL we first used "?" sign and gave a name to it and then use an "=" sign. After that a "+" sign and pass the TextBox1 value to the name which we used. To pass more value we have to use & and then the name. After sending the data we access it by Request.QueryString in the new page.

Points to Remember

• It is generally used to send data from one page to another with URL.
• It is not suitable for storing large data.
• It is not suitable to send confidential data like passwords as the new page's URL will also contain the text send by us when we redirect to that page(you refer the Page2 output as it reflects the same).
  

Cookies

Cookies are usually used to store user identity or we can say user data. Cookies are small text files which is created by the client browser and are stored in the hard drive. 

When a user makes an initial request for a page the server creates a cookie for that user and stores it in the hard drive and then again the same user tries to access a page in the same web site, the cookie stored is matched and then it grants the access.  Cookies can be send from one page to another after creation. It is not possible in the case of View State variables as it works for a single page.

There are two types of cookies:

• Persistent Cookie  
• Non-Persistent Cookie

Persistent Cookie

When we set an expiry time to a cookie it is known as Persistent Cookie. It remains stored till the time expires.

Example

Let us take the following example:

Design

 This application will save the details entered in the textbox into the cookie when we will click the save button. When we will click display button it displays the saved cookie in the two labels below the button.

Code Behind

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

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

        }

        protected void Button1_Click(object sender, EventArgs e)  //save button
        {
            //Creating cookie and saving the value.
            HttpCookie cookie = new HttpCookie("User Details");
            cookie["Name"] = TextBox1.Text;
            cookie["Blog Name"] = TextBox2.Text;
            //Setting the expire time to 30 days
            cookie.Expires = DateTime.Now.AddDays(30);
            Response.Cookies.Add(cookie);
        }

        protected void Button2_Click(object sender, EventArgs e)   //display button
        {
            //Cookie request.
            HttpCookie cookie = Request.Cookies["User Details"];
            if (cookie != null)
            {
                Label1.Text = cookie["Name"];
                Label2.Text = cookie["Blog Name"];
            }
        }
    }
}

Output

This is the output after the whole process. Now if you close the browser and then open the page again and display without saving the new cookie, it will display the retained value in the cookie that we saved earlier. This is because we are using the persistent cookie and we gave the expiry time of 30 days. So it will be retained for that period of time.

Non-Persistent Cookie

Non-Persistent Cookies are not saved permanently in the hard drive. It is retain as long as the user is not closing the browser. When the browser is closed all non-persistent cookies are cleared automatically.

Design

Same as above example

Code Behind


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

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

        }

        protected void Button1_Click(object sender, EventArgs e)  //save button
        {
            //Creating cookie and saving the value.
            HttpCookie cookie = new HttpCookie("User Details");
            cookie["Name"] = TextBox1.Text;               //Note that expiry time is not specified
            cookie["Blog Name"] = TextBox2.Text;
            Response.Cookies.Add(cookie);
        }

        protected void Button2_Click(object sender, EventArgs e)   //display button
        {
            //Cookie request.
            HttpCookie cookie = Request.Cookies["User Details"];
            if (cookie != null)
            {
                Label1.Text = cookie["Name"];
                Label2.Text = cookie["Blog Name"];
            }
        }
    }
}

Output

Output is also same as that of persistent cookies.But when we close the browser after this all the cookies are cleared. So when we load the page again in the browser and click display without entering the value in the textbox the label will remain empty as cookies are not retained after the browser is closed.

View State

View State is a Client Side management technique which is used to hold values even after the postback. It is mainly used for storing temporary data like small calculations, final results etc. It is a page level state management which means it holds value only for the current page where you have added the view state code. We cannot used this technique to store values across webpages.

View State values are stored in the generated HTML hidden field. View State is enabled by default is every ASP.NET page.

Lets take the same example which we have used in "Chapter 7: Why HTTP protocol is called stateless protocol?"

Design

 Code Behind

using System;

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

namespace httpstateless
{
    public partial class ViewState : System.Web.UI.Page    {
        string name, blog;
        protected void Page_Load(object sender, EventArgs e)
        {

        }

        protected void Button1_Click(object sender, EventArgs e)
        {
            name = TextBox1.Text;
            blog = TextBox2.Text;
            TextBox1.Text = "";
            TextBox2.Text = "";
            ViewState["name"] = name;
            ViewState["blog"] = blog;
           
        }

        protected void Button2_Click(object sender, EventArgs e)
        {
            TextBox1.Text = Convert.ToString(ViewState["name"]);
            TextBox2.Text = Convert.ToString(ViewState["blog"]);
        }
    }
}

Output

Before clicking save:

 

After Clicking save:

After Restore:

If you right click the page and then select view page source you can find an input field which has type="hidden". This is automatically created. All viewstate values are stored here in encrypted format.

Points to remember

• View State is a page level state management technique.
• It can hold any type of data.
• It is stored in the hidden field.
• It is mainly used to store temporary data.
• It is not used to store large data.

Managing State

In previous post i told you about the stateless nature of HTTP protocol. So in order to store a value we need a mechanism which will hold a value even after a button click or a page request.That mechanism should also allow us to access these values later. We have different types of state management techniques these are:

 Client Side Technique

• View State
• Cookies
• Query String
• Hidden Field
• Control State 

Server Side Technique

• Session State
• Application State

These all will be explained in detail in upcoming post.