Wednesday, March 28, 2012

Trace AJAX webpage

I tried to trace AJAX enabled webpage and got the error:Sys.WebForms.PageRequestManagerParseErrorException. The message received from the server can not be parsed.

Any idea about that?

You can't use trace with Ajax. Trace kind of intercepts the page and reformats it so it can append the trace data. You'll have to try playing around with the debug functions that are part of Ajax Beta 1 and 2...


It should be possible to use tracing with MS AJAX. Just don't use in-page tracing. Set pageOutput to false, and look at the Trace.axd page.

Additional detailshere.


Thank you, muslon. It works.

Trace="True" and partial postbacks

When a page is set to Trace="True", partial postback fail with an error stating that there is a problem parsing the page and the reason could be because Trace is set to True. OK, so how are we supposed to trace our pages then?

You can use Tracing but you can't use the pageouput option (so that the trace gets displayed on your webpage). That's causing the error. What you can do is set the page output to false.

<traceenabled="true"pageOutput="false"/>

If you want to view the tracelog, you can view it usingtrace.axd(http://somewebsite/trace.axd)

Track ajax application with google analytics

Hi everyone,

I have an ecommerce application where i use ajax in createUserWizard and in Chart.
To track user activity i use google analytics urchinTracker function.
With ajax a request to the server is made without changing the url of the page, so i have to call urchinTracker function with onreadystatechange.
http://www.google.com/support/analytics/bin/answer.py?answer=33985&topic=7292

The problem is how can i use this code. How i can insert it inside my page.

I have the urchinTracker function in my masterpage:
<scripttype="text/javascript">
_uacct ="UA-XXXXXXXX;
urchinTracker();
</script>

In my content page i have a MultiView control inside the UpdatePanel.
When i skip the step inside the multiView i need to call the urchinTracker function to assign a page filename for the tracking.
How can i do that?

This solution don't work:

ProtectedSub Page_PreRender(ByVal senderAsObject,ByVal eAs System.EventArgs)HandlesMe.PreRender

If mvCreaUtente.ActiveViewIndex = 0Then
Dim sbAsNew System.Text.StringBuilder
sb.Append("<script>")
sb.Append("urchinTracker('/registrazione/step1.html')")
sb.Append("</")
sb.Append("script>")
Me.Page.RegisterClientScriptBlock("ScriptUrlTracking", sb.ToString)
EndIf

End Sub

Thanks

You should set it up in javascript. Tie the endRequest event of the PageRequestManager to a function that will call the urchin tracker function.


Thanks Paul for your reply. Could you please write a simple example of this javascipt code?

Thx


Be happy to. Something like this:

function handleUrchin(ev){ urchinTracker('/registrazione/step1.html');}function pageLoad(){ var prm = Sys.WebForms.PageRequestManager.getInstance(); prm.add_endRequest(handleUrchin);}
Obviously that's pretty simple, and you could add a switch statement or something if you have more than one type of urchin request to do.

Thanks Paul, your reply help me!Wink

Tracking Link Clicks

Hi,

I posted this before in the "Web Forms" section, but I was just thinking what I might need is an AJAXian solution.

I'm trying to figure out the best way to track user clicks on links. I could easily do this by making all the links LinkButton's and just use the PostBackUrl property or response.redirect or something like that to send the user on to the page they clicked to.

However, this is not a very good solution because spiders would be unable to crawl these links and I need to have the option of opening the pages from the links in a new browser window at times.

So basically if the HyperLink control had an "OnClick" property that fired before doing the default thing (ie following the link), that would be ideal, but it does not.

So I was just wondering if anyone had any good ideas on how to create a "link" control that would allow search engines to crawl the links, allow me to at times open the linked page into a new browser window (ie target=_blank), and also to record the user clicks into a database?

Would there be a way to use the javascript onclick event to fire some function that calls a service or something on the server to update my database with the click information? If so how would I do that?

Hi,

I just replied in your other thread. Though now I've seen you mention AJAX this would allow you to accomplish a lot more.

Cheers,

Al

Tranfering items between Listboxes in an upadated Panel

hi,

i have a page in which there are 2 listboxes. I have also taken 2 buttons (HTML)... Buttons are used to transfer items between Listboxes...

Its working fine and items are transfered between Listboxes...

when i want to put an updated panel and in the <content template>, i put listboxes its not working.....

any anybody has an idea??

Regards,

Suryansu

Would you show us your source code for the page please?


What do you mean by "not working", can you give a sample and a bit more explanation?

If you are having problems with your UpdatePanel specifically, check out:http://blogs.visoftinc.com/archive/2007/09/23/asp.net-ajax--updatepanel-not-working--common-problems.aspx

-Damien


suppose i select one value from drop downbox...As per the value the LIstbox1 is changed and from listbox1 , i will select some items and add to the listbox2...again suppose i select another item from dropdownbox...as per the value in the dropdownbox, the listbox1 items changed...but i want the items in selected in LISTBOX2 should be retained..next time when i select some items from listbox1 to listbox2 , it should be added to the listbox2......

So i thought to use updated panel and so i put DROPDOWNBOX and LISTBOX in the updated panel...so Items in the LISTBOX2 willnot refreshed again and again...items will be only added......

ProtectedSub Page_Load(ByVal senderAsObject,ByVal eAs System.EventArgs)HandlesMe.Load

ListBox2.EnableViewState =True

IfNot IsPostBackThen

Button2.Attributes.Add("onClick","javascript:testme();")

EndIf

ProtectedSub DropDownList1_SelectedIndexChanged(ByVal senderAsObject,ByVal eAs System.EventArgs)Handles DropDownList1.SelectedIndexChanged

Dim varSelectedDDlistAsString

varSelectedDDlist = DropDownList1.SelectedValue

Dim strQueryAsString ="select attribute_value,attribute_display_name from tblattribute_displayname"

ds = objTest.BindData(strQuery)

ListBox1.Items.Clear()

' ||||| Set the DataValueField to the Primary Key

ListBox1.DataValueField ="attribute_value"

' ||||| Set the DataTextField to the text/data you want to display

ListBox1.DataTextField ="attribute_display_name"

' ||||| Set the DataSource the the OleDBDataReader's result

ListBox1.DataSource = ds

ListBox1.DataBind()

EndSub

<%@.PageLanguage="VB"AutoEventWireup="false"CodeFile="Default8.aspx.vb"Inherits="Default8"EnableEventValidation="false" %>

<!DOCTYPEhtmlPUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <htmlxmlns="http://www.w3.org/1999/xhtml">

<headid="Head1"runat="server">

<title>Untitled Page</title>

<scripttype="text/javascript">

var selecetedfield="";

function testme()

{

//alert('hiiiiii');

//alert('hyyy');

//var thisdate= new date();

//alert(thisdate);

//return true;

//alert("hi")

//alert(document.getElementById('ListBox1').options.length);

//alert(document.getElementById('ListBox2').options.length);

var list = document.getElementById('ListBox2');

for(var i = 0; i < list.options.length; ++i)

{

selecetedfield= selecetedfield +",(" +list.options[i].value +") ";

}

// alert(selecetedfield)

// alert(list.options[i].value);

document.form1.HiddenField1.value = selecetedfield;

selecetedfield="";

//alert(document.form1.HiddenField1.value)

}

function setSize(list1,list2)

{

list1.size = getSize(list1);

list2.size = getSize(list2);

}

function selectNone(list1,list2){

list1.selectedIndex = -1;

list2.selectedIndex = -1;

addIndex = -1;

selIndex = -1;

}

function getSize(list){/* Mozilla ignores whitespace,

IE doesn't - count the elements

in the list */

var len = list.childNodes.length;var nsLen = 0;

//nodeType returns 1 for elements

for(i=0; i<len; i++){if(list.childNodes.item(i).nodeType==1)

nsLen++;

}

if(nsLen<2)return 2;

else

return nsLen;

}

var selectedList;

var availableList;

function createListObjects(){

availableList = document.getElementById("ListBox1");

selectedList = document.getElementById("ListBox2");

//alert(availableList)

//alert(selectedList)

}

function delAttribute(){

//availableList = document.getElementById("ListBox1");

// selectedList = document.getElementById("ListBox2");

var selIndex = selectedList.selectedIndex;

if(selIndex < 0)

return;

availableList.appendChild(selectedList.options.item(selIndex));

// selectNone(selectedList,availableList);

// setSize(availableList,selectedList);

}

function addAttribute(){

//alert('hi');

//availableList = document.getElementById("ListBox1");

// selectedList = document.getElementById("ListBox2");

var addIndex = availableList.selectedIndex;

//alert(addIndex)

if(addIndex < 0)return;

selectedList.appendChild(availableList.options.item(addIndex));

// selectNone(selectedList,availableList);

// setSize(selectedList,availableList);

}

</script>

</head>

<bodyonload="createListObjects()">

<formid="form1"runat="server">

<div>

<asp:AccessDataSourceID="AccessDataSource2"runat="server"DataFile="~/PMO - Accounts.mdb"

SelectCommand="SELECT DISTINCT [attribute_section] FROM [tblattribute_displayname]">

</asp:AccessDataSource>

<asp:HiddenFieldID="HiddenField1"runat="server"/>

<asp:ButtonID="Button1"runat="server"Style="z-index: 103; left: 195px; position: absolute;

top: 91px"Text="Click"Width="33px"/>

<inputid="Button3"style="z-index: 107; left: 542px; position: absolute; top: 82px; width: 56px;"

type="button"value=">>"onclick="addAttribute()"unselectable="on"/>

<inputid="Button4"style="z-index: 108; left: 542px; position: absolute; top: 110px; width: 57px;"

type="button"value="<<"onclick="delAttribute()"/>

<asp:ScriptManagerID="ScriptManager1"runat="server">

</asp:ScriptManager>

<asp:UpdatePanelID="UpdatePanel1"runat="server">

<ContentTemplate>

<br/>

<asp:ButtonID="Button2"runat="server"Style="z-index: 101; left: 189px; position: absolute;

top: 119px"Text="Execute"Width="54px"/>

<asp:GridViewID="GridView1"runat="server"Style="z-index: 109; left: 10px; position: absolute;

top: 180px"Height="1px"Width="1px">

</asp:GridView>

<br/>

<br/>

<br/>

<br/>

</ContentTemplate>

</asp:UpdatePanel>

<asp:DropDownListID="DropDownList1"runat="server"DataSourceID="AccessDataSource2"

DataTextField="attribute_section"DataValueField="attribute_section"Height="82px"

Style="z-index: 105; left: 265px; position: absolute; top: 23px"AutoPostBack="True">

</asp:DropDownList>

<asp:ListBoxID="ListBox1"runat="server"Height="107px"Style="z-index: 100; left: 414px;

position: absolute; top: 55px"Width="121px"></asp:ListBox>

<asp:ListBoxID="ListBox2"runat="server"Style="z-index: 102; left: 606px; position: absolute;

top: 56px"Height="103px"Width="126px"></asp:ListBox>

</div>

</form> </body>

</html>

Transforming plain ID to adorned ID

I must be missing something obvious here. Suppose I create an ASP.NET Web User Control, and I use a ModalPopupExtender inside it. In the ascx, I set various properties of the extender to refer to controls within the Web User Control, such as PopupDragHandleControlID="TitleText". At runtime, the control with ID "TitleText" gets a more complicated ID on the rendered page (call it an 'adorned' ID, not sure what the offical term is), such as "ctl00_ContentPlaceHolder1_MyCtrl1_TitleText". The behaviour javascript for the extender does things like -

this._dragHandleElement = $get(this._PopupDragHandleControlID);

That wouldn't work with the 'plain' ID, in fact by adding various alert() boxes I can see that _PopupDragHandleControlID has been transformed - somewhere - to the 'adorned' version. I've written an extender that declares and uses ID properties in just the same way, but they don't get transformed from the 'plain' version at runtime. So, I either have to use ugly workarounds like setting that ID programmatically from server-side code (e.g. MyExtender1.BlahID = MyBlahCtrl.ClientID), or ... figure out how to get that transformation to happen automatically like it seems to for ModalPopupExtender. Can anyone point me in the right direction?

(Note, I'm not talking about the TargetControlID property, so ResolveTargetControlID wouldn't come into it, and I'm talking about an extender that's right next to the controls in question.)

Thanks in advance for any leads.

Kevin.

All extender properties that reference ID's are decorated with theIDReferencePropertyAttribute. It helps converts server side ids into client versions so that the behavior can resolve them easily. If you look at the ModalPopupExtender.cs file, the PopupDragHandleControlID has that attribute and so so any other properties that are used to get control IDs.


Do you have any references that confirm that's so and detail where it occurs? The reasons I ask are 1. My extender's properties that ref IDs already have that attribute, and no such conversion occurs, and 2. The documentation for that attribute doesn't mention anything like that, merely that it can be used by designers to help out by giving a list of control IDs at design time - no mention of anything happening at runtime. But if that attribute is the answer and if you have more information on it, please do say so I can figure out why it isn't working for me.

Or does anyone else have details on how the conversion occurs for PopupDragHandleControlID et al?

Thanks in advance for any help

Kevin.


It happens in ExtenderBaseDesignerHelpers.cs file. It is part of the Toolkit framework. If you are building on top of ExtenderControlBase this is taken care of automatically.

Should have included these links earlier

http://ajax.asp.net/ajaxtoolkit/Walkthrough/CreatingNewExtender.aspx

http://ajax.asp.net/ajaxtoolkit/Walkthrough/ExtenderClasses.aspx


Aha. In fact, I had a hand-rolled extender built with ref to various online docs rather than one done as per that walkthrough, which when followed showed up I'd not got the ECB derivation stuff right. In the interim, I'd done some tracing through the ACT code and you're quite right, that attribute is used as a signal for the base classes to apply some transformation before serialising. Funny the docs don't mention that. Anyway, thanks for the pointers - it's running ok now.

Kevin.

Transparent PNG in AdRotator - Applying Behavior

I'm having a bit of trouble with AdRotator. I have images that are transparent PNG files. I created a style that applys the behavior to correct IE6 inability to display transparent PNG images. When I add the reference, images don't appear. They work in FireFox, just not IE6 (I haven't checked IE7). This behavior works everywhere else in the site.

Is there a workaround?

<asp:AdRotator id="AdRotator1" runat="server" borderstyle="None" datasourceid="SqlDataSource2" cssclass="adRotator"></asp:AdRotator>

.adRotator {
behavior: url('/behaviors/pngbehavior.htc');
border: 0px;
padding: 0px;
margin: 0px;
}

You need to haveheight andwidth set in AdRotator or CSS.

Transparent Popcontrol extender problems

Hi, I am having an odd problem. I have about the simplest test case of a popupcontrol exenter I can think of below. I added a combo box below the extended textbox to illustrate the problem. The issue is that when I click on the textbox to display the radiobutton list, the back ground of the radion button list is transparent. How come? It doesn't matter what control is underneath the textbox. The radiobutton list is always displayed with a transparent background. What is the magic dust I am missing?

Thanks ... Ed

<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<br />
<asp:TextBox ID="textbox1" runat="server" Width="200"></asp:TextBox><br />
<asp:DropDownList ID="DropDownList1" runat="server" Width="216px">
<asp:ListItem>Item1</asp:ListItem>
<asp:ListItem>Item 2</asp:ListItem>
</asp:DropDownList>
<ajaxToolkit:PopupControlExtender ID="PopupControlExtender1" runat="server" CommitProperty="value"
CommitScript="e.value += ' - do not forget!';" PopupControlID="Panel1" Position="Bottom"
TargetControlID="textbox1">
</ajaxToolkit:PopupControlExtender>

</div>
<asp:Panel ID="Panel1" runat="server" >
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:RadioButtonList ID="RadioButtonList1" runat="server" AutoPostBack="true" OnSelectedIndexChanged="RadioButtonList1_SelectedIndexChanged">
<asp:ListItem Text="Walk dog"></asp:ListItem>
<asp:ListItem Text="Feed dog"></asp:ListItem>
<asp:ListItem Text="Feed cat"></asp:ListItem>
<asp:ListItem Text="Feed fish"></asp:ListItem>
<asp:ListItem Text="Cancel" Value=""></asp:ListItem>
</asp:RadioButtonList>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Panel>
</form>

The default value of background-color style is transparent, so you will get transparent radio button lists. You can specify a color explicitly to make this work.

Thanks so much. That was it. Although it raises a question. I set the background color of the underlying panel to white. How come the what was under the panel showed through the panel and through the radiobuttonlist?

Thanks ... Ed

Trapping server errors

If an asynchronous call generates an error on the server side, the client displays a Javascript alert box with the basic error message, for instance "Object reference not set to an instance of an object".

Is there any mechanism to trap and react to these errors on the client side, for instance directing them to an error page instead of showing them the alert box?

Mike

You can set in web.config

<customErrors mode="RemoteOnly" defaultRedirect="GenericError.aspx">
</customErrors>

So that client side will be rredirected to GenericError.aspx instead of getting an error...


I think you misunderstand the question. These are server side errors that occur on an AJAX asynchronous postback, rather than a regular postback, so it is not possible to redirect the client by using either the built in ASP.NET custom error page functionality, or by using Response.Redirect.

There must be some mechanism within the AJAX library for me to specify what to do in the case of an exception being raised. Really, all I want to do is, instead of the alert box showing the .NET error message, it should show something generic like "Oops, an error occured".

Can someone tell me how I do this?

Mike


Check this example, might be useful for you .

http://ajax.asp.net/docs/ViewSample.aspx?sref=Sys.Net.ErrorHandlingTutorial%23WebServiceMethodError.aspx

http://ajax.asp.net/docs/tutorials/ConsumingWebServicesWithAJAXTutorial.aspx

Treating an ASCX control as independent

One huge disadvantage of the UpdatePanel control, IMHO, is that all of the Page life cycle reloads again.

I was wondering, when I just want to load a single control that has nothing to do with the rest of the stuff on the page, is this roundtrip really necessary?

I know that there's the client approach which says I can communicate with the server with minimal data and create all controls at the client-side, but that won't let me use server-controls and their benefits.

I thought of something that renders an ASCX control and serves its HTML, but it not covers everything, such as event firing.

Is my idea doable? Anyone bumped into this before?

Thanks!

If you want the benefits of the server controls you must also allow their life cycle to run. It's both the advantage and the disadvantage of the UpdatePanel.


Agreed... This is discussed here:http://encosia.com/index.php/2007/07/11/why-aspnet-ajax-updatepanels-are-dangerous

One option is to use ASP.NET PageMethods (also described in that link) which simplifies WebMethod calls and only returns results and not much overhead. You can also use multiple UpdatePanels so that you aren't refreshing so much.

Hope this helps,

-Damien

Tree control

Hi,

I would like a scalable, extendable, customizable, localizable fully asynchronous tree control. Is such a beast available?

Many thanks!

TimHi Tim,

There isn't anything that does everything you want out of the box. Your best bet is to look at using the ASP.NETTreeView inside an "Atlas"UpdatePanel. The current issue of MSDN magazine actually has anarticle by Jeff Prosise exploring some practical ways of doing this.

Thanks,
Ted

Thanks Ted. It seems like a good candidate for addition to the toolkit. Ideally I would like to create a completely control driven application and implemented very cleanly. Best regards, Tim

Tree Control within Grid Control using AJAX and ASP.Net

Hi, I need a tree control inside a grid control, i.e.., every node of the tree should be a row in the grid control. I want to implemented this using AJAX. Please let me know how this has to be implemented.

Hi

every node of the tree should be a row in the grid control?

I'm afraid you cann't implement this,Html can be writed like this.

Best Regards

Tree Control within Grid Control using AJAX

Hi,
I need a tree control inside a grid control, i.e.., every node of the tree should be a row in the grid control.
I want to implemented this using AJAX. Please let me know how this has to be implemented.

Hi TinyTin,

I have found that you have posted the same thread on Asp.Net Ajax UI with this url: http://forums.asp.net/t/1141859.aspx. so we will mark it as "resolved", if you have any problems or new findings , please feel free to reply onhttp://forums.asp.net/t/1141859.aspx.

By the way, based on my experience, I'm afraid that we cannot achieve what you want by using any controls in Ajax Control Toolkit directly. Thanks.

Best Regards,

Jonathan

tree view + no postback + update panel

setup:

master page - content page layout

On my content page I want two update panels, one to contain a tree view dynamically generated from a database and the other to contain dynamically generated data (also pulled from a database) based on what is selected in the tree view. It is my understanding that tree view cannot be in an update panel. What is the best strategy for accomplishing this? I don't want a postback to be performed when an item is selected in the tree view. In other words, I don't want the entire page (form) refreshed just because an item in the tree view is selected.

Thanks in advance for any help.

If your treeview doesn't change the contents after the PageLoad, you may be able to have it in an update panel. We found that it doesn't work well if you add nodes to the treeview when you click a parent node, but if you load the full treeview it may be ok. If you need to dynamically add nodes as you click, you would probably need something like the TreeView that telerik has. We were looking at that one until we decided to do our page differently, and that control is not free, but seems to work nice.

The 2nd update panel would have a grid view in it. From the grid view I would add or edit content. If I added content the tree view would need to be refreshed without a full page postback to display the newly added item.

From the sounds of it, this isn't possible with strictly MS controls at the moment.


I just finished this very thing. The page starts with just a pulldown and then based on that value creates a Treeview dynamically without refreshing the page. Then clicking on a node causes another update panel to refresh with specific information.

Pretty convoluted with half Telerik and half MS. The full Telerik approach (Treeview and Update panel) looks easier, but we are using MS AJAX.

My older version of the Treeview (5.3) does not work with MS update panel, so I need to upgrade. I'm not too happy about it, but it seems to work well.

WISH LIST: A direct JavaScript method to postback to an MS update panel. As it is this seems to be the best approach:

http://forums.asp.net/thread/1541012.aspx


I followed the instructions on that thread and I have my update panel refreshing from javascript code. How do I call a javascript function when a tree node is clicked?

in the Telerik Treeview there is a property called "onBeforeNodeClick" and you can set that to the name of a javaScript function to fire when a node is clicked and before postback.


So, I did

myTreeNode.NavigateUrl ="javascript:postBackHiddenField('hardcodedhiddenfieldcontrol','" + uniqueIdentifierOfTreeNode +"')"function postBackHiddenField(hiddenFieldID, clickedID){alert("works");var hiddenField = $get(hiddenFieldID);__doPostBack(hiddenFieldID,'');}
 
I want to use the uniqueIdentifierOfTreeNode in order to modify the select paramter of a gridview in the update panel I'm refreshing from __doPostBack. I have no idea. Any help is appreciated. Is this the best approach to take even?

I forgot to mention the postback and refresh of the update panel is working as I have a label refreshed with the system time.
Nevermind, it looks like I came up with a reasonable solution that works.

Tree view control with ajax

Hello,

I dont know, is this the right thread to post my prob. Here is my problem. I have a tree view control in a master page. I have created that tree view from "treeview.xml" file. I have created this file from database table. In this tree view, more than one node may have same name. My table has four fields - nodeid, nodename, parentid and lavel. The xml file looks like...

<?xml version='1.0' encoding='utf-8' ?>
<rootNode>
<siteNode title="root" id="1">
<siteNode title="my document" id="3">
<siteNode title="my films" id="31">
<siteNode title="bengalis" id="33">
<siteNode title="aaa102" id="102" />
<siteNode title="aaa106" id="106">
<siteNode title="xxxx1" id="1051" />
<siteNode title="xxxx1" id="1053" />
<siteNode title="zzzz2" id="1059" />
...
...
Every node may have more than one information. All these informations are stored in a different file with "nodeid". What I want is that when any one click on any node I want to display all the information stored in that node in the "Conten Page" with the help of Ajax. For that I need the id of that selected node. How can I access the node id?

Angshujit

Do you want the tree view to dynamically add nodes when you click one of the nodes? If so, you will have a lot of problems using the built in controls for that because the treeview is not supported inside an update panel. You can generally have a treeview in an update panel if it doesn't change the contents, but if you want it to change after page load, you should look at getting a 3rd part control for it.

Hello,

Thank you for your reply. No, I dont want so at present. Actually what is became my headache is how to get the id of the node.

protectedvoid SelectedNodeChanged(object sender,EventArgs e)

{

string id = treeView1.SelectedNode.?

Because without knowing the id I cannot search the table for contents belongs to that node. I cannot usetreeView1.SelectedNode.Text becasue there may be more than one nodes with same text. Is there any way to solve it? Please help me.

Angshujit

Tree view nested in Accordion taking two clicks to fire selectedNodeChanged event

I have a treeview in one of my accordion panes. When I click on a node for the first time, instead of firing the selectedNodeChanged event, it just goes through a normal postback. However the second time I click it, the event is fired correctly. Is there another event being fired that I'm not seeing?

Here's a trimed down version of the code. Thanks for any ideas. -d

<atlasToolKit:Accordion ID="navAccordion" runat="server" Height="410"
FadeTransitions="true" FramesPerSecond="40"
TransitionDuration="250"
AutoSize="None"
>

<atlasToolKit:AccordionPane ID="AccordionPane2" runat="server">
<Header><a href="http://links.10026.com/?link=" onclick="return false;" class="accordionLink">Tank Groups</a></Header>
<Content>
<asp:Panel ID="navPanel" runat="server" ScrollBars="auto" CssClass="extraPadding" BackColor="white" Width="180" Height="200">
<asp:TreeView ID="navTankGroups" OnUnload="nav_Unload" OnSelectedNodeChanged="nav_SelectedNodeChanged" runat="server" SkinID="nav" >
<Nodes>
<asp:TreeNode Text="Page 1" Value="~/page1.aspx" />
<asp:TreeNode Text="Page 2" Value="~/page2.aspx" />
</Nodes>
</asp:TreeView>
</asp:Panel>
</Content>
</atlasToolKit:AccordionPane>
</atlasToolKit:Accordion>

Here's the selectedNodeChanged routine.

Protected Sub nav_selecedNodeChanged(ByVal sender As Object, ByVal e As EventArgs)
Dim navTankGroups As TreeView = CType(AccordionPane2.ContentContainer.FindControl("navTankGroups"), TreeView)
If Not navSchedule.SelectedNode.ValuePath = String.Empty Then
Response.Redirect(navTankGroups.SelectedNode.Value)
End If
End Sub


This appears to only be an issue on master pages. I placed the accordion in a new page and it worked fine. Anyone have an idea on why it is taking two clicks in the masterpages? -d

Hi dtamber,

I'm not sure what's going on with this... could you perhaps post the simplest possible version you have that still causes the problem?

Thanks,
Ted


Look at the source code before and after the button click, there is one of 2 possibilities.

1. someting being created dynamicly doesn't have an ID property set, in this case you'll see the treeview control in the source with different names

Like ctl03 and ctl05 in the treeview's name

2. I have fixed my postback issues by adding a hidden field to each accordion pane at page_init. I don't know why this fixes the erradic behavior, but it does.

Let me know if either of these works.

Chris


I think this needs a bump.

I just tried using an accordion in a usercontrol and added 3 panes, each containing an updatepanel containing a button.

The button click event is not fired. Adding a hidden field as Chris suggested allows the click event to fire.

Nathan


I also ran into the exact same problem. I was using a gridview inside an accordion and the events weren't firing the first attempt. If you add a control to it during OnInit then it appears to work. My assumption is that there's a problem with the RenderControls or something.

Astynax777:

I also ran into the exact same problem. I was using a gridview inside an accordion and the events weren't firing the first attempt. If you add a control to it during OnInit then it appears to work. My assumption is that there's a problem with the RenderControls or something.

Astynaxx777 - This clicking twice problem has been a real issue for me. Can you please elaborate with a small example if possible? You mean to add a control to the AccordionPane when the page loads (through the code behind)?

Your help would be greatly appreciated.


I ran into the same problem where I couldn't get a Button click event to fire off until I did whatCConchelos tried:

"2. I have fixed my postback issues by adding a hidden field to each accordion pane at page_init. I don't know why this fixes the erradic behavior, but it does."

Here's a basic example:

 
<body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server" /> <div> </div> <cc1:Accordion ID="Accordion1" runat="server"> <Panes> <cc1:AccordionPane ID="AccordionPane1" runat="server"> <Header>Test1</Header> <Content> <asp:LinkButton ID="LinkButton1" runat="server">LinkButton</asp:LinkButton> </Content> </cc1:AccordionPane> <cc1:AccordionPane ID="AccordionPane2" runat="server"> <Header>Test2</Header> <Content> <asp:Button ID="Button1" runat="server" Text="Button" /> </Content> </cc1:AccordionPane> </Panes> </cc1:Accordion> </form></body>

The Button1 click event would not get called until I added a hidden field to the AccordionPane that contained Button1 on the Page_Init:

Private Sub Page_Init(ByVal senderAs System.Object,ByVal eAs System.EventArgs)Handles MyBase.InitDim myAccordionPaneAs AccordionPaneDim myTextBoxAs New TextBox myTextBox.Visible =False myAccordionPane =MyBase.FindControl("AccordionPane2") myAccordionPane.Controls.Add(myTextBox)End Sub

I thinkAstynax777 is right - there must be something wrong with the controls inside an AccordionPane when being rendered.


Thank you very much. It should be noted that after Astynax777's suggestion I tried it with a button and I forgot to hide it, and it didn't work as expected.

Excellent example, thanks again.


Hi,

has anyone found out more about this issue? As indicated in a previous post, the issue appears to be that controls are not rendered properly the first time the accordion is loaded. When the postback occurs, the controls have a different id, and no event is fired since it cannot be hooked up to the appropriate control (since the ID has changed).

I have a slightly different problem than those posted above as the accordion I'm working with is loaded via a datasource. I cannot add controls on the init event as a temporary fix. Any idea for a workaround would be greatly appreciated until this is resolved.

Thanks


btw, this "click twice" error disappears when I have only 1 accordion control on a page. If there are two accordion controls (one is data bound, the other is not), then I have to click twice. When I only have the databound accordion, it works as intended.

The good thing is that adding the "invisible" control to each pane in the Accordion which is not databound has fixed the "click twice" error in the databound Accordion.


Ok, I think I have this problem fixed. You can see the changes I made athttp://www.codeplex.com/AtlasControlToolkit/WorkItem/View.aspx?WorkItemId=5796 . There's 2 files I uploaded for that issue. I might help you... or it might not, I have not tested it for your problem but it certainly fixed mine! Good luck.


Has anybody else tried it with the new 10660 release? For me, the event handling never worked. My accordion is completely databound and does not contain any unbound panes. Consequently, the workaround will not work for me. I've just tried it with 10660, but no change.

Dennis Doomen
Aviva Solutions


I was having all of those 'click twice' problems but in randomly places. I used Accordions on many different pages and I couldnt figure out why it worked on some pages and didnt on others. I realized that on the page that it didnt work I was doing my control loading during OnInit and on my other pages that did work it was during PageLoad. Im guessing you have to make sure that everything must be done in one or the other. If you have User Controls make sure that your logic and things are also in it's page load as well. Dont mix and match :)

Tree, Menu, etc not usable in UpdatePanel. Any workarounds?

I spent a long (probably too long before checking the forums) time tracking down the "0.cells is null or not an object" problem. To come to find out that the tree, the menu, and the grid don't work with the UpdatePanel (See notes near bottom ofhere).

I'm wondering if there are any workarounds that anyone has come up with. This kinda sucks since part of my design was to use a goodly amount of popups that allow modifications and those are nicely handled using menus, trees, and such. I know that microsoft says they're working on some ajax based controls that wrap these other controls up. But the need is kinda here and now (Maybe I just don't have a latest update of ACT or something?) Anyway using Telerik or some other commercial control is just not feasible in my budget at the moment. So I thought I'd see if anyone had any workarounds.

For that matter does anyone have any workarounds for accordions to make them horizontal (to make them open and close left to right instead of up and down)?

I'm thinking that some other people have experienced some problems such as these and might be working on some ideas as far as workarounds.If so then perhaps we could "band together" and create an area on CodePlex (and possibly some referers at google, sourceforge and the like) to at least give some pointers to some other efforts to expand on the ACT.

Anyway just wanted to throw that alternate idea out there, but if anyone has any viable workarounds for the lack of support of trees, grids, and menus in the UpdatePanel, I and probably many others would be glad to hear about it.

Thanks in advance,
Christopher

The UpdatePanel included in the .Net framework 3.5 supports having treeview and menu controls in them. There is a go live license for VS 2008. Maybe you can use VS 2008

http://blogs.msdn.com/somasegar/archive/2007/09/08/asp-net-enhancements-in-vs2008-and-net-fx3-5.aspx


I am not sure that the TreeView is supported in .NET 3.5. My suggestion is to use any third pary javascript library for the treeview and use WebService for the data transfer.


yeah moving up to VS2k8 and moving up to .NET 3.X (3.5 in beta) doesn't seem like an option (at this point) to have this "design paradigm" adopted. It means to many other adoption points. Hmm I'll keep you all updated I guess as far as any solutions, but if anyone else has something to contribute I'm quite willing to work with them. In my mind this begs further investigation. ;-)


Controls that Are Not Compatible with UpdatePanel Controls

The following ASP.NET controls are not compatible with partial-page updates, and are therefore not supported inside anUpdatePanel control:

TreeView andMenu controls.

Web Parts controls. For more information, seeASP.NET Web Parts Controls.

FileUpload controls when they are used to upload files as part of an asynchronous postback.

GridView andDetailsView controls when their EnableSortingAndPagingCallbacks property is set totrue. The default isfalse.

Login,PasswordRecovery,ChangePassword, andCreateUserWizard controls whose contents have not been converted to editable templates.

TheSubstitution control.

Validation controls, which includes theBaseCompareValidator,BaseValidator,CompareValidator,CustomValidator,RangeValidator,RegularExpressionValidator,RequiredFieldValidator, andValidationSummary control.


Yes that's what I was saying in my original post when I said that they don't work with an update panel and referred to the document thru a link. So I guess I'm missing your point in posting that with no statements by you. Is there some workaround that I'm missing in my reading of it?

Thanks in advance,
Christopher

TreeView "MyTreeView_Data" is undefined

Hi,

I have a page with a TreeView control inside a webpart.

This page uses Atlas (July CTP), but not exactly in this webpart. That's why I am not sure if it's an Atlas problem or a standard ASP.NET problem.

When I click a node of the TreeView (to select it), sometimes I have this javascript error:

"A Runtime Error has occurred."
"Error: 'wpMgr_myTreeView_Data' is undefined"

The problem is aleatory. Doesn't happen always, only sometimes.

Any idea on what could be the cause?

Maybe Atlas July CTP exists some?issues?to?work?TreeView?node?in?WebPart.I?suggest?you?to?download?the?latest?Ajax?
Beta?2?and?Futures?November?CTP?to?try?if?it?works?fine.
Here are some sample codes about a TreeView in WebPartZone for your reference.
<WebPart:webpartmanager id="WebPartManager1" runat="server"></WebPart:webpartmanager>
<WebPart:webpartzone id="WebPartZone1" runat="server" bordercolor="#CCCCCC" font-names="Verdana"
padding="6" width="169px">
<PartChromeStyle BackColor="#F7F6F3" ForeColor="White" BorderColor="#E2DED6" Font-Names="Verdana"></PartChromeStyle>
<MenuLabelHoverStyle ForeColor="#E2DED6"></MenuLabelHoverStyle>
<EmptyZoneTextStyle Font-Size="0.8em"></EmptyZoneTextStyle>
<MenuLabelStyle ForeColor="White"></MenuLabelStyle>
<MenuVerbHoverStyle BackColor="#F7F6F3" BorderStyle="Solid" ForeColor="#333333" BorderWidth="1px" BorderColor="#CCCCCC"></MenuVerbHoverStyle>
<HeaderStyle ForeColor="#CCCCCC" HorizontalAlign="Center" Font-Size="0.7em"></HeaderStyle>
<MenuVerbStyle BorderStyle="Solid" ForeColor="White" BorderWidth="1px" BorderColor="#5D7B9D"></MenuVerbStyle>
<PartStyle ForeColor="#333333" Font-Size="0.8em"></PartStyle>
<TitleBarVerbStyle ForeColor="White" Font-Size="0.6em" Font-Underline="False"></TitleBarVerbStyle>
<MenuPopupStyle BackColor="#5D7B9D" BorderWidth="1px" BorderColor="#CCCCCC" Font-Size="0.6em" Font-Names="Verdana"></MenuPopupStyle>
<PartTitleStyle BackColor="#5D7B9D" ForeColor="White" Font-Size="0.8em" Font-Bold="True"></PartTitleStyle>
<ZoneTemplate>
<asp:TextBox ID="tbWebPart" runat="server" Height="19px" Width="197px"></asp:TextBox>
<asp:UpdatePanel ID="upTree" runat="server" ChildrenAsTriggers="false" UpdateMode="Conditional">
<ContentTemplate>
<asp:DetailsView ID="DetailsView1" runat="server" Height="50px" Width="125px" AutoGenerateRows="False" DataSourceID="SqlDataSource1" AllowPaging="True" CellPadding="4" ForeColor="Black" GridLines="Vertical" BackColor="White" BorderColor="#DEDFDE" BorderStyle="None" BorderWidth="1px">
<Fields>
<asp:TemplateField>
<ItemTemplate>
<asp:TreeView ID="TreeView1" runat="server">
<Nodes>
<asp:TreeNode Text="File" Value="File">
<asp:TreeNode Text="New" Value="New"></asp:TreeNode>
<asp:TreeNode Text="Open" Value="Open"></asp:TreeNode>
<asp:TreeNode Text="Exit" Value="Exit"></asp:TreeNode>
</asp:TreeNode>
<asp:TreeNode Text="Edit" Value="Edit"></asp:TreeNode>
<asp:TreeNode Text="WebSite" Value="WebSite"></asp:TreeNode>
<asp:TreeNode Text="Build" Value="Build"></asp:TreeNode>
<asp:TreeNode Text="Debug" Value="Debug"></asp:TreeNode>
<asp:TreeNode Text="Format" Value="Format"></asp:TreeNode>
<asp:TreeNode Text="Help" Value="Help"></asp:TreeNode>
</Nodes>
</asp:TreeView>
</ItemTemplate>
<EditItemTemplate>
<asp:TreeView ID="TreeView2" runat="server" ShowCheckBoxes="All">
<Nodes>
<asp:TreeNode Text="File" Value="File">
<asp:TreeNode Text="New" Value="New"></asp:TreeNode>
<asp:TreeNode Text="Open" Value="Open"></asp:TreeNode>
<asp:TreeNode Text="Exit" Value="Exit"></asp:TreeNode>
</asp:TreeNode>
<asp:TreeNode Text="Edit" Value="Edit"></asp:TreeNode>
<asp:TreeNode Text="WebSite" Value="WebSite"></asp:TreeNode>
<asp:TreeNode Text="Build" Value="Build"></asp:TreeNode>
<asp:TreeNode Text="Debug" Value="Debug"></asp:TreeNode>
<asp:TreeNode Text="Format" Value="Format"></asp:TreeNode>
<asp:TreeNode Text="Help" Value="Help"></asp:TreeNode>
</Nodes>
</asp:TreeView>
</EditItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="ProductID" HeaderText="ProductID" InsertVisible="False"
ReadOnly="True" SortExpression="ProductID" />
<asp:BoundField DataField="ProductName" HeaderText="ProductName" SortExpression="ProductName" />
<asp:BoundField DataField="UnitPrice" HeaderText="UnitPrice" SortExpression="UnitPrice" />
<asp:CommandField ShowEditButton="True" />
</Fields>
<FooterStyle BackColor="#CCCC99" />
<EditRowStyle BackColor="#CE5D5A" Font-Bold="True" ForeColor="White" />
<RowStyle BackColor="#F7F7DE" />
<PagerStyle BackColor="#F7F7DE" ForeColor="Black" HorizontalAlign="Right" />
<HeaderStyle BackColor="#6B696B" Font-Bold="True" ForeColor="White" />
<AlternatingRowStyle BackColor="White" />
</asp:DetailsView>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:ProductConnectionString %>"
SelectCommand="SELECT [ProductID], [ProductName], [UnitPrice] FROM [Product]" DeleteCommand="DELETE FROM [Product] WHERE [ProductID] = @.ProductID" InsertCommand="INSERT INTO [Product] ([ProductName], [UnitPrice]) VALUES (@.ProductName, @.UnitPrice)" UpdateCommand="UPDATE [Product] SET [ProductName] = @.ProductName, [UnitPrice] = @.UnitPrice WHERE [ProductID] = @.ProductID">
<DeleteParameters>
<asp:Parameter Name="ProductID" Type="Int32" />
</DeleteParameters>
<UpdateParameters>
<asp:Parameter Name="ProductName" Type="String" />
<asp:Parameter Name="UnitPrice" Type="Double" />
<asp:Parameter Name="ProductID" Type="Int32" />
</UpdateParameters>
<InsertParameters>
<asp:Parameter Name="ProductName" Type="String" />
<asp:Parameter Name="UnitPrice" Type="Double" />
</InsertParameters>
</asp:SqlDataSource>
</ContentTemplate>
<Triggers>
<asp:PostBackTrigger ControlID="DetailsView1" />
</Triggers>
</asp:UpdatePanel>
</ZoneTemplate>
</WebPart:webpartzone>
Wish this can give you some helps.

Treeview & UpdatePanel - Assertion failed - cant find last / in base url

Hi,

I am using a TreeView and couple of server controls. The treeview children are dynamically added on click of a node. I have the treeview control inside an update panel. Everything works if I access the page in a normal IE window. When I try to access the same page through a modal dialog, during postback, it opens a new window. To avoid that, I've added<base target = "_self" />.

Now I'm getting another error with Atlas. On click of tree node, it says "Assertion Failed : Can't find last / in base url. If I remove the <base..> it doesn't work.

Looking for an immediate solution. I've spent almost a day in googling. But no luck yet.

Many Thanks,
Mani.

hello.

you can also try using an iframe inside your popup page (ie, put only an iframe inside your popoup window which loads the page that shows the content)...maybe it'll solve that problem.


Mani,

Add:<basetarget="_self"href="http://localhost/***/***/"runat="server"/>

because our dear js function check if u have base tag , then try to concat with href value. in your case you don't have it.

T.


what if i'm using a Master Page - i can't hard code a path in the href. Is there any way to accomplish this? Plus - even if i hard code, the paging on my grid view does not work now.

trans642:

Mani,

Add:<basetarget="_self"href="http://localhost/***/***/"runat="server"/>

because our dear js function check if u have base tag , then try to concat with href value. in your case you don't have it.

T.

GOOD THANKS !


trans642:

Mani,

Add:<basetarget="_self"href="http://localhost/***/***/"runat="server"/>

because our dear js function check if u have base tag , then try to concat with href value. in your case you don't have it.

T.

GOOD THANKS !


Try this, without hard code urlSmile
 <base target="_self" href="<%=Request.Url.OriginalString%>" />

works perfect ... Thanks.

Treeview + Update Panel

Hi!

I'm working on atlas and I'm testing some functionnality. I created a page with a treeview contained in an update panel and another update panel that shoul be updated when one selects a node but it doesn't work. Can someone help me?
Here is th source code:

<%@dotnet.itags.org. Page Language="C#" %>"-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><script runat="server"> void dataBound(Object sender, TreeNodeEventArgs e) {// Determine the depth of a node as it is bound to data. // If the depth is 1, show a check box. if (e.Node.Depth == 2) { e.Node.ShowCheckBox = true; } else { e.Node.ShowCheckBox = false; } } protected void TreeView1_SelectedNodeChanged(object sender, EventArgs e) {//If a node is selected, display the text in the right table Message.Text = TreeView1.SelectedNode.Text; }</script><html xmlns="http://www.w3.org/1999/xhtml" >First TreeView with an XML File"server"> "text/css"> div.global { width:100%; margin:0px; border:1px solid #99ccff; line-height:150%; } div.header,div.footer { padding:0.5em; color:white; background-color:#99ccff; clear:left; } div.left {float:left; width:200px; margin:0; padding:1em; } div.right { margin-left:270px; border-left:1px solid #99ccff; padding:1em; } "form1" runat="server"> true ID=ScriptManager runat=server/>

class=global>

class="header">Dynamic Atlas Tree View

class=left> "TreeView1" runat="server" DataSourceID="XDS" OnTreeNodeDataBound="dataBound" ShowCheckBoxes=None OnSelectedNodeChanged="TreeView1_SelectedNodeChanged" ShowLines=true> "Kpf" ValueField="ID" TextField="Name"/> "Activity" ValueField="Value" TextField="Value"/> "XDS" runat="server" DataFile="~/XMLTVDataSource.xml">

class=right> Selected elements



"TreeView1" EventName="SelectedNodeChanged "/>

class=footer>KPF Nord

There is a bug with the TreeView. If you remove ShowLines (or set it to false) it should work. When ShowLines is set to true, the controlsometimes generates invalid xhtml.

For more details, check out this post:
http://forums.asp.net/forums/1196633/ShowPost.aspx


Thanks for your reply. This is the error generated when I debug:
"The EventName must be set to a valid event name on the associated control"
And it occurs because of the triggers tag.
Could someone help me to fix this problem?

TreeView + SelectedNodeChanged + UpdatePanel = Problems

I wondered if anyone else has had strange behavior when specifying the SelectedNodeChanged event of a TreeView as an AsyncPostBackTrigger for an UpdatePanel. I'm currently seeing erratic behavior. Some nodes will post back when selected, and others won't; it seems totally random.

There was no problem before I upgraded fromRelease 60914 of the toolkit.

While we work closely with the ASP.NET AJAX team when developing the Toolkit, they're the real experts on general ASP.NET AJAX issues. Your problem doesn't seem to be directly related to the Toolkit, so we'd appreciate if you considered posting to one of theother newsgroups such asAJAX Discussion and Suggestions. Your post will be more helpful to others looking for similar advice if it's in the right place. Thank you!

I have Treeview inside asp:UpdatePanel.{ASP.NET Ajax RC version}

Its not maintaining its viewstate properly while expanding/collepsing nodes.

If I remove Updatepanel,, it works fine.

Is it a bug ?? what could be relevent and reliable solution.

Thanks in advance.

Rahul Jain

KY


This is still the wrong forum for this question, but I'll answer anyway: TreeView is not supported inside an UpdatePanel. Seehttp://ajax.asp.net/docs/overview/UpdatePanelOverview.aspx.

If you have a TreeView inside an UpdatePanel, it is better to have the following properties set as such PopulateNodesFromClient="false" and EnableClientScript="false". Hope this will solve at least some random problems when clicking/expanding/collapsing a treenode.

Cheers,

vince.n3t


Hello,

I tried a few things in my code & everything started working fine. But I get an error on the IE7 page (error: Invalid argument, Line: 43, Character:238).

On putting a break point & then debugging, I get a break on the JS page & the error points to --> accordion.insertBefore(wrapper, content)

I have no idea what this error means & how to debug it. Because everything on the IE7 page works as I want it to, but I get this error on the status bar as: 'Done, but with errors on page'.

Please help me with this error, as this a project I am working on & I need to complete it before the deadline. Any other options for creating a TreeView using any of the Ajax Extenders with the Update Panel are also welcome.

MyDefault.aspx :

<%@. Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="AJAXRajeev.Default" %>

<%@. Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %>

<!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 id="Head1" runat="server">
<title>
Sales Professional Desktop II
</title>
</head>
<body>
<form id="form1" method="post" runat="server">
<div class="Default" style="float:left">

<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true" EnablePartialRendering="true">
<Services>
<asp:ServiceReference Path="WebService.asmx" />
</Services>
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<ContentTemplate>
<div id="MyAccordion" runat="server">
<ajaxToolkit:Accordion ID="Accordion1" runat="server" SelectedIndex="0">
<Panes>
<ajaxToolkit:AccordionPane ID="AccordionPane1" runat="server">
<Header><a href="http://links.10026.com/?link=" onclick="return false;" class="accordionlink" />
External Documents
</Header>
<Content>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Panel ID="navPanel" runat="server" ScrollBars="auto">
<asp:TreeView ID="TreeView1" runat="server" BackColor="Transparent" ExpandDepth="1" MaxDataBindDepth="2" NodeIndent="10" SkipLinkText="skip nav" Target="~/Default.aspx" ToolTip="navigation" Font-Names="Verdana" Font-Size="Smaller" ForeColor="Gray" ShowLines="True" PopulateNodesFromClient="true" EnableClientScript="True">
<ParentNodeStyle Font-Bold="False" ImageUrl="~/Images/folder.gif" />
<HoverNodeStyle Font-Underline="True" />
<SelectedNodeStyle Font-Underline="True" HorizontalPadding="0px" VerticalPadding="0px" ImageUrl="~/Images/folder_open.gif" />
<RootNodeStyle ImageUrl="~/Images/folder.gif" />
<NodeStyle Font-Names="Verdana" Font-Size="8pt" ForeColor="Black" HorizontalPadding="5px" NodeSpacing="0px" VerticalPadding="0px" ImageUrl="~/Images/folder_open.gif" />
</asp:TreeView>
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdateProgress ID="UpdateProgress1" runat="server">
<ProgressTemplate>
External Documents
</ProgressTemplate>
</asp:UpdateProgress>
</Content>
</ajaxToolkit:AccordionPane>
</Panes>
</ajaxToolkit:Accordion>
</div>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdateProgress ID="UpdateProgress2" runat="server">
<ProgressTemplate>
External Documents
</ProgressTemplate>
</asp:UpdateProgress>
</div>
</form>
</body>
</html>

MyDefault.aspx.cs :

using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using AllianceBernstein.Wsg.Retail.Common.Data;
using System.Data.SqlClient;
using System.IO;
using System.Drawing;
using System.Web.Services;
using AjaxControlToolkit;

namespace AJAXRajeev
{
[Serializable]
public partial class Default : System.Web.UI.Page
{
protected System.Web.UI.WebControls.Label lblSelectedPath;
protected const string ROOT_PATH = "2:";

protected TreeView Tree
{
get
{
return Accordion1.FindControl("TreeView1") as TreeView;
}
}

protected UpdatePanel UpdatePanel
{
get
{
return Accordion1.FindControl("UpdatePanel1") as UpdatePanel;
}
}

protected void Page_Load(object sender, System.EventArgs e)
{
//UpdateProgress1.AssociatedUpdatePanelID = this.UpdatePanel.ClientID;

Ajax.Utility.RegisterTypeForAjax(typeof(AJAXPortal));
if (!Page.IsPostBack)
{
LoadTree();
}

Folder[] aFolders = Folder.List();

this.Tree.ExpandAll();
}

[Ajax.AjaxMethod()]
private void LoadTree()
{
if (this.Tree == null)
{
return;
}

Folder[] aFolders = Folder.List();
foreach (Folder oFolder in aFolders)
{
TreeNode oTreeNode = new TreeNode();
oTreeNode.Text = oFolder.Name;
oTreeNode.ImageUrl = "/images/folder.gif";
this.Tree.Nodes.Add(oTreeNode);

}
}

internal DataSet ListFolder()
{
throw new Exception("The method or operation is not implemented.");
}


}
}

Please help me with this.

Karamchand

TreeView + UpdatePanel Problems

Hi there!

I think Imight have come across a bug with theasp:TreeView control when combined with theatlas:UpdatePanel.
If you take the following code, everything works fine:

<%@dotnet.itags.org.PageLanguage="VB"%>
<!DOCTYPEhtml PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<scriptrunat="server">
Protected Sub tv_SelectedNodeChanged(ByVal senderAs Object,ByVal eAs System.EventArgs)
tb.Text = tv.SelectedNode.Text
End Sub
</script>
<htmlxmlns="http://www.w3.org/1999/xhtml">
<headrunat="server">
<title>Tree View Problem</title>
</head>
<body>
<formid="form1"runat="server">
<p>Click on a node of the Treeview below and its text should be put into the text box</p>
<atlas:ScriptManagerrunat="server"ID="scriptManager"EnablePartialRendering="true" />
<asp:TreeViewID="tv"runat="server"OnSelectedNodeChanged="tv_SelectedNodeChanged"ImageSet="XPFileExplorer">
<Nodes>
<asp:TreeNodeText="Books"Value="Books">
<asp:TreeNodeText="Practical C-Sharp"Value="1"></asp:TreeNode>
<asp:TreeNodeText="Mastering VB.Net"Value="2"></asp:TreeNode>
</asp:TreeNode>
<asp:TreeNodeText="Movies"Value="3">
<asp:TreeNodeText="Kill Bill vol. 1"Value="4"></asp:TreeNode>
<asp:TreeNodeText="Dodgeball"Value="5"></asp:TreeNode>
<asp:TreeNodeText="Anchorman"Value="6"></asp:TreeNode>
</asp:TreeNode>
</Nodes>
</asp:TreeView>
<atlas:UpdatePanelID="up"runat="server">
<ContentTemplate>
<asp:TextBoxID="tb"runat="server"></asp:TextBox>
</ContentTemplate>
<Triggers>
<atlas:ControlEventTriggerControlID="tv"EventName="SelectedNodeChanged" />
</Triggers>
</atlas:UpdatePanel>
</form>
</body>
</html>

However, things stop working when you either:

    AddShowLines="true" to theasp:TreeView declarationChange theImageSet="XPFileExplorer" attribute to be any of the following:
      CustomSimpleSimple2Bulleted ListBulleted List 2Bulleted List 3Bulleted List 4NewsInboxEventsFaq

I think that the reason for this is because the javascript emitted by the TreeView control is not enclosed in aCDATA section, and that the image array created by the control contains-- e.g.

WebResource.axd?d=9G92-mY7CscAg6O7lwv8PsnId--TqhIqRaQpDEdAXI1&t=632745594511093750

Is there something I'm doing wrong, or is this a bug??
Can anyone find any workarounds?

Thanks,

James

James,

I copied the code into a webform and it works fine. I'm using the January atlas release, and I set the ImageSet to simple, ShowLines=True.


Ditto.

?
-Jarred


Thanks for looking into this! I too am using the January Atlas release and the production release of VS 2005. It seems that there's something else that combines with what I've done to produce my problem...

I am now sure that the problem is caused by WebResource.axd. Unfortunately, in the cut down version I have posted here, it doesn't seem to cause problems, yet in my project with other stuff it does!!Big Smile [:D]

I've been running this through the debugger, and things fail for me in line 7908 of Atlas.js in the this._onFormSubmitCompleted function. The problem is that the XML being returned is not valid XML. In certain instances (which IyetEmbarrassed [:$] cannot reproduce in a postable WebForm), the TreeView control emits the following javascript:

<script type=\"text/javascript\">
<!--
var tv_ImageArray = new Array('', '', '', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8Pl_2e6xumozXPxYZqFu17PU1&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8PsnId--TqhIqRaQpDEdAXI1&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8Pk_e4bsUT9bWDQ2MWH-6gpc1&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8PjqjY2emDMTu7ALA2nDCIXo1&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8Pv8QeO4S4U4ZwyegfXWDlbg1&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8PjAIez-8ow-4yoCeUf2R1NU1&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8PnLYFcxMpAQWCUPvYCAlm0qWW6_VlLmh06LMY4dY_39r0&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8PkHrkGmpuj_GUXpuvKIVAJI1&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8PqfwXpRXxKUp70BWnakVlUQ1&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8Pvxj7JAJj09InIxeJ_LgA78Lw4DU99zuy7Na9XpyN2cc0&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8PgSeXXVCCjUnj7qCKu8r_A81&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8PsSTmdNqcCGmREMlvsvL9QA1&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8Pp4TTumvW-_PLz8ebD3KoT9Z_tUGh00juR7o9DwAVnTq0&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8PsRjUwO9jm3UD68bicsdKr41&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8Pm9FxT3vcf0QM-lXmRYmAcJaCUvMut3EmQU2MCigmEjU0&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8Poa-rVynqR4YhbbIt9Et1MRhkG5zN4ey7kas6zi44Uba0&t=632745594511093750');
// -->
</script>

Now the problem with this is that (in this instance) the 2nd resource contains three hyphens "--"... and this is not valid XML, as XMLDom expects this to be -->!!Smile [:)]

The javascript rendered by the TreeView control seems to go completely against the guidelines that MS sets out inhttp://msdn.microsoft.com/library/default.asp?url=/library/en-us/dnaspp/html/ASPNETusStan.asp, where in point 9 under "Creating XHTML Pages" we are told that "The contents of<script> and<style> elements must be wrapped in CDATA sections."Wink [;)]

So at this point in Atlas.js, response.get_data() returns the following:

<delta><rendering><head><title>
Tree View Problem
</title><style type="text/css">
.atlas__delta { font-family:Lucida Console; }
.tv_0 { text-decoration:none; }

</style></head><form name="form1" method="post" action="Default5.aspx" id="form1">
<div>
<input type="hidden" name="tv_ExpandState" id="tv_ExpandState" value="ennennn" />
<input type="hidden" name="tv_SelectedNode" id="tv_SelectedNode" value="tvt6" />
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="tv_PopulateLog" id="tv_PopulateLog" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMTQ3MDQwNDUzNA9kFgICBA9kFgICAw88KwAJAgAPFgYeDU5ldmVyRXhwYW5kZWRkHgxTZWxlY3RlZE5vZGUFBHR2dDYeCUxhc3RJbmRleAIHZAgUKwADZBQrAAIWAh4IRXhwYW5kZWRnFCsAA2QUKwACFgIfA2dkFCsAAhYCHwNnZBQrAAIWAh8DZxQrAARkFCsAAhYCHwNnZBQrAAIWAh8DZ2QUKwACFgQfA2ceCFNlbGVjdGVkZ2RkGAEFHl9fQ29udHJvbHNSZXF1aXJlUG9zdEJhY2tLZXlfXxYBBQJ0dsRdhXgThnE10BW40FEMjizxq93a" />
</div>

<script type="text/javascript">
<!--
var theForm = document.forms['form1'];
if (!theForm) {
theForm = document.form1;
}
function __doPostBack(eventTarget, eventArgument) {
if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
theForm.__EVENTTARGET.value = eventTarget;
theForm.__EVENTARGUMENT.value = eventArgument;
theForm.submit();
}
}
// -->
</script>


<script src="http://pics.10026.com/?src=/AtlasWebSite1/WebResource.axd?d=Yq1-cqrnodOdYLOHDjipoA2&t=632745594511093750" type="text/javascript"></script>


<script src="http://pics.10026.com/?src=/AtlasWebSite1/WebResource.axd?d=8Qz3IJF2us-avEkYWU7p3g2&t=632745594511093750" type="text/javascript"></script>
<script>
<!--
function TreeView_PopulateNodeDoCallBack(context,param) {
WebForm_DoCallback(context.data.treeViewID,param,TreeView_ProcessNodeData,context,TreeView_ProcessNodeData,false);
}
// -->
</script>
<panelContent id="up"><![CDATA[

<input name="tb" type="text" value="Anchorman" id="tb" />
]]></panelContent>

<script type="text/javascript">
<!--
var tv_ImageArray = new Array('', '', '', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8Pl_2e6xumozXPxYZqFu17PU1&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8PsnId--TqhIqRaQpDEdAXI1&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8Pk_e4bsUT9bWDQ2MWH-6gpc1&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8PjqjY2emDMTu7ALA2nDCIXo1&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8Pv8QeO4S4U4ZwyegfXWDlbg1&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8PjAIez-8ow-4yoCeUf2R1NU1&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8PnLYFcxMpAQWCUPvYCAlm0qWW6_VlLmh06LMY4dY_39r0&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8PkHrkGmpuj_GUXpuvKIVAJI1&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8PqfwXpRXxKUp70BWnakVlUQ1&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8Pvxj7JAJj09InIxeJ_LgA78Lw4DU99zuy7Na9XpyN2cc0&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8PgSeXXVCCjUnj7qCKu8r_A81&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8PsSTmdNqcCGmREMlvsvL9QA1&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8Pp4TTumvW-_PLz8ebD3KoT9Z_tUGh00juR7o9DwAVnTq0&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8PsRjUwO9jm3UD68bicsdKr41&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8Pm9FxT3vcf0QM-lXmRYmAcJaCUvMut3EmQU2MCigmEjU0&t=632745594511093750', '/AtlasWebSite1/WebResource.axd?d=9G92-mY7CscAg6O7lwv8Poa-rVynqR4YhbbIt9Et1MRhkG5zN4ey7kas6zi44Uba0&t=632745594511093750');
// -->
</script>

<div>

<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWCQKH85qQDwLM76LvDALF75m7CAKHpcXIAgKHpdGjCQKBgIwCApf6maAIApf65ZsHApf68fYP70RolxkG7u2i0qsPezZ/X1yrQs8=" />
</div>

<script type="text/javascript">
<!--

WebForm_InitCallback();var tv_Data = new Object();
tv_Data.images = tv_ImageArray;
tv_Data.collapseToolTip = "Collapse {0}";
tv_Data.expandToolTip = "Expand {0}";
tv_Data.expandState = theForm.elements['tv_ExpandState'];
tv_Data.selectedNodeID = theForm.elements['tv_SelectedNode'];
for (var i=0;i<19;i++) {
var preLoad = new Image();
if (tv_ImageArray[i].length > 0)
preLoad.src = tv_ImageArray[i];
}
tv_Data.lastIndex = 7;
tv_Data.populateLog = theForm.elements['tv_PopulateLog'];
tv_Data.treeViewID = 'tv';
tv_Data.name = 'tv_Data';
// -->
</script>
</form></rendering><deltaPanels>up</deltaPanels><xmlScript><page xmlns:script="http://schemas.microsoft.com/xml-script/2005">
<components />
</page></xmlScript></delta>

But response.get_xml() returns nothing, because it is not valid XML!!

I'm going to try and get a concise reproducable example, but in the meantime, if anyone could comment on the above it would be greatly appreciated!!

Cheers,

James


OK... I've spent a bit more time on this and found out the following information:

The problem is not reproducible with a fixed example.

For anyone that's actually interested...

I raised this as a bug with Microsoft... you can see the gory details athttp://lab.msdn.microsoft.com/productfeedback/viewfeedback.aspx?feedbackid=96bfa645-1b02-4b10-92bd-8aafe70e6d54

But in essence they have said:

Resolved as Duplicate by Microsoft on 2006-02-21 at 10:46:28
Thanks for your feedback regarding the Treeview not emitting javascript in CDATA sections

We plan to fix this problem, but no definite time can be given


Hi,

Is there a work around for this problem, its a show stopper for using Atlas in my project with this bug.

Thanks for any help.


Hi Paul!

Unfortunately, there is no workaround to the control not emitting the CDATA section. MS have known about this for some time (i.e. last summer), but have done nothing with it. Hopefully it will get sorted in SP1 of the framework!

However, if your problems are only being caused by the -- string in the WebResource.axd parameter then you can fix it. Basically, what you'll have to do is create a new project and then copy and paste your existing code into it.

I know this is a huge pain in the backside, but it's the only way around it!!! You might also find that when you come to deploy, it doesn't work... so you then have to uninstall the deployment and redeploy until it does work!!!

Cheers,

James


Hi James,

I am able to work with TreeView Control perfectly without any issues, but it stop working in Firefox after the hit to the child node which calls the partial update to the adjacent panel.

I dont see any javascript error in the Javascript console.
also everything is working absolutely fine in both browsers when i eliminate the Atlas coding.

HEre is the outlined part of the aspx file.
--------

<%@.PageLanguage="C#"AutoEventWireup="true"CodeFile="Default.aspx.cs"Inherits="Default"EnableEventValidation="false"%>

<

html>

<

headid="Head1"runat="server"><title>Duty Station Directory</title><linkhref="site.css"rel="stylesheet"type="text/css"/><linkrel="stylesheet"type="text/css"href="siteprint.css"media="print"/>

</

head>

<

SCRIPTlanguage="javascript">

function

scrollTop()

{

document.getElementById(

'RightPanel').scrollTop=0;

}

function

fnTrapKD(btn,event){if (document.all){if (event.keyCode == 13){event.returnValue=false;event.cancel =true;

btn.click();

}

}

elseif (document.getElementById){if (event.which == 13){event.returnValue=false;event.cancel =true;

btn.click();

}

}

elseif(document.layers){if(event.which == 13)

{

event.returnValue=false;event.cancel =true;

btn.click();

}

}

}

</

SCRIPT>

<

body><atlas:ScriptManagerrunat="server"ID="ScpMgr"EnablePartialRendering="true"/><formid="thisFrm"runat="server"><tableclass="PageWidth"><tr><tdclass="Header">Duty Station Directory</td><tdclass="SearchRow"style="width: 45%">

Search

<asp:TextBoxID="txtSearch"runat="server"/><asp:ButtonCssClass="MenuButton"id="btnSearch"Text="Go"runat=serverOnClick="btnSearch_Click"/><atlas:UpdatePanelID="ErrorUpdtPanel"runat="server"Mode="Conditional"RenderMode="Inline"><ContentTemplate><asp:LabelID="lblErr"CssClass="errMessage"Text="Please enter text to search..."runat="server"Visible="false"/></ContentTemplate><Triggers><atlas:ControlEventTriggerControlID="btnSearch"EventName="Click"/></Triggers></atlas:UpdatePanel></td></tr></table><asp:XmlDataSourceID="HCRXML"runat="server"DataFile="~/App_Data/HCRDIR_.XML"TransformFile="~/App_Data/XXXXXXX.xsl"/><tableclass="PageWidth Layout PageTable"><tr><tdclass="TreeLayout"><atlas:UpdatePanelID="UpdatePanel1"runat="server"RenderMode="Inline"Mode="Conditional"><ContentTemplate><divid="TreePanel"runat="server"Class="PageTable PanelTree"><atlas:UpdatePanelID="TreeUpdtPanel"runat="server"RenderMode="Inline"Mode="Conditional"><ContentTemplate><asp:TreeViewID="TreeHCR"runat="server"DataSourceID="HCRXML"OnSelectedNodeChanged="TreeHCR_SelectedNodeChanged"ShowLines="True"ExpandDepth="1"ShowExpandCollapse="true"><DataBindings><asp:TreeNodeBindingDataMember="DutyStationDirectory"PopulateOnDemand="True"SelectAction="SelectExpand"Text="XXXXXXXXXXXXXXXXXX"Value="root"/><asp:TreeNodeBindingDataMember="Country"PopulateOnDemand="True"SelectAction="Expand"TextField="title"ValueField="id"/><asp:TreeNodeBindingDataMember="dsCity"TextField="title"ValueField="id"/></DataBindings><RootNodeStyleCssClass="nodeType rootNode"ImageUrl="~/Images/root.gif"/><ParentNodeStyleCssClass="nodeType parentNode"ImageUrl="~/Images/folder.gif"/><LeafNodeStyleCssClass="nodeType leafNode"ImageUrl="~/Images/page.gif"/><SelectedNodeStyleCssClass="nodeType selectedNode"/></asp:TreeView></ContentTemplate></atlas:UpdatePanel></div></ContentTemplate><Triggers><atlas:ControlEventTriggerControlID="RepeaterSearchResults"EventName="ItemCommand"/></Triggers></atlas:UpdatePanel></td><tdclass="DetailLayout"><atlas:UpdateProgressID="UpdateProgressLabel"runat="server"><ProgressTemplate><imgsrc="Images/indicator.gif"/></ProgressTemplate></atlas:UpdateProgress><asp:Panelid="RightPanel"CssClass="PageTable PanelDetail"runat="Server"><atlas:UpdatePanelID="DetailUpdtPanel"runat="server"Mode="Conditional"RenderMode="Inline"><ContentTemplate><asp:PanelID="DetailPanel"runat="server"><divclass="InfoDetailTable"runat="server"id="divDtls"/></asp:Panel></ContentTemplate><Triggers><atlas:ControlEventTriggerControlID="RepeaterSearchResults"EventName="ItemCommand"/><atlas:ControlEventTriggerControlID="TreeHCR"EventName="SelectedNodeChanged"/><atlas:ControlEventTriggerControlID="btnSearch"EventName="Click"/></Triggers></atlas:UpdatePanel><atlas:UpdatePanelID="SearchResultsUpdtPanel"runat="server"Mode="Conditional"><ContentTemplate><asp:PanelID="SearchPanel"runat="server"><asp:RepeaterID="RepeaterSearchResults"runat="server"OnItemCommand="RepeaterSearchResults_ItemCommand"><HeaderTemplate><H1class="Title">Total Matches found for '<i><%# Keyword %>'</i> : <%# TotalResults %></H1></HeaderTemplate><ItemTemplate><divclass="lightRow"><divclass="links"><asp:LinkButtonID="DetailLink"runat="server"CommandArgument='<%# DataBinder.Eval(Container.DataItem, "Country_Id") + "#" + DataBinder.Eval(Container.DataItem, "dsCode") %> '> <%#DataBinder.Eval(Container.DataItem,"OfficeType") %></asp:LinkButton></div><!-- <div class="ResHeading"> <%# DataBinder.Eval(Container.DataItem, "OfficeType") %> </div> --><divclass="Resdetails"> <%#DataBinder.Eval(Container.DataItem,"dsCode") %> -

<%

#DataBinder.Eval(Container.DataItem,"dsCity") %></div></div></ItemTemplate><AlternatingItemTemplate><divclass="darkRow"><divclass="links"><asp:LinkButtonID="DetailLink"runat="server"CommandArgument='<%# DataBinder.Eval(Container.DataItem, "Country_Id") + "#" + DataBinder.Eval(Container.DataItem, "dsCode") %> '> <%#DataBinder.Eval(Container.DataItem,"OfficeType") %></asp:LinkButton></div><divclass="Resdetails"> <%#DataBinder.Eval(Container.DataItem,"dsCode") %> -

<%

#DataBinder.Eval(Container.DataItem,"dsCity") %></div></div></AlternatingItemTemplate></asp:Repeater><divid="Navigation"runat="server"><asp:LinkButtonID="PreviousPageNav"CssClass="leftnav"runat="server"CommandName="Previous"OnCommand="PageNav_Command"><< Previous | </asp:LinkButton><asp:LabelID="PagerLocation"CssClass="numnav"runat="server"/><asp:LinkButtonID="NextPageNav"CssClass="rightnav"runat="server"CommandName="Next"OnCommand="PageNav_Command"> | More>></asp:LinkButton></div></asp:Panel></ContentTemplate><Triggers><atlas:ControlEventTriggerControlID="RepeaterSearchResults"EventName="ItemCommand"/><atlas:ControlEventTriggerControlID="TreeHCR"EventName="SelectedNodeChanged"/><atlas:ControlEventTriggerControlID="btnSearch"EventName="Click"/><atlas:ControlEventTriggerControlID="PreviousPageNav"EventName="Command"/><atlas:ControlEventTriggerControlID="NextPageNav"EventName="Command"/></Triggers></atlas:UpdatePanel>

</asp:Panel></td></tr></table></form>

</

body>

</

html>
------------------

I hope someone would have faced the same error and can help me to rectify it.
James

Treeview acting strange in UpdatePanel

We are having issues with a treeview in an updatepanel with the RC release. When we click a child node, sometimes it closes other nodes at the same level. When a closed node is expanded again, it has a child node that is expanded. It looks like the treeview is mixing up an opened node with one of its child nodes. If we take it out of an update panel, it works fine, but does full postbacks at every click. Any ideas how to fix this problem?

treeview is not supported by Ajax.NET (I heard rumours about Q3 Orcas -related update)

do search in the forum


I have been searching, but didn't find much. It is just yet another ASP.NET control that isn't supported with UpdatePanels since the CTPs...

I would say treeview made troubles even in CTPs...

this control is discussed quite often here, even the post preceding yours mentions that...

http://forums.asp.net/thread/1514853.aspx


It worked fine for us before, and the menu also did. We were also able to use ReportViewers without having to do a full postback, which you have had to since the Betas.

I am really disappointed that Menu and TreeView controls are not supported in ASP.Net AJAX UpdatePanels. I have a production website that successfully uses Menu and TreeView controls in UpdatePanels using the July CTP of Atlas. Sounds like I will never be able to upgrade to the fully supported ASP.Net AJAX version. I know that the TreeView control can do an asynchronous callback for the TreeNodePopulate event, but I also need partial page postbacks for the SelectedNodeChanged event. In fact, I want PopulateNodesFromClient to be false anyway otherwise the atlas UpdateProgress control does not appear for TreeNodePopulate event asynchronous callbacks. And I extensively use Menu controls to create tabstrips in combination with a MultiView control. I hope Menu and Treeview support can still be added to the final version of ASP.Net AJAX.

Remco

TreeView Ajax

Hello, I want to use a TreeView with Ajax, i put a TreeView inside a UpdataPanel but no compatibilty, So how to do for using a TreeView in Ajax, thank's.

You can either buy a 3rd party control that uses ajax, hack around with the prerender event, write your own treeview control, or wait around for a future ajax release that may or may not support it.


what do u mean bye hack the prerender


I have heard of some people writing code in the prerender event to handle the maintenance of the tree since it is not supported in update panels (although during the CTPs, it appeared to work well...that is why I mentioned waiting as an option because I heard they may fix it with the next release). We do not do this because we never got it working 100% without errors, and we bought the telerik ASP.NET control suite, which includes a tree with ajax functionality.


Hello, Can I know when the next release of asp.net ajax will appear??


Hi kadben,

You can find the Asp.Net Ajax Future at this url: http://quickstarts.asp.net/Futures/ajax/default.aspx You can down it here: http://www.microsoft.com/downloads/details.aspx?FamilyID=4cb52ea3-9548-4064-8137-09b96af97617&DisplayLang=en

In additional, here is the document for "Changes between the ASP.NET AJAX ("Atlas") CTP and the RTM Releases".

http://ajax.asp.net/documentation/AspNet_AJAX_CTP_to_RTM_Whitepaper.aspx

Hope it helps.

TreeView Ajax

Hello, I want to use a TreeView in a web form, but i want to use ajax, and i can't use it inside a updatepanel, so how i can use a treeview by using ajax.

Hi kadben,

TreeView is not compatible with partial-page updates, and is therefore not supported inside anUpdatePanel control

The following ASP.NET controls are not compatible with partial-page updates, and are therefore not supported inside anUpdatePanel control:

TreeView andMenu controls.

Web Parts controls. For more information, seeASP.NET Web Parts Controls.

FileUpload controls when they are used to upload files as part of an asynchronous postback.

GridView andDetailsView controls when their EnableSortingAndPagingCallbacks property is set totrue. The default isfalse.

Login,PasswordRecovery,ChangePassword, andCreateUserWizard controls whose contents have not been converted to editable templates.

TheSubstitution control.

Validation controls, which includes theBaseCompareValidator,BaseValidator,CompareValidator,CustomValidator,RangeValidator,RegularExpressionValidator,RequiredFieldValidator, andValidationSummary control.

Treeview and beta1

Can I use a Treeview inside UpdatePanel in Beta1?

I need to add/remove nodes from the Treeview, it would be nice to have this handled by the UpdatePanel.

Treeview is not supported in Beta1. I had the same issue.. sorry to deliver the bad news :(

Treeview and HoverMenuExtender

Is there any way to use the HoverMenuExtender with the Treeview? I tried overriding RenderPostText of the treenode and stuffing the extender in, but there's no control collection to stuff it into.

Thanks!

Hi bjpierron,

Unfortunately, I think the answer is no. I was able to get a very, very hacky version to run, but I don't think you'd be able to use it for any real scenarios. I don't think thatTreeView, and specificallyTreeNode, are extensible enough for you to add this support on top. With some really creative CSS you might be able to get the effect you're looking for using theHoverNodeStyle, but that's bout all I can suggest.

If you were interested, here's how I kind of got it not quite working... I created my ownHoverMenuTreeNode class that inherited offTreeNode. I added aPopupControlID property and variable toHoverMenuTreeNode to store the ID of the control to hover. In itsRenderPreText method I then 1) got a reference to the current page viaHttpContext.Current.CurrentHandler as Page, 2) checked the page's controls recursively to make sure a HoverMenuExtender was included (this ensures the necessary script is downloaded to the client) or I throw an exception that you need aHoverMenuExtender on the page when usingHoverMenuTreeNode, 3) got a reference to thepopupControl usingPage.FindControl and thePopupControlID variable, 4) used theHtmlTextWriter to write the start of adiv tag including a random id (I just used a GUID), 5) created a script that when executed did the exact same things as the JavaScript inthis post after a 1000 ms timeout (using the randomly generated ID and thepopupControl.ClientID), and 6) registered the script as a startup script with the page. Then in theRenderPostText I wrote out the end tag of thediv. What we're essentially doing is wrapping theTreeNodein adiv and dynamically hooking up theHoverMenuBehavior to it. This whole thing looks a lot messier than just adding controls to the page, but I couldn't find a way to do that usingTreeNode (as it's not aControl). The reason that this will never work reliably in practice is that we can't run our code to wireup the behavior until the "Atlas" scripts and our HoverMenuBehavior.js have run. This is why I added the timeout on the script to prevent it from running for a second to see if I could get it working... but it's not a safe thing to do in practice. Here's the code:

// WARNING: THIS IS VERY BAD. IT IS PRESENTED FOR LEARNING PURPOSES ONLY.// PLEASE DO NOT USE THIS CODE IN ANY APPLICATION YOU WRITEusing System;using System.Collections.Generic;using System.Web;using System.Web.UI;using System.Web.UI.WebControls;using System.Web.UI.HtmlControls;using AtlasControlToolkit;namespace ToolkitDemo{/// <summary> /// The HoverMenuTreeNode provides HoverMenu support on top of a standard /// TreeNode. You must have a TreeNode extender on your page for this to work. /// </summary>public class HoverMenuTreeNode : TreeNode {/// <summary> /// ID of the control that will display when this node is hovered /// </summary>private string _popupControlID =null;/// <summary> /// ID of the control that will display when this node is hovered /// </summary> [IDReferenceProperty(typeof(Control))]public string PopupControlID {get {return _popupControlID; }set { _popupControlID =value; } }/// <summary> /// Wrap the TreeNode in a div and write a startup script to wireup /// a HoverMenuBehavior to that div to display our the PopupControl /// </summary> /// <param name="writer">Html Writer</param>protected override void RenderPreText(HtmlTextWriter writer) {// Get a reference to the current page Page page = HttpContext.Current.CurrentHandleras Page;if (page ==null)throw new NotSupportedException("HoverMenuTreeNode can only be used in System.Web.UI.Page");// Recursively check to ensure the page contains a hovermenucontrolbool foundExtender =false; Queue controls =new Queue(); controls.Enqueue(page);while (controls.Count > 0) { Control current = controls.Dequeue(); foundExtender = currentis HoverMenuExtender;if (foundExtender)break;foreach (Control ctrlin current.Controls) controls.Enqueue(ctrl); } controls.Clear();if (!foundExtender)throw new NotSupportedException("HoverMenuTreeNode requires a HoverMenuExtender present on the Page");// Get a reference to the PopupControl Control popupControl = page.FindControl(_popupControlID);if (popupControl ==null)throw new NotSupportedException("HoverMenuTreeNode could not find a control with id \"" + _popupControlID + "\"");// Write out the start of the div that wraps the TreeNodestring id = Guid.NewGuid().ToString(); writer.WriteBeginTag("div"); writer.WriteAttribute("id", id); writer.Write(">");// Create a script that dynamically associates a new HoverMenuBehavior // with the id of our new div and the ClientID of the popupControl and // register it as a startup scriptstring script =// Wrap everything in a function to keep things uncluttered"<script>(function() { " +// Wrap the wireup in a function to execute on a timeout"var f = function() {" +"var ctrl = new Sys.UI.Control($('" + id +"')); " +"var behavior = new AtlasControlToolkit.HoverMenuBehavior(); " +"behavior.set_PopupControlID('" + popupControl.ClientID +"'); " +"behavior.set_PopupPosition('Right'); " +"ctrl.get_behaviors().add(behavior); " +"behavior.initialize(); " +"}; " +// Wait 1 second before running the function"window.setTimeout(f, 1000); " +"})();</script>"; page.RegisterStartupScript(id, script);// Write out the TreeNodebase.RenderPreText(writer); }/// <summary> /// Write the end of the div that wraps the TreeNode /// </summary> /// <param name="writer">Html Writer</param>protected override void RenderPostText(HtmlTextWriter writer) {base.RenderPostText(writer); writer.WriteEndTag("div"); } }}

Thanks,
Ted


Could most of this plumbing work be handled in an Adapter (ala the CSSAdapters)? Then you could change the way the actual TreeNode is rendered and then implement HoverTreeView class as a derivative of the normal TreeView which could be targetted by the normal extender stuff.

Hi IDisposable,

Yep, a lot of the plumbing goes away if you inherit from a TreeView. I don't even think you'd need to use an adapter. You could dynamically add theHoverMenuExtender to itsControls collection, etc. I believe you'd still be stuck with the problem of wiring up theTargetControlID of theHoverMenuProperties because it needs to be a server control. Not to mention the larger issue of associating any of the content in yourHoverMenu with a givenTreeNodefor any real functionality, etc. Aside from hacking something very specific together, I doubt you'd be able to make a solid, general purpose solution.

Thanks,
Ted


Has anyone come up with a workable way to do this yet? I played around with adding a HoverMenuExtender to a TreeNode programmatically but quickly found out that the TreeNode does not have an ID that I could access. So, therefore, I didn't have anything to poke into the TargetID property of the HoverMenuExtender.