PDA

View Full Version : Ajax request



ConnorStr
23 Aug 2009, 4:23 PM
I can't seem to figure it out, I am trying to run an ajax request upon every request or every min, is there any way to do this?

here is what I have so far:


Ext.Ajax.on('beforerequest', {
url: '/security.php?check=session',
method: 'GET',
success: function(){
console.log('Session Check Success');
},
failure: function(form, action) {
if(action.failureType == 'server'){
obj = Ext.util.JSON.decode(action.response.responseText);
Ext.Msg.alert('Session Check Failed', obj.errors.reason);
var redirect = '/action.php?op=logout';
window.location = redirect;
}else{
obj = Ext.util.JSON.decode(action.response.responseText);
Ext.Msg.alert('Session Check Failed', obj.errors.reason);
var redirect = '/action.php?op=logout';
window.location = redirect;
}
console.log('Session Check Fail');
}
});

mjlecomte
23 Aug 2009, 5:35 PM
do you just want to check if the user is authenticated? Your approach seems expensive. Why not just send the appropriate response back with your "main" ajax request? You can send back "success":false or send back some HTTP status and listen to the response globally with class level observability:

http://extjs.com/forum/showthread.php?p=258424#post258424

ConnorStr
23 Aug 2009, 5:38 PM
do you just want to check if the user is authenticated? Your approach seems expensive. Why not just send the appropriate response back with your "main" ajax request? You can send back "success":false or send back some HTTP status and listen to the response globally with class level observability:

http://extjs.com/forum/showthread.php?p=258424#post258424
What I am doing is checking with the php script to make sure the user is still in the database so that if I were to delete the user it would log them out. Since this is going to be the administration system to my network I need this functionality.

mjlecomte
23 Aug 2009, 5:47 PM
Please elaborate or be more specific what you're trying to do, you'll get a more appropriate suggestion to your needs that way.

I don't quite get why you require two ajax requests.

As to your prior code it looks like your code is incorrect for "on". You'll want to provide a function to run, not an object literal.

ConnorStr
23 Aug 2009, 5:54 PM
Please elaborate or be more specific what you're trying to do, you'll get a more appropriate suggestion to your needs that way.

I don't quite get why you require two ajax requests.

As to your prior code it looks like your code is incorrect for "on". You'll want to provide a function to run, not an object literal.

My login script is:
Login.js

Ext.onReady(function(){
Ext.QuickTips.init();

// Create a variable to hold our EXT Form Panel.
// Assign various config options as seen.
var login = new Ext.FormPanel({
labelWidth:80,
url:'/action.php?op=login',
frame:true,
title:'SoldiersNet Staff Login',
defaultType:'textfield',
monitorValid:true,
// Specific attributes for the text fields for username / password.
// The "name" attribute defines the name of variables sent to the server.
items:[{
fieldLabel:'Email',
name:'loginEmail',
allowBlank:false
},{
fieldLabel:'Password',
name:'loginPassword',
inputType:'password',
allowBlank:false
}],

// All the magic happens after the user clicks the button
buttons:[{
text:'Login',
formBind: true,
// Function that fires when user clicks the button
handler:function(){
login.getForm().submit({
method:'POST',
waitTitle:'Please Wait...',
waitMsg:'Validating Credentials...',

// Functions that fire (success or failure) when the server responds.
// The one that executes is determined by the
// response that comes from login.asp as seen below. The server would
// actually respond with valid JSON,
// something like: response.write "{ success: true}" or
// response.write "{ success: false, errors: { reason: 'Login failed. Try again.' }}"
// depending on the logic contained within your server script.
// If a success occurs, the user is notified with an alert messagebox,
// and when they click "OK", they are redirected to whatever page
// you define as redirect.

success:function(){
var redirect = '/';
window.location = redirect;
},

// Failure function, see comment above re: success and failure.
// You can see here, if login fails, it throws a messagebox
// at the user telling him / her as much.

failure:function(form, action){
if(action.failureType == 'server'){
obj = Ext.util.JSON.decode(action.response.responseText);
Ext.Msg.alert('Login Failed!', obj.errors.reason);
}else{
Ext.Msg.alert('Warning!', 'Authentication server is unreachable : ' + action.response.responseText);
}
login.getForm().reset();
}
});
}
}]
});


// This just creates a window to wrap the login form.
// The login object is passed to the items collection.
var win = new Ext.Window({
layout:'fit',
width:300,
height:150,
shadow: true,
closable: false,
resizable: false,
plain: false,
border: false,
items: [login]
});
win.show();
});
now my desktop.php which includes all my other js is:

