Following code snippet:
$.ajax({
url: 'actions.xml',
cache: false,
dataType: 'xml'
}).done(function(data) {
$(data).find('script').each(function() {
deferreds.push($.ajax({
url: $(this).text(),
dataType: 'script'
}));
});
$.when.apply($, deferreds).then(function() {
$('.preloader').fadeOut();
...
});
});
On the browser, this code executes without a problem. The preloader fades out and everything is fine. On a mobile project via cordova, I get a problem. The $.when.apply part doesn't seem to execute. The preloader is never fading out and because of this the app is not working. Does anyone know, why this is happening?
The deferreds array has the same values as in the browser. I tested this via alert(JSON.stringify(deferreds));
I have figured this out by setting some alerts and could come down to this specific problem. It is definitely crashing at this point.
I have to finish this thing due today and I tried different things like setting timeouts, putting other things in function, etc, to solve this, but nothing seems to work and maybe an expert in this has the solution in two seconds.
You could avoid sending too many requests at same time but one by one using this kind of logic:
$.ajax({
url: 'actions.xml',
cache: false,
dataType: 'xml'
}).done(function (data) {
var queue = $.Deferred().resolve();
$(data).find('script').map(function () {
return $(this).text()
}).get().forEach(function (url) {
queue = queue.then(function () {
return $.ajax({
url: url,
dataType: 'script'
}).promise();
})
});
});
Be aware, maybe your issue is just because IOS simulator, you should test your original code on an IOS device (if not already done), and see if same issue persists.
Related
I am rendering some stats on my page, as this takes a bit of time I made this request an ajax call after the page loads
<script type ="text/javascript">
$(document).ready(function () {
$.ajax({
url: '#Url.RouteUrl(Routes.MyAds.AjxCallFoAbc, new {advertId = Model.CreateAdvertHeader.SelectedAdvert.Id})',
type: 'GET',
cache: false,
success: function(response) {
$('.advert-performance').replaceWith(response);
}
});
});
</script>
This works perfectly for me, its causing grief when the user installs a ad-blocker, this content is being blocked, I have debugged the code-base and found the ajax call route is never being hit when the ad-blocker is enabled on the browser
What is the work-around for this, I need show the stats even if the ad-blocker is installed
Resolved it
The reason being, my route which the ajax was pointed to had a advert-stats as part of the url, which caused the blocker to block it,
simply changing the route has fixed it
I am trying to develop a small CRUD project using ASP .Net MVC as part of my learning experience, I am trying to use jQuery and Ajax to get the data and display it.
I am new to JavaScript and ajax, not sure If I am commenting it the wrong way.
In the following bit of code, I have commented the
$('#btnUpdate').show();
$('#btnAdd').hide()
functions, but they are still getting executed on the page.
function getbyID(CusId) {
$('#CustomerName').css('border-color', 'lightgrey');
$('#Age').css('border-color', 'lightgrey');
$('#Address').css('border-color', 'lightgrey');
$.ajax({
url: "/Customers/getbyID/" + CusId,
type: "GET",
contentType: "application/json;charset=UTF-8",
dataType: "json",
success: function (result) {
$('#Id').val(result.Id);
$('#CustomerName').val(result.CustomerName);
$('#Age').val(result.Age);
$('#Address').val(result.Address);
$('#myModal').modal('show');
//$('#btnUpdate').show();
//$('#btnAdd').hide();
},
error: function (errormessage) {
alert(errormessage.responseText);
}
});
return false;
}
I cleaned the solution and build it again but the code is still getting executed. Is there a different way of commenting the code.
Well The problem is solved now, I cleared the browser Cache and it has started working. As I am new, I was not aware of the execution style of javascript.
I am using a boostrap dialog box to pull in a list with a quantity. After I submit my form, and open the dialog box to check to see if the quantity has updated, it seems to be stale data. I have a call with ajax to the controller and then back to the database to pull in updated info. But when I set a breakpoint in the controller (on server side) it never hits. IT ONLY kicks out of the issue when I set a breakpoint to the function calling ajax within developer tools and debugger. I don't see any console errors either.
I don't have an issue with Firefox, just IE11.. here is the code:
<script type="text/javascript">
function LocationModal() {
$("#GetLocBtn").attr("disabled", "disabled");
var partNumber = $("#PartNum").val();
var Condition = 'Z';
var urlQry;
var receiveIsChecked = document.getElementById('Receive').checked;
var src = 'removed for security';
$.ajax({
type: "GET",
url: src,
dataType: "json",
contentType: "application/json; charset=utf-8",
data: { partNumber: partNumber, CCODE: Condition },
beforeSend: function () {
},
success: function (data) {
$("#LocationModalContainer").html(data.LocationModal);
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
}
});
};
The problem is indeed that IE caches the results of Ajax calls. You can prevent that behavior either by adding cache: false to every call, like you've discovered, or setting it globally via ajaxSetup before you make any calls.
$.ajaxSetup({
cache: false
});
The use of ajaxSetup is discouraged in the jQuery documentation, but might be a good solution for you if you don't use any plugins that might rely on the normal behavior and want to quickly make sure none of your own ajax calls is cached.
Personally, I have my doubts about how real the interference risk mentioned in the documentation is when it comes to the cache setting, since basically you just make IE behave like other browsers.
I'm writing a jQuery for send list of form datas one by one to server.
It working perfectly on Firefox, but when i use chrome it's sending all data at once
Here is my code
$('.frmroldcon').each(function(){
var thobj=this;
$(thobj).prev().prev().prev('.failedicoconold').hide();
$(thobj).prev('.doneicoconold').hide();
$(thobj).prev().prev('.proccesicoconold').show();
fuser = jQuery('input[name="fusername"]',thobj).val();
fpass = jQuery('input[name="fpassword"]',thobj).val();
$.ajax({
type: "POST",
async: false,
cache:false,
url: "checkcon.php",
data: { checkcons: "1", fusername: fuser, fpassword: fpass},
success: function(data){
$(thobj).prev().prev('.proccesicoconold').hide();
if(data==0){
$(thobj).prev().prev().prev('.failedicoconold').show();
window.errc=window.errc+1;
}
else{
$(thobj).prev('.doneicoconold').show();
}
}
});
});
I'm using jQuery version 2.1.4, also tried other old versions like 1.4 but it seems not working.
Can anyone give me a solution for this or alternative for submit each forms data to server one by one,
Thanks a lot
A quick way to do serial, asynchronous, ajax requests using jQuery's $.when
var requests = [];
$('.frmroldcon').each(function() {
$.when.apply($,requests).then(function() {
requests.push($.ajax({/* your ajax request */});
});
});
You haven't shown the requirement to have to do these requests serially, however. And if you can do everything you need to do with 1 call to the server instead of 60, then that's the way you should be doing it.
I am new in the area of jQuery/Ajax and my little test function doesn't work. And my page is also refreshingcan any one help me
<script type="text/javascript" >
$(document).ready(function() {
$("#ser_itm").change(function() {
var id=$(this).val();
var dataString = 'id='+ id;
alert(dataString);
$.ajax({
type: "POST",
url: "bar_pull.php",
data: dataString,
cache: false,
success: function(html) {
$("#tbl").html(html);
}
});
});
});
Pass the function, not the result of the function call:
$('.linkDetails').on('click', getDetailsFromServer);
Apply the same to your AJAX success callback:
success: postToPage
Also, the getDetailsFromServer() function needs to be defined before you bind it to an event. Move the function declaration before your .on('click', ...) call.
So I'm going to try and explain these points more clearly:
You cannot access C:\Users\yah\Desktop\text.txt. This is a server side path, your javascript runs on the client side. So this needs to be a path you can browse to in your browser, something like /pathinURL/text.txt. How you do this is dependant on your hosting technology, etc.
Your call backs are also wrong,
$('.linkDetails').on('click', getDetailsFromServer());
&
success: postToPage()
these will execute the function when they are hit, (well it actually binds the function result) not when the event happens. To make these work you need to remove the braces:
$('.linkDetails').on('click', getDetailsFromServer);
&
success: postToPage
this then hooks up the actual functions as function pointers and thus the actual functions will be fired when you want them to be.
so your final code will look like:
$('.linkDetails').on('click', getDetailsFromServer);
function getDetailsFromServer() {
$.ajax({
type: 'GET',
url: '/someURL/text.txt',
success: postToPage
});
}
function postToPage(data) {
$('.textDetails').text(data);
console.log(data);
}
what Arun P Johny said is right! but your code has another probloem
$('.linkDetails').on('click', getDetailsFromServer);
try above
The same origin policy implemented by browsers prevents local file system urls... if the page and the files are in same folders it might work.
See SOP for file URI for FF