Hi,
I have been trying to add nodes on the client side and its failed.
The treeview is working fine without RadAjaxPanel postback.
Following is my source code to add the nodes in TreeView on the client side.
PS:
- The following code is the sample page that I build to re-create the problem so you can copy and paste directly..
- The TreeView is working fine when you comment out the following line in "SelectNextTab" function
-----------------------
$find('<%= rapMultiPage.ClientID %>').ajaxRequest();
----------------------
Any sample work around will be best.
PS: I need the RadAjaxPanel to refresh the TreeView data when the user click "Next" button.
Thanks.
--------------------------
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="TelerikTest._Default" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<!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>
</head>
<body>
<telerik:RadCodeBlock ID="rcbReport" runat="server">
<script type="text/javascript">
function SelectNextTab(TabIndex, direction) {
var multiPage = $find('<%=rmpCustomReport.ClientID %>');
if (multiPage) {
multiPage.set_selectedIndex(TabIndex);
if (direction == 'Next') {
// Need to refresh the data based on the user's table selection
$find('<%= rapMultiPage.ClientID %>').ajaxRequest();
return false;
}
}
return false;
}
function MoveTo() {
var treeViewSource = $find("<%= rtvFields.ClientID %>");
if (treeViewSource) {
treeViewSource.trackChanges();
var node = new Telerik.Web.UI.RadTreeNode();
node.set_text("New Node");
treeViewSource.get_nodes().add(node);
treeViewSource.commitChanges();
}
return false;
}
</script>
</telerik:RadCodeBlock>
<form id="form1" runat="server">
<div>
<telerik:RadScriptManager ID="RadScriptManager1" runat="server">
</telerik:RadScriptManager>
<telerik:RadAjaxPanel ID="rapMultiPage" runat="server" Width="99%">
<asp:Label ID="lblMessage" runat="server" Font-Bold="True" ForeColor="Red"></asp:Label><br />
<telerik:RadMultiPage id="rmpCustomReport" Runat="server" SelectedIndex="0">
<telerik:RadPageView id="Step1" runat="server">
<table border="0" style="width: 98%">
<tr>
<td>
Step 1 - Select the module to report on</td>
</tr>
</table>
<br />
<table border="0" style="width: 95%">
<tr>
<td style="width: 700px; height: 450px" valign="top">
<asp:CheckBoxList ID="cblModule" runat="server">
</asp:CheckBoxList></td>
</tr>
</table>
<br />
<table style="width: 700px">
<tr>
<td>
</td>
<td align="right">
<asp:Button ID="btnNext1" runat="server" CausesValidation="False" OnClientClick="SelectNextTab(1, 'Next'); return false;"
Text="Next" /></td>
</tr>
</table>
</telerik:RadPageView>
<telerik:RadPageView id="Step3" Runat="server" Width="100%">
<br />
<table style="width: 700px">
<tr>
<td style="width: 345px;" valign="middle">
</td>
<td style="width: 345px" valign="top" >
<asp:Panel ID="pDestinationBasic" runat="server" Height="420px" ScrollBars="Auto" Width="340px" BorderColor="Khaki" BorderStyle="Dotted">
<asp:Button ID="btnAddNode" runat="server" OnClientClick="MoveTo(); return false;"
Text="Add Node" />
<telerik:RadTreeView ID="rtvFields" runat="server" EnableDragAndDrop="True" EnableDragAndDropBetweenNodes="True" Skin="Web20" CausesValidation="False">
<CollapseAnimation Duration="100" Type="OutQuint" />
<ExpandAnimation Duration="100" />
</telerik:RadTreeView>
</asp:Panel>
</td>
</tr>
</table>
<br />
<br />
</telerik:RadPageView>
</telerik:RadMultiPage>
</telerik:RadAjaxPanel>
</div>
</form>
</body>
</html>
------------------------------
2 Answers, 1 is accepted
Rank 1
Telerik Support are in heaven ?
We tested the scenario and confirm this is a bug. We will fix it for the official Q2 release scheduled for the end of the next week. In the meantime you can use the following workaround - add the highlighted line in your javascript code:
| function MoveTo() { |
| var treeViewSource = $find("<%= rtvFields.ClientID %>"); |
| if (treeViewSource) { |
| treeViewSource.trackChanges(); |
| var node = new Telerik.Web.UI.RadTreeNode(); |
| node.set_text("New Node"); |
| treeViewSource._childListElementCssClass = "rtUL rtLines"; |
| treeViewSource.get_nodes().add(node); |
| treeViewSource.commitChanges(); |
| } |
| return false; |
| } |
We updated your Telerik Points for finding this problem.
Greetings,
Veselin Vasilev
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.