<?PHP
define("__SNSD", true);
include 'common.php';
header("content-type: application/x-javascript");
?>
// Security check configuration
// Session check
//MyDesktop = new Ext.Ajax.on('beforerequest', {
// url: '/security.php?check=session',
// method: 'GET',
// success: function(){
// console.log('Session Check Success');
// },
// failure: function(form, action) {
// if(action.failureType == 'server'){
// obj = Ext.util.JSON.decode(action.response.responseText);
// Ext.Msg.alert('Session Check Failed', obj.errors.reason);
// var redirect = '/action.php?op=logout';
// window.location = redirect;
// }else{
// obj = Ext.util.JSON.decode(action.response.responseText);
// Ext.Msg.alert('Session Check Failed', obj.errors.reason);
// var redirect = '/action.php?op=logout';
// window.location = redirect;
// }
// console.log('Session Check Fail');
// }
//});
// Sample desktop configuration
MyDesktop = new Ext.app.App({
init :function(){
Ext.QuickTips.init();
},

getModules : function(){
return [
new MyDesktop.GridWindow(),
new MyDesktop.TabWindow(),
new MyDesktop.AccordionWindow(),
new MyDesktop.BogusMenuModule(),
new MyDesktop.BogusModule(),
new MyDesktop.AllPrograms()
];
},
// config for the start menu
getStartConfig : function(){
return {
title: '<?=$RfullName ?>',
iconCls: 'user',
toolItems: [{
text:'My Settings',
iconCls:'settings',
handler : this.createWindow,
scope: this,
windowId: 'settings-win'
},'-',{
text:'Logout',
iconCls:'logout',
scope:this

}]
};
}
});
/*
* Made Windows
*/
SetWindow = Ext.extend(Ext.app.Module,{
id:'settings-win',
init : function(){
this.launcher = {
text: 'My Settings',
iconCls:'settings',
handler : this.createWindow,
scope: this
}
},

createWindow : function(){
var desktop = this.app.getDesktop();
var win = desktop.getWindow('settings-win');
if(!win){
win = desktop.createWindow({
id: 'settings-win',
title:'My Settings',
width:740,
height:480,
iconCls: 'settings',
shim:false,
animCollapse:false,
constrainHeader:true,

layout: 'fit',
items:
new Ext.TabPanel({
activeTab:0,

items: [{
title: 'Tab Text 1',
header:false,
html : '<p>Something useful would be in here.</p>',
border:false
},{
title: 'Tab Text 2',
header:false,
html : '<p>Something useful would be in here.</p>',
border:false
}]
})
});
}
win.show();
}
});

MyDesktop.Programs = Ext.extend(Ext.app.Module, {
init : function(){
this.launcher = {
text: 'Window '+(++windowIndex),
iconCls:'bogus',
handler : this.createWindow,
scope: this,
windowId:windowIndex
}
},

createWindow : function(src){
var desktop = this.app.getDesktop();
var win = desktop.getWindow('bogus'+src.windowId);
if(!win){
win = desktop.createWindow({
id: 'bogus'+src.windowId,
title:src.text,
width:640,
height:480,
html : '<p>Something useful would be in here.</p>',
iconCls: 'bogus',
shim:false,
animCollapse:false,
constrainHeader:true
});
}
win.show();
}
});

/*
* Made Menus
*/
MyDesktop.AllPrograms = Ext.extend(MyDesktop.Programs, {
init : function(){
this.launcher = {
text: 'All Programs',
iconCls: 'bogus',
handler: function() {
return false;
},
menu: {
items:[{
text: 'Billing',
iconCls:'bogus',
handler : this.createWindow,
scope: this,
windowId: 'billing-win'
},{
text: 'Support',
iconCls:'bogus',
handler : this.createWindow,
scope: this,
windowId: 'support-win'
},{
text: 'Server',
iconCls:'bogus',
handler : this.createWindow,
scope: this,
windowId: 'server-win'
}]
}
}
}
});
How can I make the Login.js check every so often?

ConnorStr
23 Aug 2009, 5:55 PM
This is also my first javascript application which is why I am using other peoples login form and such.

Animal
23 Aug 2009, 9:29 PM
Why not use a TaskRunner to ping the server every minute if you really require that?

