AJAX call won't display - ajax

There is a chunk of my website that won't display on the new web server. This page is currently being hosted on Windows 2003, IIS 6 and I'm moving it to Windows 2008, IIS 7. There is a div being populated by an ajax call to another page in the site which is not displaying on the new server's localhost. However, my test machine is running the exact same code from IIS Express (Windows 7) and it works correctly.
I believe the issue has to do with IIS. Is there a setting that would prevent AJAX from executing? I've narrowed the problem down to the following code block.
<script type="text/javascript">
$(document).ready(function() {
$.ajax({
ajax: false,
url: 'Newsfeedbrief',
success: function(response) {
$(".newsFeedContainer").html(response)
console.debug(response)
}
});
});
</script>
In a browser where the newsFeedContainer is populated the console prints the html, but not in the browser where the text is missing.

It started working after adding the extension to the page.
url: 'Newsfeedbrief.aspx'

Related

Call express (node.js) APIs from static HTML page on host

I have a static HTML page, hello.html. If I double click hello.html, it opens up in my default browser, and displays the HTML properly, but in the browser's search bar, instead of having a URL with a hostname, what displays is the local filepath for hello.html on my computer.
I have made a simple express web server on my computer, using express (node.js). It is set to listen on port 8080, and has a simple GET api. (The API right now does something simple like call 'ls'). I wanted to be able to call that GET API, from my static hello.html. In my static HTML page, I use jquery to make an ajax call to this api, calling it as http://127.0.0.1:8080/myapi. Once I start the express server and load the page, looking at the console logs, the requests to myapi are going through when I load the static HTML page in the browser (the ls response is getting logged on the console), however, the jquery ajax in the HTML page, always executes the error function, even when I'm setting the response as 200.
I was reading a lot about why this happens, and read it could be due to CORS issue. However, there is no hostname I can specify on the server side, to allow in this case, since there is not actually a web server running, and so there is no actual host name associated with my static HTML page.
Is this even possible to do? (To have a static HTML page on your computer with no web server running, make your own express server with APIs, and call those APIs from the static web page?)
Example:
hello.html
<html>
<head>
<title>Hello World</title>
</head>
<body>
<script src"js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$.ajax({
type: "GET",
url: "http://127.0.0.1:8080/myapi",
contentType: 'application/json',
success: function(response) {
alert("success!");
},
error: function(jqXHR, textStatus, errorThrown) {
alert("error");
},
});
});
</script>
<p>Hello World!</p>
</body>
</html>
myserver.js:
var express = require('express');
var shelljs = require('shelljs');
var app = express();
app.get('/myapi', function (req, res) {
shellStr = shelljs.exec('ls');
if ( shellStr ) {
console.log("successful call on server side");
res.status(200);
res.json({ ls: shellStr });
}
else {
console.log("failure status on server side");
res.status(500).json({ error: "Could not do ls"});
}
})
var server = app.listen(8080, function() {
console.log("Listening on 8080");
})
I am starting up the server by giving 'node myserver.js', and then I open the static HTML page in the browser. When it loads, the API call is being made, as I see the server side console output, and it's going as success. However, back in the static html, the ajax call's 'error' function is always executed.
I got it to work!
In case anyone else ever wonders, and is new to express and web servers like myself.
The key was to have express serve hello.html as well. It is simple to do this.
I had my express server in a directory like this:
myserver/myserver.js <-- this is my express server
I moved all of my static html files, in to a directory at the same level.
myserver/htmlfiles/ <-- this directory has 'hello.html'.
Now, in myserver.js, I added the following line near the top, just after var app = express():
app.use(express.static('myhtml'))
What this does, is it will tell express to serve any static files in the directory myhtml (will search for that directory, relative to where the myserver.js is.)
If I restart the express server (kill the current one then just run 'node myserver.js' again), and go to the browser, if I visit http://127.0.0.1:8080/hello.html - the page shows up!
Now the domain origin is the same, and when the ajax call is made to the api, it is successful in the browser, too!
(Note - I did have an issue at first after these changes, because my ajax URL in hello.html was calling http://localhost:8080/myapi, but I was displaying hello.html in the browser via http://127.0.0.1:8080/hello.html. Once I changed the ajax URL being called to http://127.0.0.1:8080/myapi - everything worked. Similarly, if I open the browser and go to http://localhost:8080/hello.html and display hello.html that way, if the ajax URL being called is http://127.0.0.1:8080/myapi - the ajax call will go in to the 'error' function. It seems that the hostname you are using in the ajax URL in the HTML page, must be the same (127.0.0.01 vs. localhost) as the hostname you are using to visit the html page in the browser when the call is made.)

ajax call failed after building APK using PhoneGap

i am trying to run my app after using phonegap but failing to pass the AJAX code section
it work perferctly on Ripple emulator but after installing it on my device (android 5.0) the ajax call just failed (Getting the ErrMSG).
Thanks
this is the code i am using:
$.ajax({
type: "POST",
url: "LogIn.aspx/UserCheck",
data: "{'UserName':'" + UserName + "','Password':'" + Password + "'}",
contentType: "application/json",
dataType: "json",
success: function (msg) {
if (msg.d == true) {
window.location.href = "Default.aspx";
}
else
alert("please insert correct username and password");
},
error: function (xhr, textStatus, errorThrown) {
alert('Ajax Call Failed');
}
});
It looks like your ajax call is calling on your local web server. Since you are not running now on your local web server you will need to adjust your ajax call to hit the full url. You have two places (at least in the code you have provided):
url: "LogIn.aspx/UserCheck"
and
window.location.href = "Default.aspx";
This last bit of code really needs to be a page or block of code in your app. This way if the phone is not connected to the Internet for whatever reason you still can give your users a valid error message.
Once this is done you will then need to whitelist your domain in your app.
After deploy to phone, you have a Cross Domain call to your aspx. so you also need to enable Cors.
Why do you redirect to default.aspx after login? if you redirect from the original index.html, which is located in the phone to the default.aspx which is located in the IIS Server, you lost control of the phone application, all plugins will not work, just like your apps become a mobile browser.
btw, r u using vb or c# in the aspx?

Cannot Make AJAX Call in Google Ripple PhoneGap Emulation (500 Error)

I'd add a comment here:
PhoneGap application not working on Google Ripple
but given my low reputation on StackOverflow (as elsewhere), I can't. That thread raises similar issues but does not answer my question. I am trying to test the functionality of an HTML5 page that will eventually be made into a mobile app with PhoneGap. The page makes an AJAX call to a JSON service via jQuery:
$(document).ready(function() {
$.ajax({
url: 'latest.json',
type: 'get',
datatype: 'json',
processData: false,
success: function(data) {
//…make it so
});
});
and runs flawlessly as HTML5 in Chrome. However, when using the Ripple PhoneGap emulation available for Chrome, the JSON fails with a 500 error:
GET https://rippleapi.herokuapp.com/xhr_proxy?tinyhippos_apikey=ABC&tinyhippos_rurl=latest.json 500 (Internal Server Error) rippleapi.herokuapp.com/xhr_proxy?tinyhippos_apikey=ABC&tinyhippos_rurl=latest.json:1
The suggested answer to the question linked above reads:
I had the same issue. It was happening when I was trying to connect to my WebAPI service hosted on IISExpress.
After I changed hosting to my local IIS server, the error dissapeared (sic) and I was able to connect to my WebAPI service using Ripple.
But I'm not running IIS or indeed anything locally -- it's all running off a remote server hosted by an ISP. Since, as I say, this page runs fine in non-emulation mode, the fault would appear to be in Ripple. Any help making this emulation operate correctly will be greatly appreciated.
$.ajax({
type: "GET",
url: serviceurl + "/GetBusinessPartner/",
dataType: "json",
crossDomain: true,
success: function (responseData) {
},
error: function (xhr) {
}
});
This worked for me and in ripple setting disable cross domain proxy.

KendoUI pages returning 412 (Precondition Failed) after OSX 10.9 Upgrade

I have a site running on a localhost that uses different KendoUI grids loaded from a kendoPanelBar. It was all working fine until I updated to OSX 10.9 (Mavericks). Now I can load a grid once using a $.post jquery call, but then the second time I try and load the grid I receive a 412 (Precondition Failed). I have to empty the cache before it will let me load the grid again. The strangest part is that this is only happening in Safari 7.0. Firefox 24.0 is working as normal and can load the grids with no errors.
Is this a problem with my web server configuration that may have changed due to the upload or... could this be just localized to a problem with the new Safari or... is there something that I could be missing in my code that Safari is now strictly checking?
After doing some research I found some information related to cross domain loading that suggested this fix, although since I'm not doing cross domain calls I'm not sure why this actually worked. If someone could explain that would be fantastic.
This is the fix by changing the $.post call to using $.ajax with a GET type and async as false.
Here is the original code:
$.post( "myContent.html" )
.done(function( data ) {
$("#main_content").html(data);
});
Here is the updated code:
$.ajax({
type: "GET",
url: "myContent.html",
success: function(data) {
$("#main_content").html(data);
},
async: false
});

jQuery.ajax PUT request issue in internet explorer

I am working on ASP.NET MVC4 webapi and it seems a put request via $.ajax works fine in case of google chrome and Firefox but it isn't workin in IE(10).
The below code :
$.ajax({
url: 'api/xQuizQuestion',
type: 'PUT',
dataType: 'json',
data: JSON.stringify(AllQsWithAs),
contentType: "application/json;charset=utf-8",
success: function (data) {
alert('Student added Successfully');
},
error: function () {
alert('Student not Added');
}
});
Works fine in chrome/firefox, in sense that the data AllQsWithAs(which is an array of Complex types) gets added to the Request body, but in case of IE(10) the request body is sent without the Data.
Confirmed the same with Fiddler as well.
Surprisingly it works just fine when I change my Browser Mode to IE9/IE8 or Browser mode to IE 8/9.
Not sure whats the issue. Any help/insight would be appreciated.
Seems to be a bug in IE 10.
I'm finding reports that adding this tag to your head will run the scripts in compatibility mode.
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9" >
http://code.gishan.net/code/solution-to-ie10-ajax-problem/
Old bug tracker entry for jQuery closed as can't fix: http://bugs.jquery.com/ticket/12790
I'm having trouble finding a good source, but it may have been fixed in the latest and greatest IE10 release.

Resources