Showing posts with label placed. Show all posts
Showing posts with label placed. Show all posts

Wednesday, March 28, 2012

TreeView and UpdatePanel

Hi:

I am experimenting with TreeView in ASP.NET 2.0 and ATLAS.

I have placed a simple TreeView inside an UpdatePanel, and populated it from an XML file as follows:

   <asp:TreeView ID="tvSysMgtNavigation" ExpandDepth="0" runat="server"> <DataBindings> <asp:TreeNodeBinding DataMember="Item" TextField="Name" SelectAction="None" /> <asp:TreeNodeBinding DataMember="ItemLine" TextField="Name" /> </DataBindings> </asp:TreeView> <asp:XmlDataSource ID="XmlDataSource1" runat="server" DataFile="~/App_Include/Management.xml" />

So, when the TreeView Loads inside the UpdatePanel, only the root is show to be expanded. When I click on the "plus" near the root, I get this javascript exception:

Microsoft JScript runtime error: Object expected

and Visual Studio 2005 show the exception at:

TreeView_PopulateNode(ctl00_tvSysMgtNavigation_Data,0,ctl00_tvSysMgtNavigationn0,ctl00_tvSysMgtNavigationt0,ctl00_tvSysMgtNavigationt0i,' ','Management','Management','t','/*[position()=1]','t')

Is there any known confusion between the ClientCallBack done by the TreeView and ATLAS?

regards

Update:

The problem seems to exist only when ExpandDepth= "0", if I place a number greater then 0, like 1 or 2, etc ... it works fine without any problem.

So the TreeView_PopulateNode is missing an object when it strats expanding form the top root.

This problem is not encountered when the TreeView is outside the UpdatePanel.

Thanks,


Did you test with Mode=Always?

<

atlas:UpdatePanelID="UpdatePanel1"runat="server"Mode="Always">

Same problem, now I am getting an exception at the end of the method, last line:

function TreeView_PopulateNode(data, index, node, selectNode, selectImageNode, lineType, text, path, databound, datapath, parentIsLast) {
var context = new Object();
context.data = data;
context.node = node;
context.selectNode = selectNode;
context.selectImageNode = selectImageNode;
context.lineType = lineType;
context.index = index;
context.isChecked = "f";
var tr = WebForm_GetParentByTagName(node, "TR");
if (tr) {
var checkbox = tr.getElementsByTagName("INPUT");
if (checkbox && (checkbox.length > 0)) {
for (var i = 0; i < checkbox.length; i++) {
if (checkbox[i].type.toLowerCase() == "checkbox") {
if (checkbox[i].checked) {
context.isChecked = "t";
}
break;
}
}
}
}
var param = index + "|" + data.lastIndex + "|" + databound + context.isChecked + parentIsLast + "|" +
text.length + "|" + text + datapath.length + "|" + datapath + path;
TreeView_PopulateNodeDoCallBack(context, param);
}

The problem is with CallBack that TreeView does to populate ondemand. But the question, why only when the ExpandDepth is 0, I get such an exception!!!

Regards


Hi:

As you all know, TreeView has a property called ExpandNodesFromClient, that is when set TRUE together with PopulateOnDemand, then once a node is clicked, a client-callback is generated to expand the children of a specific node.

Believe or not, I got an idea while I was sleeping last night. The idea is that, since I have the TreeView in an UpdatePanel, so an asynchronous request will be sent, why do I have to enable PopulateNodesFromClient? There is no use in fact to do so, since in all cases, an asynchronous request will be generated.

So once I set the PopulateNodesFromClient to FALSE, it seems to work fine.

I guess there is no better solution for this case.

Hope you will benefit from this experienceSmile [:)].

Regards


Hi Haidar,

Do u have solution for a setting the scrolling bar to its initial position. Actually the scroll bar reset to zero all the time.

Here is my code : --

<

bodyonload="document.getElementById('TreePanel').scrollTop = document.getElementById('divscroll').value">
<atlas:ScriptManagerrunat="server"ID="ScpMgr"EnablePartialRendering="true"/>

<formid="thisFrm"runat="server">

..........

<inputtype="hidden"id="divscroll"runat="server"/>

<atlas:UpdatePanelID="TreeUpdtPanel"runat="server"RenderMode="Inline"Mode="Conditional">

<ContentTemplate>

<divid="TreePanel"onscroll="document.getElementById('divscroll').value = this.scrollTop;"runat="server"onclick="document.getElementById('divscroll').value = this.scrollTop;"Class="PageTable PanelTree"onprerender="document.getElementById('TreePanel').scrollTop = document.getElementById('divscroll').value">

<asp:TreeViewID="TreeHCR"runat="server"DataSourceID="HCRXML"OnSelectedNodeChanged="TreeHCR_SelectedNodeChanged"ShowLines="True"ExpandDepth="1"ShowExpandCollapse="true">

<DataBindings>

.....

</DataBindings>
......

</asp:TreeView>

</div>

</ContentTemplate>

<Triggers>