Performing an Ajax request on every Ajax request will cause an inifinite loop.

ConnorStr
23 Aug 2009, 9:42 PM
Why not use a TaskRunner to ping the server every minute if you really require that?

Performing an Ajax request on every Ajax request will cause an inifinite loop.
What is the best way to do this via a task, or how can I call a php script via the task?



var session_check = {
run: function(){
// Where or how would I check the php page?
},
interval: 1000*60 //1 min
}
Ext.TaskMgr.start(session_check);

ConnorStr
24 Aug 2009, 3:28 AM
Ok, so I started this is what I have so far but its not getting a response:

security.js


var task = {
run: function(){
Ext.Ajax.request({
url: 'security.php?check=session',
success: function() {
var obj = Ext.decode(response.responseText);
console.dir(obj);
},
failure: function(response, opts) {
console.log('server-side failure with status code ' + response.status);
var redirect = '/action.php?op=logout';
window.location = redirect;
}
});
},
interval: 1000 //*60 //1 second
}
Ext.TaskMgr.start(task);
security.php


$_dc=$_REQUEST['_dc'];
if($db->query("SELECT * FROM users WHERE id='".$_SESSION['uid']."' AND password")>1){
$result["success"] = true;
}else{
$result["success"] = false;
$result["errors"]["reason"] = "Session Check, Failed.";
}
echo json_encode($result);




interval: 1000 //*60 //1 second
is to speed up the requests so that I can see what it is doing.

Animal
24 Aug 2009, 3:50 AM
not getting a response? 404 or what? are you debugging?

24 Aug 2009, 3:51 AM
The problem with this approach is there could be a collision with asynchronous requests! You need to have a much better system than this. What happens if the server takes > 60 seconds to respond? Should you cancel the request? Should you wait until it completes?

ConnorStr
24 Aug 2009, 3:54 AM
Params:


_dc1251114400162
check session
Headers:


Response Headers
DateMon, 24 Aug 2009 11:47:11 GMTServerApache/2.2.11 (Unix) mod_ssl/2.2.11 OpenSSL/0.9.7a mod_auth_passthrough/2.1 mod_bwlimited/1.4 FrontPage/5.0.2.2635 PHP/5.2.6X-Powered-ByPHP/5.2.6Content-Length0Keep-Alivetimeout=5, max=8ConnectionKeep-AliveContent-Typetext/htmlRequest Headers
Hoststaff.soldiersnet.netUser-AgentMozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.9.1.2) Gecko/20090729 Firefox/3.5.2 (.NET CLR 3.5.30729)Accepttext/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8Accept-Languageen-us,en;q=0.5Accept-Encodinggzip,deflateAccept-CharsetISO-8859-1,utf-8;q=0.7,*;q=0.7Keep-Alive300Connectionkeep-aliveX-Requested-WithXMLHttpRequestRefererhttp://staff.soldiersnet.net/CookiePHPSESSID=9bd76a6daa9927963ce9b1ebb6b1b89c; logintheme=cpanel; cprelogin=no; cpsession=closedResponse:


Blank

ConnorStr
24 Aug 2009, 3:55 AM
The problem with this approach is there could be a collision with asynchronous requests! You need to have a much better system than this. What happens if the server takes > 60 seconds to respond? Should you cancel the request? Should you wait until it completes?
What is the best way to do this?

mjlecomte
25 Aug 2009, 4:25 PM
Have you done a forum search? There's a few old lengthy threads about your topic. I'm not pawning off your question, but there's a few old threads that had several responses etc and would be more complete than what you'll get here.

ckr
25 Aug 2009, 4:44 PM
This seems like an application design issue.

Why not have the server validate every action after login? I mean they are logged in, and now they want to do something. So they click, type, whatever, and the new action/request goes to the server. Have the server check at that time whether or not they are a valid user. Would be less overhead than continually pinging the server, and they could not do anything as long as you were always checking whether or not the user is valid before each intended action.

Or setup an independent long poll to the server, that raises an event to log out if the server does not respond with an OK or if it times out without a response. You could do this without coupling this to your normal AJAX requests.

Again, seems like a design issue from what little I know.

ConnorStr
25 Aug 2009, 8:00 PM
using a poll, how would I return a success or fail of the check with my php script?

hendricd
26 Aug 2009, 7:37 AM
@ConnorStr -- There is a simpler way, and many already employ this method using the ext-basex adapter extension (see my sig below).

