Perserve/Retain state for dynamically created ASP.Net Dynamic Controls ViewState on PostBack

Category > ASP.NET || Published on : Thursday, January 18, 2018 || Views: 10600 || Retain state for dynamically created controls on PostBack dynamically created controls PostBack

Introduction

Here Pawan Kumar will explain how to Perserve/Retain state for dynamically created ASP.Net Dynamic Controls ViewState on PostBack

Description

In previous post I have explained How To Export HTML Table To Excel Using jQuery Plugin, How to Display Decimal Numbers As Money using Transact-SQL, How to Access Data From Ordered Dictionary using C#, How to use Regular Expression (Regex) to accept only Alphanumeric (Alphabets and Numbers) in TextBox in ASP.Net using RegularExpression Validator, Set or Display Watermark Text for ASP.Net TextBox, Password and MultiLine TextArea using jQuery in ASP.Net with demo and Example codes, Create Login Page In ASP.NET Web Application Using ASP.Net, C# And SQL Server, and many more articles.

Now I will explain How to Perserve/Retain state for dynamically created ASP.Net Dynamic Controls ViewState on PostBack

So follow the steps to learn Perserve/Retain state for dynamically created ASP.Net Dynamic Controls ViewState on PostBack

Dynamically created controls are lost on PostBack and hence we need to recreate the dynamic controls in the PreInit event of the page.

Create a website and a new aspx webpage and add the below codes in aspx page.

<asp:Panel ID="pnlTextBoxes" runat="server">
</asp:Panel>
<hr />
<asp:Button ID="btnAdd" runat="server" Text="Add New" OnClick="AddTextBox" />
<asp:Button ID="btnGet" runat="server" Text="Get Values" OnClick="GetTextBoxValues" />

Complete HTML ASPSX Markup:-

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="cs-code.aspx.cs" Inherits="cs_code" %>
 
<!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></title>
    <style type="text/css">
        body {
            font-family: Arial;
            font-size: 10pt;
        }
 
        input[type=text] {
            margin-bottom: 10pt;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
        <asp:Panel ID="pnlTextBoxes" runat="server">
        </asp:Panel>
        <hr />
        <asp:Button ID="btnAdd" runat="server" Text="Add New" OnClick="AddTextBox" />
        <asp:Button ID="btnGet" runat="server" Text="Get Values" OnClick="GetTextBoxValues" />
    </form>
</body>
</html>

and now write the below codes in code behind of the page to retaining the dynamic TextBoxes on PostBack

protected void Page_PreInit(object sender, EventArgs e)
    {
        List<string> keys = Request.Form.AllKeys.Where(key => key.Contains("txtDynamic")).ToList();
        int i = 1;
        foreach (string key in keys)
        {
            this.CreateTextBox("txtDynamic" + i);
            i++;
        }
    }

Dynamically creating and adding TextBoxes on Button Click

protected void AddTextBox(object sender, EventArgs e)
{
    int index = pnlTextBoxes.Controls.OfType<TextBox>().ToList().Count + 1;
    this.CreateTextBox("txtDynamic" + index);
}
 
private void CreateTextBox(string id)
{
    TextBox txt = new TextBox();
    txt.ID = id;
    pnlTextBoxes.Controls.Add(txt);
 
    Literal lt = new Literal();
    lt.Text = "<br />";
    pnlTextBoxes.Controls.Add(lt);
}

Getting values of dynamically created TextBoxes

protected void GetTextBoxValues(object sender, EventArgs e)
{
    string message = "";
    foreach (TextBox textBox in pnlTextBoxes.Controls.OfType<TextBox>())
    {
        message += textBox.ID + ": " + textBox.Text + "\\n";
    }
    ClientScript.RegisterClientScriptBlock(this.GetType(), "alert", "alert('" + message + "');", true);
}

Complete Code Behind Source Codes:-

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
 
public partial class cs_code : System.Web.UI.Page
{
    protected void Page_PreInit(object sender, EventArgs e)
    {
        List<string> keys = Request.Form.AllKeys.Where(key => key.Contains("txtDynamic")).ToList();
        int i = 1;
        foreach (string key in keys)
        {
            this.CreateTextBox("txtDynamic" + i);
            i++;
        }
    }
 
    protected void AddTextBox(object sender, EventArgs e)
    {
        int index = pnlTextBoxes.Controls.OfType<TextBox>().ToList().Count + 1;
        this.CreateTextBox("txtDynamic" + index);
    }
 
    private void CreateTextBox(string id)
    {
        TextBox txt = new TextBox();
        txt.ID = id;
        pnlTextBoxes.Controls.Add(txt);
 
        Literal lt = new Literal();
        lt.Text = "<br />";
        pnlTextBoxes.Controls.Add(lt);
    }
 
    protected void GetTextBoxValues(object sender, EventArgs e)
    {
        string message = "";
        foreach (TextBox textBox in pnlTextBoxes.Controls.OfType<TextBox>())
        {
            message += textBox.ID + ": " + textBox.Text + "\\n";
        }
        ClientScript.RegisterClientScriptBlock(this.GetType(), "alert", "alert('" + message + "');", true);
    }
 
}

how to use ViewState with dynamic controls i.e. Retain / maintain / preserve State (values) of dynamically created controls on PostBack in ASP.Net.

Conclusion:

So, In this tutorial we have learned, Perserve/Retain state for dynamically created ASP.Net Dynamic Controls ViewState on PostBack

.Net Articles/Snippets

Web Development Articles/Snippets

Database Articles/Snippets

Languages Articles/Snippets

Mobile Development Articles/Snippets

Others Articles/Snippets

Perserve/Retain state for dynamically created ASP.Net Dynamic Controls ViewState on PostBack

Introduction

Description

Conclusion:

You might also like