<atlas:ControlEventTriggerControlID="RepeaterSearchResults"EventName="ItemCommand"/>

</Triggers>

</atlas:UpdatePanel>

.............

</form>
</body>
</html>

I m trying to implement to set the pos to the values saved in the hidden box ...but its not working in Atlas.
Any idea how to put the values when the tree refreshed ...


Hello:

I guess couldn't understand you well, can you illustrate more on the problem please?

Thanks,


Hi,

just to avoid a thread duplication, I've answered the same questionhere.

Hello,

Just thought I should share this..

I also had a problem with TreeView control and it took me a while to find this thread..

I have a TreeView with several TreeNodes and each one has several ChildNodes with PopulateNodesFromClient set to True.

The error I was getting is the same "Objected Expected" JavaScript error and I ran out of luck until I found this thread and tried setting ExpandDepth to 0 or 1... Now the TreeView works just fine. FYI, without setting ExpandDepth, the property is set to -1.


Thanks.
-Moe

Saturday, March 24, 2012

Triggering un UpdatePanel update event from TreeView

Hi!

I have a master page with a TreeView, which is filled from a SiteMapDataSource. I have added an UpdatePanel, inside which i have placed a ContentPlaceholder. I have created an AsyncPostBackTrigger which looks like this:

<asp:AsyncPostBackTrigger ControlID="NavigationTreeView" EventName="SelectedNodeChanged" /
The problem is that the postback is still executed everytime i click on a node,making the UpdatePanel useless.

I have tried disabling treeview postbacks, by changing the Node.Text to <span onclick='return false;'>" + tempNodeLabel + "</span>";
But in this case, the SelectedNodeChanged event does not happen.

What i want in a nutshell is to make the content of a page update without fully reloading the page,while using TreeView as a trigger.

I have heard that TreeView doesn't support partial page updates.

Can anyone suggest how can i make treeview support it or how to disable postbacks while leaving SelectedNodeChanged event,or how can i achieve the desired result in any other manner?

Can anyone help please?

I'm using the treeview triggering/updating other updatepanels this way:

1. The treeview is in an updatepanel and there is the same asyncpostbacktrigger as your inthat updatepanel.

2. I handle theSelectedNodeChanged event in code behind, and update the necessary updatepanels with theupdate( ) method.

Step 1. is not supported officially.

The treeview "may works" inside the up, but very buggy and has strange/unexpected behavior, prepare for some surprise...Smile


Thank you for an adviceSmile

But i'm a bit confused. The SelectedNodeChanged event happens only if the navigateurl property of a node is blank. In this case, how do i pass the URL which has to be shown to the UpdatePanel?


Ok, i've placed the TreeView inside an UpdatePanel and postbacks don't happen as long as the navigateurl property is blank. The only thing i don't get is how to let the UpdatePanel know about the url's it has to show.

Each treenodebinding has a valuefield property (This value is not displayed to the user it's hidden on the page.).

If you set it then you can retrive the value in the code-behind:

YourTreeView.SelectedNode.Value --> the selected node value property.

YourTreeView.SelectedNode.ValuePath --> each node value separated by the treeview PathSeparator from the root to the selected node.


Thank you

I have thought about this. But what i really don't understand is how to tell the updatepanel, which hosts the ContentPlaceHolder what to load.

On the SelectedNodeChanged event, i get the url from the Value field, and then what? To whom should i pass that url?


Sorry, but you cannot use up that way. The up won't load a content from an url (from a different aspx) page.


You may have tried this already and are looking for an alternate way, but this is surely a case for an iframe..

Add an iframe to the page ( don't see why you can't place this inside your updatepanel) and set the selected url to the 'src' attribute of the iframe. This will then load the target content into the iframe, and the update panel should allow you to control the partial postback (not sure if you will need it as the postback from the iframe will be containted within it's own page).


Thank you both for the helpSmile

My boss has told me today that what i'm trying to do is a wrong way to use AJAX, so i guess that this issue is resolved. The idea with an iframe is good thoughSmile


Hi,

Here 's what I do:

1. The "leaf" nodes are calling javascript function that updates a HiddenField.

2. The Grid is inside a UpdatePanel and has a Trigger on the HiddenField ValueChanged event.

To activate the HiddenField trigger, I call _doPostBack('hiddenfield_name', ''); at the end of the javascript function...

Hope it helps,

Michel


Hi,

Hmm..i'm not too good at javascript. If i get it right, what you are suggesting is a way to update a gridview e.g. make it show another category. I have managed to do that but with datalist in my case. I just put an index of a category inside the Value field of a treenode, and leave the navigateurl blank. On page_load event i check which node is selected and if something is selected a read it's Value field and then call a function which retrieves content from the database, depending on the fetched index.

What i was trying to do was to load a completely different page with another set of controls via UpdatePanel. But as far as i understood you can't do that (well maybe if you use an iframe you can)Smile


Then maybe the "update panel" is not ideal to load a different page.

If the tree is in a "master page", you could use a simple hyperlink to load a different "content page"...

Sorry, I got mixed-up by the thread subject.