Home - Forums-.NET - FlyTreeView (ASP.NET) - Unable to access CFlyTreeView object

FlyTreeView (ASP.NET)

Technical support and KB related to the FlyTreeView control

This forum related to following products: FlyTreeView for ASP.NET
Unable to access CFlyTreeView object
Link Posted: 29-Nov-2007 14:45
raghu.dodda avatar
raghu.dodda
Total Posts:0
Joined:11/23/2024
Hi - I have a web-page that I create an instance of the FlyTreeView Control dynamically. Then, I want to write the ClientId into the HTML page, so that I can access the flyTreeView object on the client using the CFlyTreeView.getInstanceById(). But, there is a javascript says the the CFlyTreeView object is not found? I would really appreciate it if you could point out what I am doing wrong? I have uploaded the web-project, but here's the code snippet I have a problem with: Code-Behind ========== public partial class _Default : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { // Create an Instance of the FlyTreeView FlyTreeView f = new FlyTreeView(); // Panel1 is a server control added to the aspx page. Panel1.Controls.Add(f); } } ASPX ==== alert(CFlyTreeView);
Error ==== Microsoft JScript runtime error: 'CFlyTreeView' is undefined
Link Posted: 29-Nov-2007 21:49
EvgenyT avatar
EvgenyT
Total Posts:0
Joined:11/23/2024
The reason of the error is that you place alert(CFlyTreeView) before flytreeview runtime load.

ASP.NET attaches its startup javascripts (including FlyTreeView one) after form load.

Anyway you need to place alert(CFlyTreeView) at the very end of the page.

But best of all is to use the FlyTreeView.OnInitializedJavascript property like this:



And have something like this as a javascript:

function treeviewInitialized(sender)
{
    // sender - is the treeview you need
    alert("TreeView initialized: " + sender);
}
Link Posted: 30-Nov-2007 09:44
raghu.dodda avatar
raghu.dodda
Total Posts:0
Joined:11/23/2024
Evgeny -

Thanks for your response. The thing is that I am using the FlyTreeView control inside an web-part. The idea is that the FlyTreeView instance is created on the server, but all operations happen only in client javascript. Also, we want to wrap the flyTreeView client-side instance inside a JavaScript class. Therefore, I think attaching the javascript event-handler to listen for the tree to finish initialization is not the best approach for me.

For example: Here's what I want to be able to do in JavaScript

// LINE 1
var myHierarchyControl = new HierarchyControl(flyTreeViewClientId);

function HierarchyControl(flyTreeViewInstanceId)
{
    // a private member of this class, not exposed outside.
    var _tree = CFlyTreeView.getInstancebyId(flyTreeViewClientId);
  
    this.AddNode = function()
    {
         // basically all operations on the tree happen through this class.
        _tree.Nodes.Add();
    }
  
    // more methods exposed by the class

}

The questions are:

1)  What is the best way to pass the FlyTreeViewClientId to the javascript.  

2)  Where should I put the code in LINE 1 so that I have access to FlyTreeView object. I need to know if there is a special event I can trap into because I don't have control where that line of code will go (since this is a web-part on a SharePoint portal page).  And, there will be multiple instances of the FlyTreeView on my page. Is there a javascript event I can trap into, when all the FlyTreeView runtime finishes loading completely (as oppossed each instance of the flyTreeView)?

Thanks.
Link Posted: 30-Nov-2007 10:00
EvgenyT avatar
EvgenyT
Total Posts:0
Joined:11/23/2024
[quote="raghu.dodda"]. Also, we want to wrap the flyTreeView client-side instance inside a JavaScript class. Therefore, I think attaching the javascript event-handler to listen for the tree to finish initialization is not the best approach for me.

Anyway, you need to launch your code after CFlyTreeView class is loaded (place your code at the end of your page).

[quote="raghu.dodda"]
For example: Here's what I want to be able to do in JavaScript

// LINE 1
var myHierarchyControl = new HierarchyControl(flyTreeViewClientId);

function HierarchyControl(flyTreeViewInstanceId)
{
    // a private member of this class, not exposed outside.
    var _tree = CFlyTreeView.getInstancebyId(flyTreeViewClientId);
  
    this.AddNode = function()
    {
         // basically all operations on the tree happen through this class.
        _tree.Nodes.Add();
    }

  _tree.Nodes.Add() will not work. FlyTreeView client-side and server side models are not equal.
You can check out client-side one at:
http://www.9rays.net/asp.net_2/treeview/miscpages/doc/ClientObjects.aspx


  
[quote="raghu.dodda"]
1)  What is the best way to pass the FlyTreeViewClientId to the javascript.  