It intercepts every Ajax response and traps one or more HTTP status codes of your choice, that your server might send back to indicate a session violation etc.

You would need only define a single listener:

onStatus/unStatus Event methods. Specific HTTP Status codes may be trapped via cancelable eventListeners.

Returning false from an onStatus Handler prevents further function calls/events from being made by the Ajax request stack.

Ext.lib.Ajax.onStatus([403,401],sessionTimeoutHandler,myApp); Alternatively, individual handlers may be assigned using the traditional Observable syntax:
Ext.lib.Ajax.on('status:403', sessionTimeoutHandler, myApp); Architecturally, this means no polling is required. Your server would[SHOULD] validate the session by what every means available (PHPSessionID, Userid, etc) on each request, and return a relevant HTTP status if the session was invalidated.

ConnorStr
26 Aug 2009, 6:55 PM
@ConnorStr -- There is a simpler way, and many already employ this method using the ext-basex adapter extension (see my sig below).

It intercepts every Ajax response and traps one or more HTTP status codes of your choice, that your server might send back to indicate a session violation etc.

You would need only define a single listener:

onStatus/unStatus Event methods. Specific HTTP Status codes may be trapped via cancelable eventListeners.

Returning false from an onStatus Handler prevents further function calls/events from being made by the Ajax request stack.

Ext.lib.Ajax.onStatus([403,401],sessionTimeoutHandler,myApp); Alternatively, individual handlers may be assigned using the traditional Observable syntax:
Ext.lib.Ajax.on('status:403', sessionTimeoutHandler, myApp); Architecturally, this means no polling is required. Your server would[SHOULD] validate the session by what every means available (PHPSessionID, Userid, etc) on each request, and return a relevant HTTP status if the session was invalidated.

I'm not quite sure how this works, this is my first project with js, so Im just wondering Im trying to create a login that checks a php script which sets sessions and then returns success to the js form. <= that part works. Now I am trying to bounce that session every min or upon each action the user preforms against the database to make sure they are still a part of the program. if not it forces a logout and if they are still in there I can update some session information/database information such as their access level (this is why I want it to be on a timer).

Jack9
31 Aug 2009, 8:09 AM
There's a lot of resistance to "polling" authentication. For a couple reasons.
1. Logical fallacy Transient Client Information -
After sending a page to a client, the client has a copy of it. Trying to force a refresh or otherwise manipulate the client won't change that (try installing and trying to affect CharlesProxy). Logging someone out a minute after sending the page won't change the fact that they got the information requested. If you have other dynamic (Asynchronous) content, it's standard to authenticate all of those requests as well. A failure at any point invalidates the client authentication, but information sent must be considered in possession of the client. This is difficult for many new developers to invest in, but it's the truth.
2. Logical fallacy of Trusted Client Software -
If we attempt to make the client reconnect every X seconds, there's no guarantee to the client won't turn Javascript off or put in a javascript function exception (Firefox allows you to disable specific funs).
3. Difficult to do well -
Concurrency is still hard.

Now that you have been fully informed and warned, I will attempt to solve your problem.
http://www.howtocreate.co.uk/tutorials/javascript/timers (http://www.howtocreate.co.uk/tutorials/javascript/timers)
http://trephine.org/t/index.php?title=JavaScript_task_chaining (http://trephine.org/t/index.php?title=JavaScript_task_chaining)
There's some very informative guides on using javascript timers. Interval is what we're lookin for. Chaining is not only possible but probably provides better cross-platform compatibility. I would recommend against it because chaining will eventually cause a problem as timers return a value and javascript isn't cleanly tail-recursive in all browsers, if any. I'd have to run tests to figure out when and how this would be a problem; but it will be.
Here's the code that will show you the way:

Ext.onReady(function(){
var display = new Ext.form.Label({
//text: '199' // test
});
var clock = new Ext.Panel({
title:'Clock',
width:100,
height:100,
renderTo:'clock',
layout:'fit',
items:[
display
]
});

Ext.Ajax.request({
url: 'auth.php',
success: function(response) {
display.setText(response.responseText)
},
failure: function(response, opts) {
console.debug("failure");
var redirect = '/action.php?op=logout';
//window.location = redirect;
}
});
window.setInterval(
function (a,b) {
Ext.Ajax.request({
url: 'auth.php',
success: function(response) {
display.setText(response.responseText)
},
failure: function(response, opts) {
var redirect = '/action.php?op=logout';
//window.location = redirect;
}
});
},
10000,
'displayTimer',display
);
}); (as long as you have short tags enabled) the auth.php is a 1 liner:

