Ext.Ajax.request always fails - javascript

I'm trying to access any web resource via Ext.Ajax.request but it is always failing, for example I have GlassFish Server on my localhost at port 4848 and when I try to access it the request fails,I've tried other urls but with no success.
this is my code:
`items:[
{
id : 'button1',
xtype : 'button',
text : 'click',
listeners: {
click : function(btn){
Ext.Ajax.request({
method : 'GET',
url : 'http://localhost:4848',
success : function(){
alert('success');
},
failure : function(){
alert('fail');
}
});
}
}
]`

I think you should firstly specify a file after localhost.

Related

Load ajax success data on new page

My ajax call hits the controller and fetches a complete JSP page on success. I was trying to load that data independently on a new page rather than within some element of the existing page. I tried loading it for an html tag but that didn't work either. I tried skipping the success function but it remained on the same page without success data. My ajax call is made on clicking a normal button in the form and the code looks like as shown below.
$.ajax({
url : '/newpage',
type : 'POST',
data : requestString,
dataType : "text",
processData : false,
contentType : false,
success : function(completeHtmlPage) {
alert("Success");
$("#html").load(completeHtmlPage);
},
error : function() {
alert("error in loading");
}
});
This should do:
$.ajax({
url : '/newpage',
type : 'POST',
data : requestString,
dataType : "text",
processData : false,
contentType : false,
success : function(completeHtmlPage) {
alert("Success");
$("html").empty();
$("html").append(completeHtmlPage);
},
error : function() {
alert("error in loading");
}
});
You can try this,
my_window = window.open("");
my_window.document.write(completeHtmlPage);
into your success.

sinon.js 1.10, jquery 2.1 and synchronous request

I try to simulate a server with sinon.js and call it with jQuery.ajax. But i can't make it works.
Here's the code :
$(function() {
var server = sinon.fakeServer.create();
server.respondWith('POST', '/some/test', [200, { 'Content-Type' : 'application/json'}, JSON.stringify({
id : 'test',
value : 'test'
})]);
var success = sinon.spy(),
error = sinon.spy();
jQuery.ajax({
url : '/some/test',
async : false,
type : 'POST',
data : JSON.stringify({
test : 'test'
}),
contentType : 'application/json',
success : success,
error : error,
});
console.log(server.requests[0].status);
console.log(server.requests[0].method);
console.log(server.requests[0].url);
console.log(server.requests[0].requestBody);
console.log(success.called);
console.log(error.called);
server.restore();
});
If you try this code, you'll see this output :
200
POST
/some/test
{"test":"test"}
false
false
According to the first 4 logs, sinon respond to the request. But jQuery never called the success callback (and the error is not called too).
It's like the jQuery ajax request never finish.
The issue comes from sinon.js with jQuery 2.1 : https://github.com/cjohansen/Sinon.JS/issues/510
jQuery 2.1 makes synchronous ajax request like this :
var req = new XMLHttpRequest();
req.open('POST', '/some/test', false);
req.setRequestHeader('Content-Type', 'application/json');
req.onload = function() {
console.log('success');
};
req.onerror = function() {
console.log('error');
};
req.send(JSON.stringify({
test : 'test'
}));
The problem is Sinon doesn't trigger the onload or the onerror callback for a synchronous request. The issue is in the method setResponseBody of FakeXMLHttpRequest. You can find this code :
if (this.async) {
this.readyStateChange(FakeXMLHttpRequest.DONE);
} else {
this.readyState = FakeXMLHttpRequest.DONE;
}
In recent browsers, XmlHttpRequest trigger the callbacks even for a synchronous request. So this code should be modified in this :
if (!this.async) {
this.readyState = FakeXMLHttpRequest.DONE;
}
this.readyStateChange(FakeXMLHttpRequest.DONE);
If you patch sinon.js like that, everything works.

I am making an ajax call to load the contents into modal dialog; which seems to be working on all other browser than IE

I am making an ajax call to load the contents into modal dialog; which seems to be working on all other browser than Internet Explorer. In Internet Explorer it is freezing and I cannot do any thing I have to use Task Manager to end task. Can anyone tell me what can i do to resolve the freezing issue? The content that I am loading from the URL are dynamic HTML contents, which has scripts, etc.
try{
var LOCALE ='en_us';
var custNUm= 'Y0392287497';
var dURL = 'https://www.over.com?cstNum='+custNUm+'&loc='+LOCALE;
var mModal = $("<div class=\"mdialog\" role=\"dialog\"></div>").html('Loading Please Wait....').dialog({
position : [ 'center', 20 ],
modal : true,
//autoOpen : false,
bgiframe : true,
resizable: false,
closeOnEscape : false,
title : "CUSTOMER MODAL",
close : function(event, ui) {
$(this).remove();
}
});
$.ajax({
url : dURL,
type : 'POST',
dataType : 'text',
timeout : 5000,
beforeSend: function()
{
$('html,body').css('overflow', 'hidden');
},
error : function(xhr, status, error) {
alert(error);
},
success : function(textResponse) {
mcdpModal.html(textResponse);
}
});
}catch(e){
alert(e);
}
Want to the following: 1.Is ur Modal Window getting opened ?
2.Is your data response comming from ur server
3.Is this url u access resides in different domain ? (for 3 rd point:IE does not support Cross Domain AJAX Calls.You need to have both ur execution domain and the server domain to be same.)

