PDA

View Full Version : [ajax request] response not memorized



SpinoWeb
7 Jan 2011, 1:20 AM
Hello to everybody,
I'm new with ExtJs and I have a, maybe, simple problem with Ext.Ajax



var start = 'ajax: ';
Ext.Ajax.request({
url: 'php/start.php',
params: { user_id : user_id },
method: 'GET',
success: function ( result, request) {
//Ext.MessageBox.alert('Success', 'Data return from the server: '+ result.responseText);
start += result.responseText;
},
failure: function ( result, request) {
Ext.MessageBox.alert('Failed', result.responseText);
//start += result.responseText;
}
});This code works because the ajax request is completed (result.responseText is 'guest'), but it not save the result on the 'start' variable and print always
ajax: and not the expected
ajax: guest

where am I doing wrong?

Thanks!!!

evant
7 Jan 2011, 1:27 AM
When are you trying to print the value?

SpinoWeb
7 Jan 2011, 1:29 AM
I have a panel which is the center item of a viewport



var cPanel = {
id: 'cpanel',
title: 'CPANEL',
layout: 'fit',
autoScroll: true,
bodyStyle: 'padding:25px',
html: '<p>' + start + '</p>'
};

evant
7 Jan 2011, 1:30 AM
So, do this:



var start = 'ajax: ';
Ext.Ajax.request({
url: 'php/start.php',
params: { user_id : user_id },
method: 'GET',
success: function ( result, request) {
//Ext.MessageBox.alert('Success', 'Data return from the server: '+ result.responseText);
start += result.responseText;
console.log('request done', new Date());
},
failure: function ( result, request) {
Ext.MessageBox.alert('Failed', result.responseText);
//start += result.responseText;
}
});

var cPanel = {
id: 'cpanel',
title: 'CPANEL',
layout: 'fit',
autoScroll: true,
bodyStyle: 'padding:25px',
html: '<p>' + start + '</p>'
};
console.log('panel created', new Date());

SpinoWeb
7 Jan 2011, 1:37 AM
in order I obtain:

GET http//:...php/start.php (it works)
panel created Fri Jan 07 2011 10:34:58 GMT+0100 (ora solare Europa occidentale) {}
request done Fri Jan 07 2011 10:34:58 GMT+0100 (ora solare Europa occidentale) {}

evant
7 Jan 2011, 1:40 AM
Right, so what does that tell you?

SpinoWeb
7 Jan 2011, 1:54 AM
my screenshot:

http://www.spinoweb.com/screenshot.jpg

The error is the same, because the result is always
ajax: and not
ajax: guest

evant
7 Jan 2011, 2:05 AM
I understand what the problem is, I'm trying to get you to figure it out on your own!

From the debugging we put in the above, what can you say about the code?

SpinoWeb
7 Jan 2011, 2:19 AM
the code is following:


var cewt_path = 'wp-content/plugins/cewt/';

var start = 'ajax: ';
Ext.Ajax.request({
url: cewt_path + 'php/start.php',
params: { user_id : user_id },
method: 'GET',
success: function ( result, request) {
//Ext.MessageBox.alert('Success', 'Data return from the server: '+ result.responseText);
//var start = Ext.get('start').dom;
//var start;
start += result.responseText;
console.log('request done', new Date());
},
failure: function ( result, request) {
Ext.MessageBox.alert('Failed', result.responseText);
//start += result.responseText;
}
});

var cewtPanel = {
id: 'cewt-panel',
title: 'CEWT',
layout: 'fit',
autoScroll: true,
bodyStyle: 'padding:25px',
html: '<p>' + start + '</p>'
};
console.log('panel created', new Date());then I put the 'cewtPanel' in the 'corePanel', which is the center of my viewport:

//corePanel
var corePanel = {
id: 'core-panel',
region: 'center', // this is what makes this panel into a region within the containing layout
layout: 'card',
border: false,
margins: '0 0 5 5',
activeItem: 0,
items: [cewtPanel, modelPanel]
};

//viewport
var viewport = new Ext.Panel({
renderTo: 'cewt',
//width: 800,
height: 600,
//title: 'CEWT',
layout: 'border',

items: [
menu, // north
xmltree, // east
corePanel //center
]
});

I am not expert about ExtJs... I don't understand what is wrong

evant
7 Jan 2011, 2:26 AM
Ok, say I do this, what's wrong with my code?



var result = a + b;
var a = 1;
var b = 2;
console.log(result); // why isn't result 3?


The same thing applies to your code.

SpinoWeb
7 Jan 2011, 2:30 AM
Ok, it's clear, but the sequence of my code is

var a = 1;
var b = 2;
var result = a + b;
console.log(result);
the ajax request is before than panel creation. ExtJs perform the ajax request after panel creation??

steve1964
7 Jan 2011, 4:04 AM
What Evant is trying to tell you is that the ajax request is an asynchronous process, the fact that the call is before the panel creation mean nothing, so before referencing any results of the ajax request you have to check if the request is done

SpinoWeb
7 Jan 2011, 11:27 AM
Yes, I understand... and I found the error. Thanks a lot to Evant and steve1964 too!

NehaShah
14 Jun 2011, 3:04 AM
Hi ,
I want to login on click of submit button there is a validation page were i want to get data username and get used for validation but normal jsp not working.Below is ma code.
login.js

<!DOCTYPE html>
<html>
<head>
<meta name="viewport"
content="width=device-width,height=device-height,initial-scale=device-scale, user-scalable=yes, minimum-scale=1.0, maximum-scale=5.0" />

<!-- sencha touch css -->
<link rel="stylesheet" type="text/css" href="sencha-touch/resources/css/sencha-touch.css" />

<!-- <link rel="stylesheet" type="text/css" href="sencha-touch/docs/resources/css/ext-all.css">
<script type="text/javascript" src="sencha-touch/docs/resources/ext-base.js"></script>
<script type="text/javascript" src="sencha-touch/docs/resources/ext-all.js"></script>-->
<script type="text/javascript" src="sencha-touch/sencha-touch.js"></script>


<script type="text/javascript">

Ext.onReady(function(){

var login = new Ext.form.FormPanel({
width:400,
autoHeight:true,
labelWidth:80,

frame:false,
text:'Please Login',
renderTo: Ext.getBody(),
items:[{
xtype: 'textfield',
name : 'loginUsername',
label: 'Username',
allowBlank:false
},{
xtype: 'textfield',
label:'Password',
name:'loginPassword',
inputType:'password',
allowBlank:false
},
{
xtype: 'button',
text: 'Login',
ui: 'action',
formBind: true,
minWidth: '35',

handler:function(){
Ext.Ajax.request({
url : 'Login.jsp' ,
method: 'POST',
success: function ( result, request ) {
console.info("Success: " + result.responseText);
Ext.Msg.alert('Status', 'Login Successful!', function(btn, text){
if (btn == 'ok'){
var redirect = 'test.jsp';
window.location = redirect;
}
});



},
failure: function ( result, request) {
console.info("Failure: " + result.responseText);
Ext.Msg.alert('Uuops..', result.message);
}
});
}



}]

});


});
</script>
</head>
<body >

</body>
</html>

and my login.jsp

<%@ page language="java" pageEncoding="UTF-8"%>
<%
String result;
String loginUsername = request.getParameter("loginUsername");
if (null != loginUsername && loginUsername.length() > 0) {
if (loginUsername.equals("neha"))
result = "{success:true}";
else
result = "{failure:true,errors:{reason:'Login failed.Try again'}}";

} else {
result = "{failure:true,errors:{reason:'No userid has been provided'}}";
}
%>
Value<%=loginUsername%>