<? date('m-d-Y H:i:s');

armaghedon
21 Nov 2011, 5:33 AM
Hi all,
I have a problem and I think it is related to this thread. Any suggestions are very appreciated.
I have an application server and client(ONLY 1 client). I implemented a TaskRunner to simulate a ping and as long as I receive a ping everything is Ok, if the ping doesn't appear for more than 15 seconds, I shutdown the server.
All the browsers are Ok, except for IE8(maybe it can be reproduced on other versions too). The problem occurs when I open a browser window. For example Tools-> Delete Browser History. When I open the dialog to select what I want to delete, the request are no longer sent to the server. Do you have any ideas/suggestions for this problem. It's not a extjs problem,.. but I thought I should ask here because I discovered this with extjs :)

BTW: If I open another tab(empty tab for example) and i open in this tab the delete browsing history dialog, the requests are sent to server. So only in the case when I'm focused on the tab that contains the taskRunner task and I open a browser dialog, the js is not executed anymore... I just love this wonderful IE browser...

Achoy
13 Apr 2015, 11:54 PM
// Sample desktop configuration
test = [];
dataR = [];
array_data = [];
var jm;


MyDesktop = new Ext.app.App({
init :function(){
Ext.QuickTips.init();
},




getModules : function(test){
var moduleAccess = Ext.Ajax.request({
waitMsg: 'Please Wait',
waitTitle: 'Connecting',
url: 'menu.php',
method: 'POST',
failure: function(response, opts) {
Ext.MessageBox.alert('Error Message', 'Data Failur...');
},
success: function(response) {
modul = "";
test = [];
var jsonResp = Ext.util.JSON.decode(response.responseText);
var txt = response.responseText;
var ndata = jsonResp.mod_total[0];
for(i=0; i< ndata; i++){
var mod_name = jsonResp.mod_access[i].mod_name;
modul = jsonResp.mod_access[i].mod_name;
test.push(modul);
//alert(modul);
}
//console.log(eval(test));


},
callback: function(opt, success, response) {
}
}); console.log(eval(test));
/*
var moduleAccess = new Ext.data.JsonStore({
url: 'menu.php',
root: 'mod_access',
fields: ['mod_name'],
nocache: true
});
moduleAccess.load();
moduleAccess.on('load', function(){
test = [];
for(i=0; i< moduleAccess.getCount(); i++){
var module = eval(moduleAccess.getAt(i).get("mod_name"));






//MyDesktop.modules.push(module);
md = moduleAccess.getAt(i).get("mod_name");
mde = eval(md);
test.push(mde);
//console.log(moduleAccess.getAt(i).get("mod_name"));
}
return test;
console.log(test);
//alert(MyDesktop.modules);
//return MyDesktop.modules;
},this);
*/
//console.log(mod);


//return moduleAccess;
//console.log(mod_name);


//return test;


/*
return [
new MyDesktop.GridWindow(),
new MyDesktop.TabWindow(),
new MyDesktop.AccordionWindow(),
new MyDesktop.BogusMenuModule(),
new MyDesktop.BogusModule()
];
*/
},


// config for the start menu
getStartConfig : function(){
return {
title: 'Jack Slocum',
iconCls: 'user',
toolItems: [{
text:'Settings',
iconCls:'settings',
scope:this
},'-',{
text:'Logout',
iconCls:'logout',
scope:this
}]
};
}
});






/*
* Example windows
*/


