ASP.NET tree view with checkbox work as a radio button.
You can find several example where treeview checkbox work as a radio button.In most of the examples have a common problem.As long as there is no checkbox in the page except the checkbox in the treeview, they work fine,but if you have another checkbox or another treeview which contains checkbox,then the problem arises.When click on the treeview checkbox,they(that function) uncheck all of the checkboxs in the page which is not desire.The following function overcomes that problem.
Step 1.
Create a ASP treeview in the HTML & Bind it to your datasource
<asp:TreeView ID="mnuLocationFilter" NodeStyle-CssClass="treeview" runat="server"
ShowCheckBoxes="All" DataSourceID="XmlDsMnuLocationFilter">
<HoverNodeStyle CssClass="treeview" />
<NodeStyle CssClass="treeview" />
<DataBindings>
<asp:TreeNodeBinding SelectAction="None" PopulateOnDemand="true" Value="ID" ValueField="ID"
TextField="Name"></asp:TreeNodeBinding>
</DataBindings>
</asp:TreeView>
Step 2.
Copy the following function in the javascript portion of the HTML Page
function client_OnTreeNodeChecked_ucSelectSeason(event,treeName)
{
var TreeNode =event.srcElement event.target ;
var src = window.event != window.undefined ? window.event.srcElement : evt.target;
if (TreeNode.tagName == "INPUT" && TreeNode.type == "checkbox")
{
if(TreeNode.checked)
{
uncheckOthers_ucSelectSeason(TreeNode.id,src,treeName);
}
}
}
function uncheckOthers_ucSelectSeason(id,src,treeName)
{
var elements = document.getElementsByTagName('input');
// loop through all input elements in form
for(var i = 0; i < elements.length; i++) { if(elements.item(i).type == "checkbox") { if(elements.item(i).id!=id) { if(elements.item(i).id.indexOf(treeName)>0)
{
elements.item(i).checked=false;
}
}
}
}
}
Step 3.
In the pageload event of the codebehind write the following code
Treeview1.Attributes.Add("OnClick", "client_OnTreeNodeChecked_ucSelectSeason(event,'Treeview1')");
Search This Blog
Subscribe to:
Post Comments (Atom)
No comments:
Post a Comment