Skip to main content

Create nested checkboxes in asp.net.

This tutorial will show you how to display data in CheckBoxList in nested format using Repeater control .NET. CheckBoxList Control Nested within my Repeater Control. I needed to get the checked values of the items in each iteration of the Repeater Control. The checkboxlist was located in the ItemTemplate in the Repeater Control. In the each Iteration set the javascript function on the click on the Chekbox in the Repeater1_ItemDataBound control

HTML

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">

    <script language="javascript" type="text/javascript">   
function Check(Ch,Chl)   
{
    var chkList2=document.getElementById(Chl);
    var checkbox2 = chkList2.getElementsByTagName("input");
    for (var i=0;i
    {
        if (document.getElementById(Ch).checked)
            checkbox2[i].checked=true;
        else
            checkbox2[i].checked=false;
    }
}

    </script>

</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:Repeater ID="Repeater1" runat="server" OnItemDataBound="Repeater1_ItemDataBound">
            <ItemTemplate>
                <div style="font-family: Arial Verdana; size: 10px;">
                    <b>
                        <asp:CheckBox ID="CheckBox1" runat="server" Text='<%#DataBinder.Eval(Container.DataItem, "Name")%>' />
                    </b>
                    <asp:HiddenField ID="HiddenField1" runat="server" Value='<%# Eval("ID") %>' />
                    <ul style="font-family: Arial Verdana; size: 8px;">
                        <asp:CheckBoxList ID="CheckBoxList1" runat="server">
                            <asp:ListItem>Checkbox 1</asp:ListItem>
                            <asp:ListItem>Checkbox 2</asp:ListItem>
                            <asp:ListItem>Checkbox 3</asp:ListItem>
                        </asp:CheckBoxList>
                    </ul>
                </div>
            </ItemTemplate>
            <SeparatorTemplate>
                <hr />
            </SeparatorTemplate>
        </asp:Repeater>
    </div>
    </form>
</body>
</html>

Code

        protected void Page_Load(object sender, EventArgs e)
        {
            this.BindRepeater();
        }

        private void BindRepeater()
        {
            DataSet _Objds = new DataSet();
            _Objds.Tables.Add("ds");
            _Objds.Tables[0].Columns.Add("ID");
            _Objds.Tables[0].Columns.Add("Name");


            for (int i = 1; i < 5; i++)
            {
                DataRow dr = (DataRow)_Objds.Tables[0].NewRow();
                dr["ID"] = i.ToString();
                dr["Name"] = "checkbox_" + i.ToString();
                _Objds.Tables[0].Rows.Add(dr);
            }
            Repeater1.DataSource = _Objds.Tables[0];
            Repeater1.DataBind();
        }
        public void Repeater1_ItemDataBound(Object Sender, RepeaterItemEventArgs e)
        {
            if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
            {
                CheckBox Ch = (CheckBox)e.Item.FindControl("CheckBox1");
                CheckBoxList Chl = (CheckBoxList)e.Item.FindControl("CheckBoxList1");
                Ch.Attributes.Add("OnClick", "Javascript:Check('" + Ch.ClientID + "','" + Chl.ClientID + "')");
            }
        }

Labels:

Comments

Post a Comment

Popular posts from this blog

Connected and disconnected architecture in ADO.Net with Example

Connected Architecture of ADO.NET The architecture of ADO.net, in which connection must be opened to access the data retrieved from database is called as connected architecture. Connected architecture was built on the classes connection, command, datareader and transaction.  Connected architecture is when you constantly make trips to the database for any CRUD (Create, Read, Update and Delete) operation you wish to do. This creates more traffic to the database but is normally much faster as you should be doing smaller transactions. Disconnected Architecture in ADO.NET The architecture of ADO.net in which data retrieved from database can be accessed even when connection to database was closed is called as disconnected architecture. Disconnected architecture of ADO.net was built on classes connection, dataadapter, commandbuilder and dataset and dataview. Disconnected architecture is a method of retrieving a r...
37 comments
Read more

ASP.Net AJAX Interview Questions

What is Ajax? Ajax means " Asynchronous Javascript and XM L". Ajax represents a set of commonly used techniques, like HTML/XHTML, CSS, Document Object Model(DOM), XML/XSLT, Javascript and the XMLHttpRequest object, to create RIA's (Rich Internet Applications). ASP.NET AJAX update only a specified portion of data without refreshing the entire page. The ASP.NET AJAX works with the AJAX Library that uses object-oriented programming (OOP) to develop rich Web applications that communicate with the server using asynchronous postback. What are the different controls of ASP.NET AJAX? ASP.NET AJAX includes the following controls: ScriptManager ScriptManagerProxy UpdatePanel UpdateProgress Timer Describe the technology that makes up AJAX?   AJAX is based on the following web standards: XMLHttpRequest Object JavaScript HTML/DHTML DOM XML CSS What role does the ScriptManager play?   The ScriptManager manages all ASP.Net AJAX resour...
2 comments
Read more

HTTPHandler and HTTPModule in ASP.NET

If you want to implement pre-processing logic before a request hits the IIS resources. For instance you would like to apply security mechanism, URL rewriting, filter something in the request, etc. ASP.NET has provided two types of interception HttpModule and HttpHandler .   The web server examines the file name extension of the requested file, and determines which ISAPI extension should handle the request. Then the request is passed to the appropriate ISAPI extension.  For Example When an .aspx page is requested it is passed to ASP.Net page handler. Then Application domain is created and after that different ASP.Net objects like Httpcontext, HttpRequest, HttpResponse. HTTPModule: -    It's just like a filter. The Modules are called before and after the handler executes . -    HTTP Modules are objects which also participate the pipeline but they work before and after the HTTP Handler does its job, and produce additional serv...
124 comments
Read more