Noob question - Content panel + setUrl

[Tsukasa1105]

Hi all,

I am trying to load an html page (its just the Grid ext example) into a BorderLayout, and I am not quite sure what I am doing wrong. After I initially set up the areas, I use setUrl()... it sits there at the loading screen forever. Firebug reports no problems, and the update manager reports '0' as response.status and 'undefined' as response.Text. I have verified the url is correct.

What other steps should I take to solve this problem? I can paste code if it would help..

[liggett78]

Sure, go ahead and paste the code.

[jsakalos]

Hi all,

I am trying to load an html page (its just the Grid ext example) into a BorderLayout, and I am not quite sure what I am doing wrong. After I initially set up the areas, I use setUrl()... it sits there at the loading screen forever. Firebug reports no problems, and the update manager reports '0' as response.status and 'undefined' as response.Text. I have verified the url is correct.

What other steps should I take to solve this problem? I can paste code if it would help..

Have you checked if anything comes from the server?

[Tsukasa1105]

This is done locally, so there is no server.



Ext.onReady( function()
{

var layout = new Ext.BorderLayout(document.body, {
hideOnLayout: true,
north: {
initialSize: 25,
titlebar: false
},
west: {
split:true,
initialSize: 200,
minSize: 175,
maxSize: 400,
titlebar: true,
collapsible: true
},
east: {
split:true,
initialSize: 202,
minSize: 175,
maxSize: 400,
titlebar: true,
collapsible: true
},
south: {
split:true,
initialSize: 100,
minSize: 100,
maxSize: 200,
titlebar: true,
collapsible: true
},
center: {
titlebar: true,
autoScroll:true
}
});

// shorthand
var CP = Ext.ContentPanel;
var center1 = new CP("center1", {title: "Close Me", closable: true});

layout.beginUpdate();
layout.add("north", new CP("north", "North"));
layout.add("south", new CP("south", {title: "South", closable: true}));
layout.add("west", new CP("west", {title: "West"}));
layout.add("east", new CP("autoTabs", {title: "Auto Tabs", closable: true}));
layout.add("center", center1);
layout.add("center", new CP("center2", {title: "Center Panel", closable: false}));
layout.getRegion("center").showPanel("center1");
layout.endUpdate();

center1.getUpdateManager().on('failure',
function(el, response) {
Ext.Msg.alert('Connection Error', 'status: '+ response.status +'<br>text: '+ response.Text)
}, this);

center1.setUrl("test.html");

});

[Animal]

You have to have a server to have setUrl do anything. It makes an XMLHttpRequest.

[tryanDLS]

There has to be a server (e.g localhost) - you can't make an ajax request to the local file system.

[immu2k1]

Hi Folks,

I'm seeing the same issue, but I am running on a server. I basically have a 3 paneld ComplexLayout, where based on a click on a tree on the left I would like to display a url in the center pane.

Below are the relevant snippets from the js's:

tree.js (left pane):


var tree = new Ext.tree.TreePanel(el);
var p = new Ext.data.HttpProxy({url:urlPar});
p.on("loadexception", function(o, response, e)
{
if(e) throw e;
});
p.load(null, {
read: function(response)
{
var doc = response.responseXML;
// document.writeln(doc);
tree.setRootNode(treeNodeFromXml(doc.documentElement || doc));
tree.on('click', showProject, this);
}
}, callback || tree.render, tree);


...and function showProject is simple:

function showProject(node)
{
// document.writeln("aaa:" + node.id);

Base.toggleEast(node.id);
centerPanel.loadProject(node.id);
}


From the above, the east toggle works perfectly. The loadProject function is also definitely being hit. This function sits in a separate js file below:

center.js (center pane):


var centerPanel = function()
{
return {

init : function()
{
center1ContentPanel.setContent("aaa");
},

loadProject : function(nodeId)
{

center1ContentPanel.getUpdateManager().on('failure',
function(el, response) {
Ext.Msg.alert('Connection Error', 'status: '+ response.status +'<br>text: '+ response.Text)
}, this);

// center1ContentPanel.setContent(nodeId);
center1ContentPanel.setUrl('http://[baesurl].com:8080/portal/test.html', {scripts: true}, true);
center1ContentPanel.refresh();
}

}
}();



When I comment out the setUrl and refresh lines, the setContent works perfectly fine. When I comment uncomment only setUrl (refresh and setContent commented out) nothing happens in the center pane. It continues to display previous data. Firebug throws no errors or warnings. When I add refresh (as displayed above) after setUrl, I get the below error:

Exception... "'Permission denied to call method XMLHttpRequest.open' when calling method: [nsIDOMEventListener::handleEvent]" nsresult: "0x8057001e (NS_ERROR_XPC_JS_THREW_STRING)" location: "<unknown>" data: no

Any ideas what I'm doing wrong?

Thanks

[fay]

Have you tried load() instead of setURL():


center1ContentPanel.load({url: 'http://[baesurl].com:8080/portal/test.html', scripts: true, text: "Loading..."});

No need to call refresh() after.

[immu2k1]

Hi fay,

Seeing this error with .load:
[Exception... "'Permission denied to call method XMLHttpRequest.open' when calling method: [nsIDOMEventListener::handleEvent]" nsresult: "0x8057001e (NS_ERROR_XPC_JS_THREW_STRING)" location: "<unknown>" data: no]

[tryanDLS]

You can't load from an url that's different than the one your page is running in.

[immu2k1]

My app is running in the same url. My main page is on:
http://[baesurl].com:8080/portal/index.html

The page I want to load in my center panel is on:
'http://[baesurl].com:8080/portal/test.html

[immu2k1]

D'oh!! ContentPanel's .load actually worked for me - had a typo in the url =;

Strangely though, I'm wondering why the regular setUrl wouldn't work?

[trowa]

For security reason, XMLhttp not allow you load files by cross host .
so you can't use full url to locate your files ,
ex:
url:'http://xxxxx/abc/x.xml'--->X
url:'/abc/x.xml'--->O




Have you tried load() instead of setURL():


center1ContentPanel.load({url: 'http://[baesurl].com:8080/portal/test.html', scripts: true, text: "Loading..."});

No need to call refresh() after.

[tvborda]

Hi, i'm new on ExtJs and today I face this problem. I have a ContentPanel and want to use it as a frame on my app. If someone clicks on the menu i want to load another html and insert it on this ContentPanel.
This html that i want to load is localy storage not on a server. I just read that using setUrl is not possible, so how is possible ?

[jsakalos]

Hi, i'm new on ExtJs and today I face this problem. I have a ContentPanel and want to use it as a frame on my app. If someone clicks on the menu i want to load another html and insert it on this ContentPanel.
This html that i want to load is localy storage not on a server. I just read that using setUrl is not possible, so how is possible ?

You cannot access local files from javascript so the answer is: It's not possible.