How to make a successful JSON call from Javascript

I am baffled by this for very long now. I want to gain this precious knowledge of making JSON call properly. Help me Humans.
So I'm making a call exactly like this:
$.ajax({
type : "POST",
url : "http://quote.mythicalQuotes.com/unicorn/service/historical/json?callback=callme&symbols=APPL",
dataType: "text",
cache : false,
data : My_Array,
error : function(request,error){alert(request+" "+error); },
success : function(data)
{
alert("Response" + data);
}//success
}).fail(function(textStatus, errorThrown) { alert("error Error");
console.log("The following error occured: "+ textStatus, errorThrown); });
But it fails and throws 'error' alert. Good Coding!
Now pasting "http://quote.mythicalQuotes.com/unicorn/service/historical/chart/lite/json?callback=callme&symbols=APPL" on my browser URL gives me nice JSON of format:
callme(
{
"SYMB" : [
{
"DESCRIPTION" : "APPL,
"BARS" : {
"CB" :[
{
"lt" : "09-01-2011::20:00:00",
"op" : "16.31",
"cl" : "15.22",
"hi" : "16.45",
"lo" : "14.72",
"v" : "17768019"
},
{
"lt" : "09-02-2011::20:00:00",
"op" : "15.22",
"cl" : "14.22",
"hi" : "19.45",
"lo" : "10.72",
"v" : "17768000"
}
]
}
]
})
So what atrocity am I doing here which is provoking my anger toward this particular Javascript semantics/syntactics?
Couple of reasons I thought which might cause this.
1. Same origin policy.
2. Wrong JSON format being return.
3. Stupidity of my code.
Please help.
This is a JSONP-type response. Add dataType: jsonp to the JQuery AJAX request. Since you're also specifying the callback function explicitly, add jsonpCallback: callme also. See the JQuery docs for more info (scroll down to the "dataType" section).
$.ajax({
dataType: "jsonp",
jsonpCallback: "callme",
// ...
success: function(data) {
alert(data); // should show the JSON: { "SYMB" : ... }
}
});
You mentioned the cross-domain policy; the JSONP spec is a workaround for this policy blocking cross-domain requests. The idea is that, rather than returning data, the server returns a Javascript snippet containing data. The client then executes the returned function to retrieve the data. The JQuery ajax method has built-in functionality to handle all this "behind the scenes".

Execute javascript/jquery code OnClick and conditional post back to ASP function

jQuery newbie question here... I have a jQuery dialog that displays a warning with a "OK" or "Cancel" and based on what they click the result needs to then execute the server side ASP onClick event.
I've attempted to write it along these lines:
"OK": function () {
$(this).dialog("close");
return true;
},
Cancel: function () {
$(this).dialog("close");
return false;
But it never posts back to the asp server side method.
Am I off base in what I am trying to accomplish here, and is there standard 'best practice' type of way of implementing this type of functionality?
You have to call __doPostBack() method with appropriate eventTarget and eventArgument to call its sever click handler.
"OK": function () {
$(this).dialog("close");
__doPostBack('serverElementId', 'arguments');
}
You can take a look at the below link to understand how ASP.Net postback mechanism works.
http://wiki.asp.net/page.aspx/1082/dopostback-function/
Assuming you want to execute the POST on "OK", you'd need to add something like:
"OK": function () {
$.post('someurl.asp', {data}, function() {
// what to do after the post
}
$(this).dialog("close");
return true;
}
As it currently stands, your code just closes the dialog either way.
I don't have experience with asp.net but you can use an AJAX request to post data to your server-side script:
"OK": function () {
$(this).dialog("close");
$.ajax({
url : 'myscript.asp',
type : 'get',
dataType : 'json',
data : { state : 'OK' },
success : function (serverResponse) {
//you can now access the serverResponse
},
error : (jqXHR, errorText, errorThrown) {
//always make sure to handle your errors
}
});
return true;
},
Cancel: function () {
$(this).dialog("close");
$.ajax({
url : 'myscript.asp',
type : 'get',
dataType : 'json',
data : { state : 'Cancel' },
success : function (serverResponse) {
//you can now access the serverResponse
},
error : (jqXHR, errorText, errorThrown) {
//always make sure to handle your errors
}
});
return false;
}
Docs for $.ajax(): http://api.jquery.com/jquery.ajax

Categories

Resources