Not sure for your case, but sometimes simple  solves the problem.

[quote="raghu.dodda"]
2)  Where should I put the code in LINE 1 so that I have access to FlyTreeView object. I need to know if there is a special event I can trap into because I don't have control where that line of code will go (since this is a web-part on a SharePoint portal page).

For ajax cases (I mean ASP.NET AJAX UpdatePanel control), you need to place your script after control declaration.
For non-ajax cases you need to place your code at the very end of your page (or use Page.ClientScript.RegisterStartupScript(...) at PreRenderComplete stage).


[quote="raghu.dodda"]
  And, there will be multiple instances of the FlyTreeView on my page. Is there a javascript event I can trap into, when all the FlyTreeView runtime finishes loading completely (as oppossed each instance of the flyTreeView)?

No way. FlyTreeView does not know anything regarding other instances on the page. They are isolated from each other because of AJAX UpdatePanel control support (there can be different number of instances of FlyTreeView at the same page depending on UpdatePanel state).

Anyway, I believe a solution can be found since FlyTreeView keeps internal array of all instances loaded into page (including instances already unloaded by UpdatePanel partial update).
Link Posted: 05-Dec-2007 12:39
raghu.dodda avatar
raghu.dodda
Total Posts:0
Joined:11/23/2024
Evgeny -

Thanks for the input. We got to the point where I have a JavaScript object encapsulating the FlyTreeView object. But, now we are unable to figure out how to hook handlers to the FlyTreeView client events. We want to be able to be able to create the hooks in Javascript. Is this possible?

var myHierarchyControl = new HierarchyControl(flyTreeViewClientId);

function HierarchyControl(flyTreeViewInstanceId)
{
// a private member of this class, not exposed outside.
var _tree = CFlyTreeView.getInstancebyId(flyTreeViewClientId);

var onNodeEventHandler = function( sender, node, eventType)
{
   // handle the tree events.
}

// Hook the handler to the event. Don't want to do this on the server.
// What should go here? Something like:
// _tree.AddHandler('OnNodeEventJavascript', this.onNodeEventHandler)
}

Thanks.
Link Posted: 05-Dec-2007 12:45
EvgenyT avatar
EvgenyT
Total Posts:0
Joined:11/23/2024
You can do the following:
1. Declare some handler at server side:
OnNodeEventJavascript="genericHandler"

2. Use it as a wrapper.

var _actualHandler;
function genericHandler(...)
{
    if (_actualHandler)
    {
        _actualHandler(...);
    }
}



So you can just set _actualHandler to required value.
Link Posted: 06-Dec-2007 06:22
raghu.dodda avatar
raghu.dodda
Total Posts:0
Joined:11/23/2024
Evgeny -

We considered that approach, but it has a few kinks. Perhaps you can answer some of these questions:

function HierarchyControl(flyTreeViewInstanceId)
{

var self = this;

// a private member of this class, not exposed outside.
var _tree = CFlyTreeView.getInstancebyId(flyTreeViewClientId);

//expando property for the tree
_tree.managingInstance = self;


var onNodeEventHandler = function(node, eventType)
{ // handle the tree events. }

}

var myInstance = new HierarchyControl('ctl06'); //the FlyTreeView Control Id.

var UtlityClass = {};

//Issue1: I want this line to be UtilityClass.FlyTreeViewOnNodeEventListener = the function
// But the server side OnNodeEventJavascript="UtilityClass.FlyTreeViewOnNodeEventListener"
// does not work. The handler needs to outside of any class.
FlyTreeViewOnNodeEventListener(sender, node, eventType)
{
  //Issue 2: The sender does not have the managingInstance expando property here.
  sender.managingInstance.onNodeEventListener(node, eventType)
}

Any insights are greatly appreciated. Thanks.
Link Posted: 06-Dec-2007 06:42
EvgenyT avatar
EvgenyT
Total Posts:0
Joined:11/23/2024
For the issue 1
You can try to add parameters to OnNodeEventJavascript:
OnNodeEventJavascript="UtilityClass.FlyTreeViewOnNodeEventListener(sameparameters)" ;
In this case, FlyTreeView will try to eval the code instead of executing function reference.


For issue 2, you need to check whether your HierarchyControl "constructor" executed correctly.
And you have same flytreeview instances (you can use global variables to debug).

FlyTreeView does not clear any expando attributes itself.
Share:

Company  |  Privacy  |  Legal Information

© 1999-2024 9Rays.Net. All rights reserved.