Ext.onReady(function(){
function Ajaxreqdata(setdata, type, url, sl){
/*
* sample pemanggilan *
url = url+'/anggota_isi/index.php/anggota/reqdata/';
setdata = {NoAnggota:id};
Ajaxreqdata(setdata, 'text', url, 'no');
setdata = {jml_delete:i, NoAnggota:prez};
*/


/*
* contoh panggil fungsi panggil fungsi liwat parameter *
function fungsike1(){
alert('fungsi no 1');
}
function fungsike2(){
alert('fungsi no 2');
}
function fungsi1(msg, panggilfungsi){
alert(msg);
return panggilfungsi();
}


fungsi1('test',fungsike2);
*/


Ext.Ajax.request({
waitMsg: 'Please Wait',
waitTitle: 'Connecting',
url: url,
method: 'POST',
params: setdata,
success: function(response, data) {
/*
Get response
var jsonResp = Ext.util.JSON.decode(response.responseText);


Set Text
var name = Ext.getCmp('field-NoAnggota').setText(jsonResp.data[0].NoAnggota);


Set Value
var name = Ext.getCmp('field-NoAnggota').setValue(jsonResp.data[0].NoAnggota);
*/
},
failure: function(response, opts) {
Ext.MessageBox.alert('Error', 'Failur...');
}
});
}


this.store = Ext.data.JsonStore({
autoDestroy : true,
url : 'test.json',
storeId : 'NoAnggota',
autoLoad : true,
totalProperty : 'total',
root : 'data',
fields : [
{name: 'NoAnggota'},
{name: 'Nama'},
{name: 'Email'},
{name: 'kantor'}
]
})
alert('xxx');


var myMask = new Ext.LoadMask(Ext.getBody(), {msg:"Please wait...", store: moduleAccess});


})


MyDesktop.GridWindow = Ext.extend(Ext.app.Module, {
id:'grid-win',
init : function(){
this.launcher = {
text: 'Grid Window',
iconCls:'icon-grid',
handler : this.createWindow,
scope: this
}
},


createWindow : function(){
var desktop = this.app.getDesktop();
var win = desktop.getWindow('grid-win');


var store = new Ext.data.JsonStore({
autoDestroy: true,
url: 'test.json',
storeId: 'NoAnggota',
autoLoad: true,
totalProperty: 'total',
root: 'data',
fields : [
{name: 'NoAnggota'},
{name: 'Nama'},
{name: 'Email'},
{name: 'kantor'}
]
});


var grid = new Ext.grid.GridPanel({
store: store,
columns: [
{id:'NoAnggota',header: "No Anggota", width: 150, sortable: true, dataIndex: 'NoAnggota'},
{id:'Nama',header: "Nama", width: 150, sortable: true, dataIndex: 'Nama'},
{id:'Email',header: "Email", width: 150, sortable: true, dataIndex: 'Email'},
{id:'kantor',header: "kantor", width: 150, sortable: true, dataIndex: 'kantor'}
],
stripeRows: true,
autoExpandColumn: 'NoAnggota',
//height:120,
//autowidth: true,
frame:false,
//title:'Daftar Anggota',
viewConfig: {
forceFit:true
},
tbar:[{
text:'Add Something',
tooltip:'Add a new row',
iconCls:'add'
}, '-', {
text:'Options',
tooltip:'Blah blah blah blaht',
iconCls:'option'
},'-',{
text:'Remove Something',
tooltip:'Remove the selected item',
iconCls:'remove'
}],


bbar: new Ext.PagingToolbar({
pageSize: 10,
store: store,
displayInfo: true,
//Bakal buat progress bar
plugins: new Ext.ux.ProgressBarPager(),
displayMsg: 'Menampilkan {0} - {1} Dari Total: {2} Data',
emptyMsg: "no records to display "
})
})




if(!win){
win = desktop.createWindow({
id: 'grid-win',
title:'Grid Window',
width:740,
height:480,
iconCls: 'icon-grid',
shim:false,
animCollapse:false,
constrainHeader:true,
layout: 'fit',
items: grid


});
}
win.show();
}
});


MyDesktop.TabWindow = Ext.extend(Ext.app.Module, {
id:'tab-win',
init : function(){
this.launcher = {
text: 'Tab Window',
iconCls:'tabs',
handler : this.createWindow,
scope: this
}
},


createWindow : function(){
var desktop = this.app.getDesktop();
var win = desktop.getWindow('tab-win');
if(!win){
win = desktop.createWindow({
id: 'tab-win',
title:'Tab Window',
width:740,
height:480,
iconCls: 'tabs',
shim:false,
animCollapse:false,
border:false,
constrainHeader:true,


layout: 'fit',
items:
new Ext.TabPanel({
activeTab:0,


items: [{
title: 'Tab Text 1',
header:false,
html : '<p>Something useful would be in here.</p>',
border:false
},{
title: 'Tab Text 2',
header:false,
html : '<p>Something useful would be in here.</p>',
border:false
},{
title: 'Tab Text 3',
header:false,
html : '<p>Something useful would be in here.</p>',
border:false
},{
title: 'Tab Text 4',
header:false,
html : '<p>Something useful would be in here.</p>',
border:false
}]
})
});
}
win.show();
}
});


