PDA

View Full Version : [CLOSED] Refresh parent Tree from child



posser
Feb 26, 2014, 10:09 PM
I've a viewport built in code behind that render tabs holding other child page. I would like to refresh my tree in the parent page. I was taking a look at this example http://examples2.ext.net/#/TreePanel/Basic/Refresh_Static_Tree/, but I still have doubts.

Bellow are my two pages, first the parent:



<%@ Page Language="C#" %>

<%@ Import Namespace="Panel=Ext.Net.Panel" %>

<%@ Register assembly="Ext.Net" namespace="Ext.Net" tagprefix="ext" %>

<script type='text/javascript'>
var addTab = function (tabPanel, record) {
var text = record.data.text, tab = tabPanel.getComponent(text);
if (!tab) {
tab = tabPanel.add({
id: text,
title: text,
closable: true,
loader: {
url: record.data.url,
renderer: 'frame',
loadMask: {
showMask: true,
msg: 'Loading ' + text + '...'
}
}
});
}
tabPanel.setActiveTab(tab);
};
</script>"

<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
// Center Region
TabPanel center = new TabPanel
{
ID = "TabPanel1",
Region = Region.Center
};



// West Region
Panel west = new Panel
{
Region = Region.West,
Width = Unit.Pixel(225),
Layout = "AccordionLayout",
MinWidth = 225,
MaxWidth = 400,
Split = true,
Collapsible = true
};

west.Items.Add(renderTree());

// Viewport
Viewport viewport = new Viewport
{
Layout = "BorderLayout",
Items =
{
center,
west
}
};

// Add Viewport to Page
this.Controls.Add(viewport);

}

protected Ext.Net.TreePanel renderTree()
{
Ext.Net.TreePanel tree = new Ext.Net.TreePanel
{
ID = "myTree", AutoRender = true
};

tree.Fields.Add(new ModelField("url"));

Node rootNode = new Node { Text = "ROOT", Expanded = true };
for (int i = 0; i < 10; i++)
{
Ext.Net.Node node = new Ext.Net.Node();
node.Text = DateTime.Now.Second + "_" + i;
node.Leaf = true;
node.CustomAttributes.Add(new ConfigItem("url", "webform2.aspx", ParameterMode.Value));
rootNode.Children.Add(node);
}

tree.Listeners.ItemClick.Handler = "if(record.data.leaf){addTab(App.TabPanel1, record);}";
tree.Root.Add(rootNode);

return tree;
}
</script>

<!DOCTYPE html>

<html>
<head id="Head1" runat="server">
<title>Viewport with BorderLayout - Ext.NET Examples</title>
</head>
<body>
<ext:ResourceManager ID="ResourceManager1" runat="server" />
</body>
</html>


And the child page:



<%@ Page Language="C#" %>

<%@ Import Namespace="Panel=Ext.Net.Panel" %>

<%@ Register assembly="Ext.Net" namespace="Ext.Net" tagprefix="ext" %>

<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
// Center Region
TabPanel center = new TabPanel
{
ID = "TabPanel1",
Region = Region.Center
};

Ext.Net.Button btn = new Ext.Net.Button { Text = "add tree node", Icon = Icon.Add });
btn.DirectEvents.Click.Event += new ComponentDirectEvent.DirectEventHandler(Click_Even t);
btn.DirectEvents.Click.ExtraParams.Add(new Ext.Net.Parameter("ChildAttr", "HelloFromChild", ParameterMode.Auto));
Toolbar tb = new Toolbar();
tb.Items.Add(btn);
center.TopBar.Add(tb);

// Viewport
Viewport viewport = new Viewport
{
Layout = "BorderLayout",
Items =
{
center
}
};

// Add Viewport to Page
this.Controls.Add(viewport);

}

void Click_Event(object sender, DirectEventArgs e)
{
//insert new node from here...
}
</script>

<!DOCTYPE html>

<html>
<head id="Head1" runat="server">
<title>Viewport with BorderLayout - Ext.NET Examples</title>
</head>
<body>
<ext:ResourceManager ID="ResourceManager1" runat="server" />
</body>
</html>


Thank in advance.

Daniil
Feb 27, 2014, 4:30 AM
Hi @posser,

The only way to access a parent page from its child page is via a "parent" reference in JavaScript. The "parent" is a reference for the window object of the parent page.


parent.addNodeFunction();

parent.App.TreePanel1...