Hi,
I am trying to achive the below behaviour in RadTreeView at client side.
When uncheck the select All1, all the child nodes should collapse upto First Level which is "Contract1 and Contract2" in my case but presently it is collapsing upto root level "Select All 1" which is incorrect.
For your covenience, I have attached the snap shot and the piece of working code, please have a look and help me to find out the way to achieve this required behaviour.
PFA - radreeview_desiredbehaviour.png
I am trying to achive the below behaviour in RadTreeView at client side.
When uncheck the select All1, all the child nodes should collapse upto First Level which is "Contract1 and Contract2" in my case but presently it is collapsing upto root level "Select All 1" which is incorrect.
For your covenience, I have attached the snap shot and the piece of working code, please have a look and help me to find out the way to achieve this required behaviour.
PFA - radreeview_desiredbehaviour.png
Hrml and Javascript Markup -
<
script
type
=
"text/javascript"
>
function OnClientNodeClicked(sender, eventArgs) {
var tree = $find("<%=RadTreeView1.ClientID %>");
var currentNode = eventArgs.get_node();
var currentNodeText = currentNode.get_textElement().innerHTML;
var allNodes = currentNode.get_allNodes();
var allNodesCount = allNodes.length;
if (currentNode.get_checked())
{
for (var i = 0; i <
allNodes.length
; i++)
{
allNodes[i].set_checked(true);
currentNode.set_checked(true);
allNodes[i].expand();
currentNode.expand()
}
}
else if (!currentNode.get_checked())
{
if (currentNodeText == "Select All 1")
{
for (var
i
=
0
; i < allNodesCount; i++)
{
if (allNodes[i].get_level() == 1)
{
allNodes[i].expand();
currentNode.expand()
}
else
{
allNodes[i].set_checked(false);
currentNode.set_checked(false);
allNodes[i].collapse();
currentNode.collapse();
}
}
}
}
else
{
for (var
i
=
0
; i < allNodes.length; i++) {
allNodes[i].set_checked(true);
currentNode.set_checked(true);
}
}
}
</script>
<
telerik:RadTreeView
ID
=
"RadTreeView1"
runat
=
"server"
EnableEmbeddedBaseStylesheet
=
"false"
EnableEmbeddedSkins
=
"false"
CheckBoxes
=
"true"
OnClientNodeChecked
=
"OnClientNodeClicked"
>
</
telerik:RadTreeView
>
Server Side Code -
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
RenderNodes();
}
}
protected void RenderNodes()
{
List<
Contract
> contracts = GetData();
RadTreeNode selectAllContracts = new RadTreeNode("Select All 1");
RadTreeView1.Nodes.Add(selectAllContracts);
foreach (Contract contract in contracts)
{
RadTreeNode contracNode = new RadTreeNode(contract.Text);
AddPlanNode(contract, contracNode);
selectAllContracts.Nodes.Add(contracNode);
}
RadTreeView1.ExpandAllNodes();
RadTreeView1.CheckAllNodes();
}
private static void AddPlanNode(Contract contract, RadTreeNode contracNode)
{
RadTreeNode selectAllPlans = new RadTreeNode("Select All 2");
contracNode.Nodes.Add(selectAllPlans);
foreach (Plan plan in contract.Plans)
{
RadTreeNode planNode = new RadTreeNode(plan.Text);
selectAllPlans.Nodes.Add(planNode);
AddAdapterNode(plan, planNode);
}
}
private static void AddAdapterNode(Plan plan, RadTreeNode planNode)
{
RadTreeNode selectAllAdapters = new RadTreeNode("Select All 3");
planNode.Nodes.Add(selectAllAdapters);
foreach (Adapter adapter in plan.Adapters)
{
RadTreeNode adapterNode = new RadTreeNode(adapter.Text);
selectAllAdapters.Nodes.Add(adapterNode);
}
}
#region Dummy Data
private List<
Contract
> GetData()
{
Plan plan1 = new Plan { Text = "Plan1", Adapters = new List<
Adapter
> { new Adapter { Text = "Adapter1-1" }, new Adapter { Text = "Adapter1-2" } } };
Plan plan2 = new Plan { Text = "Plan2", Adapters = new List<
Adapter
> { new Adapter { Text = "Adapter2-1" }, new Adapter { Text = "Adapter2-2" } } };
Contract contract1 = new Contract { Text = "Contract1", Plans = new List<
Plan
> { plan1, plan2 } };
Plan plan3 = new Plan { Text = "Plan3", Adapters = new List<
Adapter
> { new Adapter { Text = "Adapter3-1" }, new Adapter { Text = "Adapter3-2" } } };
Plan plan4 = new Plan { Text = "Plan4", Adapters = new List<
Adapter
> { new Adapter { Text = "Adapter4-1" }, new Adapter { Text = "Adapter4-2" } } };
Contract contract2 = new Contract { Text = "Contract2", Plans = new List<
Plan
> { plan3, plan4 } };
List<
Contract
> contracts = new List<
Contract
> { contract1, contract2 };
return contracts;
}
public class Contract
{
public string Text { get; set; }
public List<
Plan
> Plans { get; set; }
}
public class Plan
{
public string Text { get; set; }
public List<
Adapter
> Adapters { get; set; }
}
public class Adapter
{
public string Text { get; set; }
}
#endregion
}