I have a datatree with many nodes and child nodes. I use check boxes in a template. I have it set so that when you click on a node it expands and collapses. However when there is a child node that is checked I want to cancel the collapse method...
Can you help with this?
Hi Daryl007,
You can use something similar to this function for NodeCollapsing client-side event:
function WebDataTree1_NodeCollapsing(sender, eventArgs)
{
var node = eventArgs.getNode();
var childrenCount = node.get_childrenCount();
for (var i = 0; i < childrenCount; i++) {
if (node.get_childNode(i).get_checkState() == 1) {
eventArgs.set_cancel(true);
}
Let me know if this helps.
Okay i have some more info..
I am using this:
<script type="text/javascript" language="javascript"> function wdtGeneral_NodeCollapsing(sender, e) { //Gets the node object that is collapsing var node = e.getNode(); var childrenCount = node.get_childrenCount(); alert('nodes ' + childrenCount) for (var i = 0; i < childrenCount; i++) { alert(i) alert(node.get_childNode(i).get_checkState()) if (node.get_childNode(i).get_checkState() == 1) { e.set_cancel(true); } } } </script>the first alert gives me the childnode count.second alert always give me a 0 as does the third alert..could this because I am using a checkbox template in each node?
<Nodes> <ig:DataTreeNode Draggable="False" Droppable="False" Editable="Off" TemplateId="chkOne" Key="chkOne" Value="chkOne" CssClass="options" > <Template> <asp:CheckBox ID="chkOne" Text="This is check one" runat="server" CssClass="options" TabIndex="1" /> </Template> </ig:DataTreeNode>
apparently, If I click on a child node it works, but if I click on a parent node it bombs.
Hello Daryl,
Here is the modified function which should work for all level nodes:
function WebDataTree1_NodeCollapsing(sender, eventArgs) { var currentNode = eventArgs.getNode(); var a = 0; for (var i = 0; i < $(currentNode.get_element()).find('[type=checkbox]').length; i++) { if ($(currentNode.get_element()).find('[type=checkbox]')[i].checked) { eventArgs.set_cancel(true); } }}
well, that is not quite working either..
On this line..
i < $(currentNode.get_element()).find('[type=checkbox]').length; I get an "jscript error -- error object expected"
Hi Daryl,
Please attach your sample in order to be able to investigate this further. Thank you.
<script type= "text/javascript" language= "javascript"> function wdtGeneral_NodeCollapsing(sender, eventArgs) { var currentNode = eventArgs.getNode(); var a = 0; for (var i = 0; i < $(currentNode.get_element()).find('[type=checkbox]').length; i++) { if ($(currentNode.get_element()).find('[type=checkbox]')[i].checked) { eventArgs.set_cancel(true); } } } </script>
<ig:WebTab ID="wtEvalOptions" runat="server" Height="538px" Width="100%" BorderColor="Black" BorderStyle="Solid" BorderWidth="1px" EnableTheming="False" StyleSetName="Default" Font-Bold="False"> <Tabs> <ig:ContentTabItem runat="server" Key="General" Text="General" Font-Names="Calibri" Font-Size="12pt"> <Template> <ig:WebDataTree ID="wdtGeneral" runat="server" EnableConnectorLines="True" EnableExpandImages="False" EnableExpandOnClick="True" Height="300px" SelectionType="Multiple" StyleSetName="Default" Width="90%" EnableTheming="False" CssClass="options"> <DragDropSettings EnableDropInsertion="False" EnableExpandOnDrop="False"> </DragDropSettings> <Nodes> <ig:DataTreeNode Draggable="False" Droppable="False" Editable="Off" TemplateId="chkCoEvaluate" Key="chkCoEvaluate" Value="chkCoEvaluate" CssClass="options" > <Template> <asp:CheckBox ID="chkCoEvaluate" Text="The CO is evaluating" runat="server" CssClass="options" TabIndex="1" /> </Template> </ig:DataTreeNode> <ig:DataTreeNode TemplateId="chkTeams" Key="chkTeams" Value="chkTeams"> <Template> <asp:CheckBox ID="chkTeams" Text="Teams are used in this evaluation" runat="server" CssClass="options" TabIndex="2" /> </Template> <Nodes> <ig:DataTreeNode TemplateId="chkTeamLeaders" Key="chkTeamLeaders" Value="chkTeamLeaders"> <Template> <asp:CheckBox ID="chkTeamLeaders" Text="Team leaders are evaluating" runat="server" CssClass="options" TabIndex="3" /> </Template> </ig:DataTreeNode> </Nodes> </ig:DataTreeNode> <ig:DataTreeNode TemplateId="chkMessage" Key="chkMessage" Value="chkMessage"> <Template> <asp:CheckBox ID="chkMessage" Text="Messaging is enabled" runat="server" CssClass="options" TabIndex="4" /> </Template> <Nodes> <ig:DataTreeNode TemplateId="chkTimerInterval" Key="chkTimerInterval" Value="chkTimerInterval"> <Template> <table> <tr> <td valign="middle"> <asp:CheckBox ID="chkTimerInterval" Text="interval to check for new messages" runat="server" CssClass="options" TabIndex="5" /> <asp:RadioButtonList ID="optTimerInterval" runat="server" RepeatDirection="Horizontal" RepeatLayout="Flow" CssClass="options" TabIndex="6" EnableTheming="False"> <asp:ListItem Text="3" Value="3">3 Min </asp:ListItem> <asp:ListItem Value="5">5 Min </asp:ListItem> <asp:ListItem Value="10">10 Min </asp:ListItem> <asp:ListItem Value="15">15 Min </asp:ListItem> </asp:RadioButtonList> </td> </tr> </table> </Template> </ig:DataTreeNode> </Nodes> </ig:DataTreeNode> <ig:DataTreeNode TemplateId="chkAdvisor" Key="chkAdvisor" Value="chkAdvisor"> <Template> <asp:CheckBox ID="chkAdvisor" Text="Advisors are used in this evaluation" runat="server" CssClass="options" /> </Template> <Nodes> <ig:DataTreeNode TemplateId="chkAdvView" Key="chkAdvView" Value="chkAdvView"> <Template> <asp:CheckBox ID="chkAdvView" Text="Advisors view other Advisors comments" runat="server" CssClass="options" /> </Template> </ig:DataTreeNode> <ig:DataTreeNode TemplateId="chkAdvViewEval" Key="chkAdvViewEval" Value="chkAdvViewEval"> <Template> <asp:CheckBox ID="chkAdvViewEval" Text="Add view Evaluator comments" runat="server" CssClass="options" /> </Template> </ig:DataTreeNode> <ig:DataTreeNode TemplateId="chkAdvEval" Key="chkAdvEval" Value="chkAdvEval"> <Template> <asp:CheckBox ID="chkAdvEval" Text="Advisor comments move to consensus" runat="server" CssClass="options" /> </Template> </ig:DataTreeNode> <ig:DataTreeNode TemplateId="chkAdvRate" Key="chkAdvRate" Value="chkAdvRate"> <Template> <asp:CheckBox ID="chkAdvRate" Text="Advisors assign a rating" runat="server" CssClass="options" /> </Template> <Nodes> <ig:DataTreeNode TemplateId="chkAdvRateShow" Key="chkAdvRateShow" Value="chkAdvRateShow"> <Template> <asp:CheckBox ID="chkAdvRateShow" Text="Show Advisor ratings" runat="server" CssClass="options" /> </Template> </ig:DataTreeNode> </Nodes> </ig:DataTreeNode> </Nodes> </ig:DataTreeNode> <ig:DataTreeNode TemplateId="chkCommentRef" Key="chkCommentRef" Value="chkCommentRef"> <Template> <asp:CheckBox ID="chkCommentRef" Text="Evaluator comments must reference proposal" runat="server" CssClass="options" /> </Template> </ig:DataTreeNode> <ig:DataTreeNode TemplateId="chkRndCons" Key="chkRndCons" Value="chkRndCons"> <Template> <asp:CheckBox ID="chkRndCons" Text="Show previous rounds comments in Consensus Module" runat="server" CssClass="options" /> </Template> </ig:DataTreeNode> </Nodes> <ClientEvents NodeCollapsing="wdtGeneral_NodeCollapsing" /> </ig:WebDataTree> </Template> </ig:ContentTabItem> <ig:ContentTabItem runat="server" Key="Factors" Text="Factors" Font-Names="Calibri" Font-Size="12pt"> <Template> <br /> <ig:WebDataTree ID="wdtFactors" runat="server" EnableConnectorLines="True" EnableExpandImages="False" EnableExpandOnClick="True" Font-Size="10pt" Height="300px" SelectionType="Multiple" StyleSetName="Default" Width="90%" EnableAutoChecking="False" EnableTheming="False" ForeColor="Black" CssClass="options"> <Nodes> <ig:DataTreeNode Draggable="False" Droppable="False" Editable="Off" TemplateId="chkSubFactor" Key="chkSubFactor" Value="chkSubFactor"> <Template> <asp:CheckBox ID="chkSubFactor" Text="SubFactors are used in this evaluation" runat="server" CssClass="options" TabIndex="7"/> </Template> <Nodes> <ig:DataTreeNode TemplateId="chkSubFactorRate" Key="chkSubFactorRate" Value="chkSubFactorRate"> <Template> <asp:CheckBox ID="chkSubFactorRate" Text="SubFactors are evaludated and assigned a rating" runat="server" CssClass="options" TabIndex="8" /> </Template> <Nodes> <ig:DataTreeNode TemplateId="chkGroup" Key="chkGroup" Value="chkGroup"> <Template> <asp:CheckBox ID="chkGroup" Text="Groups are used in this evaluation" runat="server" CssClass="options" TabIndex="9" /> </Template> <Nodes> <ig:DataTreeNode TemplateId="chkGroupReq" Text="chkGroupReq" Value="chkGroupReq"> <Template> <asp:CheckBox ID="chkGroupReq" Text="Groups are required" runat="server" CssClass="options" TabIndex="10" /> </Template> </ig:DataTreeNode> </Nodes> </ig:DataTreeNode> </Nodes> </ig:DataTreeNode> </Nodes> </ig:DataTreeNode> <ig:DataTreeNode Draggable="False" Droppable="False" Editable="Off" TemplateId="chkRisk" Key="chkRisk" Value="chkRisk"> <Template> <asp:CheckBox ID="chkRisk" Text="Risk is evaluated separately" runat="server" CssClass="options" TabIndex="11" /> </Template> </ig:DataTreeNode> </Nodes> <ClientEvents NodeCollapsing="wdtGeneral_NodeCollapsing" /> </ig:WebDataTree> </Template> </ig:ContentTabItem> <ig:ContentTabItem runat="server" Key="PastPerformance" Text="Past Performance" Font-Names="Calibri" Font-Size="12pt"> <Template> <ig:WebDataTree ID="wdtPastPerformance" runat="server" EnableConnectorLines="True" EnableExpandImages="False" EnableExpandOnClick="True" Height="300px" SelectionType="Multiple" StyleSetName="Default" Width="90%" EnableAutoChecking="False" EnableTheming="False" CssClass="options"> <Nodes> <ig:DataTreeNode Draggable="False" Droppable="False" Editable="Off" TemplateId="chkPastPerf" Key="chkPastPerf" Value="chkPastPerf"> <Template> <asp:CheckBox ID="chkPastPerf" Text="Past Performance is evaluated." runat="server" CssClass="options" TabIndex="12" /> </Template> <Nodes> <ig:DataTreeNode TemplateId="chkPastPerfRate" Key="chkPastPerfRate" Value="chkPastPerfRate"> <Template> <asp:CheckBox ID="chkPastPerfRate" Text="Overall past performance is assigned a rating." runat="server" CssClass="options" TabIndex="13" /> </Template> </ig:DataTreeNode> <ig:DataTreeNode TemplateId="chkAreaEval" Key="chkAreaEval" Value="chkAreaEval"> <Template> <asp:CheckBox ID="chkAreaEval" Text="Past Performance Areas (e.g. Recency, Relevancy, Quality) are evaluated." runat="server" CssClass="options" TabIndex="14" /> </Template> <Nodes> <ig:DataTreeNode TemplateId="chkAreaRate" Text="" Value="chkAreaRate"> <Template> <asp:CheckBox ID="chkAreaRate" Text="Past Performance Areas are assigned a rating." runat="server" CssClass="options" TabIndex="15" /> </Template> </ig:DataTreeNode> </Nodes> </ig:DataTreeNode> </Nodes> </ig:DataTreeNode> </Nodes> <ClientEvents NodeCollapsing="wdtGeneral_NodeCollapsing" /> </ig:WebDataTree> </Template> </ig:ContentTabItem> <ig:ContentTabItem runat="server" Key="Reports" Text="Reports" Font-Names="Calibri" Font-Size="12pt"> <Template> <br /> <table width="100%"> <tr> <td align="center" valign="middle"> <asp:Label ID="Label1" runat="server" Text="Note: Changes made here will affect all Reports" Height="0.2188in" Width="3.8854in" BorderColor="Black" Font-Names="Lucida Sans" Font-Size="11pt" Font-Bold="True" ForeColor="Maroon" EnableTheming="False"></asp:Label> </td> </tr> </table> <br /> <table width="100%"> <tr> <td> <asp:Label ID="Label2" runat="server" Text="Reports Footer" Font-Names="Lucida Sans" Font-Size="11"></asp:Label> </td> </tr> <tr> <td> <ig:WebTextEditor ID="txtReportFooter" runat="server" Font-Names="Tahoma" Font-Size="12" Height="100px" StyleSetName="Default" Width="95%" BorderColor="#000000" BorderStyle="Solid" BorderWidth="1px" EnableTheming="False" TextMode="MultiLine" TabIndex="16"> </ig:WebTextEditor> </td> </tr> </table> </Template> </ig:ContentTabItem> </Tabs> </ig:WebTab>
Let me know if you still need assistance with the matter.
I could not reproduce this error using the code you have provided. Please make sure you have added a reference to jQuery. In order to be able to investigate this further I would need a complete sample website and the version of the controls you are using. Thank you.