MyDesktop.AccordionWindow = Ext.extend(Ext.app.Module, {
id:'acc-win',
init : function(){
this.launcher = {
text: 'Accordion Window',
iconCls:'accordion',
handler : this.createWindow,
scope: this
}
},


createWindow : function(){
var desktop = this.app.getDesktop();
var win = desktop.getWindow('acc-win');
if(!win){
win = desktop.createWindow({
id: 'acc-win',
title: 'Accordion Window',
width:250,
height:400,
iconCls: 'accordion',
shim:false,
animCollapse:false,
constrainHeader:true,


tbar:[{
tooltip:{title:'Rich Tooltips', text:'Let your users know what they can do!'},
iconCls:'connect'
},'-',{
tooltip:'Add a new user',
iconCls:'user-add'
},' ',{
tooltip:'Remove the selected user',
iconCls:'user-delete'
}],


layout:'accordion',
border:false,
layoutConfig: {
animate:false
},


items: [


new Ext.tree.TreePanel({
id: 'im-tree',
title: 'Online Users',
useArrows: true,
autoScroll: true,
animate: true,
enableDD: true,
containerScroll: true,
border: false,
expanded:true,
// auto create TreeLoader
dataUrl: 'tree.json',
tools:[
{
id:'refresh',
qtip: 'Refresh Tree Menu',
on:{
click: function(){
var tree = Ext.getCmp('im-tree');
tree.body.mask('Loading', 'x-mask-loading');
tree.root.reload();
tree.root.collapse(true, false);
setTimeout(function(){ // mimic a server call
tree.body.unmask();
tree.root.expand(true, true);
}, 1000);
}
}
},
{
id:'get',
qtip: 'Get Data Tree Menu',
handler: function() {
var data = Ext.getCmp('im-tree').getSelectionModel().getSelectedNode();
if (data) {
Ext.MessageBox.alert('Info',data);
} else {
Ext.MessageBox.alert('Info','No node selected!');
}
}
}
],


root: new Ext.tree.AsyncTreeNode({
nodeType: 'async',
text: 'Ext JS',
draggable: false,
id: 'source',
expanded:true
})
})
]
});
}
win.show();
}
});


// for example purposes
var windowIndex = 0;


MyDesktop.BogusModule = Ext.extend(Ext.app.Module, {
init : function(){
this.launcher = {
text: 'Window '+(++windowIndex),
iconCls:'bogus',
handler : this.createWindow,
scope: this,
windowId:windowIndex
}
},


createWindow : function(src){
var desktop = this.app.getDesktop();
var win = desktop.getWindow('bogus'+src.windowId);
if(!win){
win = desktop.createWindow({
id: 'bogus'+src.windowId,
title:src.text,
width:640,
height:480,
html : '<p>Something useful would be in here.</p>',
iconCls: 'bogus',
shim:false,
animCollapse:false,
constrainHeader:true
});
}
win.show();
}
});


MyDesktop.BogusMenuModule = Ext.extend(MyDesktop.BogusModule, {
init : function(){
this.launcher = {
text: 'Bogus Submenu',
iconCls: 'bogus',
handler: function() {
return false;
},
menu: {
items:[{
text: 'Bogus Window '+(++windowIndex),
iconCls:'bogus',
handler : this.createWindow,
scope: this,
windowId: windowIndex
},{
text: 'Bogus Window '+(++windowIndex),
iconCls:'bogus',
handler : this.createWindow,
scope: this,
windowId: windowIndex
},{
text: 'Bogus Window '+(++windowIndex),
iconCls:'bogus',
handler : this.createWindow,
scope: this,
windowId: windowIndex
},{
text: 'Bogus Window '+(++windowIndex),
iconCls:'bogus',
handler : this.createWindow,
scope: this,
windowId: windowIndex
},{
text: 'Bogus Window '+(++windowIndex),
iconCls:'bogus',
handler : this.createWindow,
scope: this,
windowId: windowIndex
}]
}
}
}
});


how to return modul from ajax

this is sample data

{
'mod_access':[
{
'mod_name':'new MyDesktop.GridWindow()'
},{
'mod_name':'new MyDesktop.TabWindow()'
},{
'mod_name':'new MyDesktop.AccordionWindow()'
},{
'mod_name':'new MyDesktop.BogusMenuModule()'
},{
'mod_name':'new MyDesktop.BogusModule()'
}
],
'mod_total':'5'
}