I have the below function that I used in two different pages and worked perfectly in both cases. Suddenly my pages stopped updating and I got the error $.ajax not a function.
function update_report(data) {
var request = $.ajax({
url: "report?poids="+data,
type: "GET",
dataType: "html"
});
request.done(function(msg) {
$("#yw2").html(msg);
});
request.fail(function(jqXHR, textStatus) {
alert( "Request failed: " + textStatus );
});
req ="a";
}
I then changed the $ to jQuery. Then it started sending AJAX requests but it didnt get the relative URL. Like I was generating the request from a page like /index.php/link1 and my code was sending request to /index.php/report rather then /index.php/link1/report
So, then I changed my url: to "link1/report=?"+data then it started sending request to the right page but couldnt update the response as it didnt find the div #id. Got error
TypeError: $(...) is null
What can cause all this issue and how to fix this? And why $.ajax suddenly stopped working, though I didnt make any changes?
JQuery can be not available by $.ajax(). Check if jQuery.ajax() is available or you included jquery twice.
You should not require jquery manually. The best way to include jquery is using Yii::app()->clientScript->registerCoreScript('jquery'). Path for library is set in config/main.php.
Related
I am trying to delete a post when clicking the (x) icon using Ajax request
here is my html code relating to this part :
I copied the JS and php parts from google , I've never written an Ajax request before
so I cannot figure out where I did wrong, please help
It seems that you have a problem with the right location of the php file.
It seems to be located on /static/delete.php, but you are calling /post/delete.php.
Other than that, you are not (at the moment) using DELETE, but POST.
Some frameworks use the POST as the method, but require some extra field (like _method on Laravel) to be present on the form, as some (if not all) HTTP servers do not accept methods other than GET or POST
$('#btnDeleteEmployees').click(function () {
$.ajax({
url: '/api/employees' + empID,
method: 'DELETE',
headers: {
"Content-Type": "application/json"
},
success: function (res) {
},
error: function (res) {
}
});
});
I have the following ajax request:
var value = $.ajax({
type: "POST",
url: "url.php",
data: { $(someform).serialize(), something: test_number },
cache: false,
async: true
}).success(function(data){
alert("success!");
}).error(function() {
console.log("FAILED");
});
But it is logging FAILED although the url is right. What happens is that the page refreshes the page and the php query isn't done. I guess there are no errors within the url... any idea on why this happens?
You are kind of mixing methods to send your POST data. You can't serialize a query strong and then also append additional data to it using javascript object construct. You will likely need to manually append the last data element to the query string like this:
data: $(someform).serialize() + '&something=' + encodeURIComponent(test_number),
Of course there could still be a problem on the server-side script which is causing a non-200 HTTP response code (and triggering error handler). You just need to fix this first, and if you still have a problem, debug the server-side issue.
I have a jquery issue, I think it's a jquery issue, but I'm calling a php page with a ajax call. Obviously this is easy, but when I go live with it I keep getting a 500 error. I have tried everything I can think of. But I'm not getting anywhere. I'm sure it's because I'm not a jquery guru, so if you are I could use your brain.
keep in mind this works locally but not in production:
$('#submit').on('click', function(e){
e.preventDefault();
if($('#signupForm').valid())
{
var data = $('#signupForm').serializeObject();
$.ajax({
type: "POST",
url: 'http://pathtooweb.com/funcs/signup.php',
data: data,
success: function(data) {
toastr.success(data, "Thank you!");
$("#signupForm").trigger( "reset" );
},
error: function(xhr, ajaxOptions, thrownError) {
console.log(xhr.responseText);
}
});
}
});
Here is the actual issue I am getting on console:
POST http://pathtooweb.com/funcs/signup.php 500 (Internal Server Error) jquery.js:7845
x.support.cors.e.crossDomain.send jquery.js:7845
x.extend.ajax jquery.js:7301
(anonymous function) pathtooweb.com/:84
x.event.dispatch jquery.js:4676
y.handle
UPDATE:
This was not a cross domain issue, it was a server error in a way.. come to find out when I was pushing my code up to github then down to my server one of the libraries I was using was not uploading to github, so in turn wasn't being pulled down to the server. Can't really say why there was no .gitignore file. so anyway, thanks for the "suggestions". :)
Dude I guess you are trying a cross domain POST..!! Which is not allowed via ajax.. and is a strict NO NO as per web standards.!!
Possibly locally you are using a different URL in the ajax request.. which is also hosted locally.. Is it the case??
If you want a cross domain POST.. directly post the form to that URL by having the form action URL as the crossdomain URL.
The second option will be to use jsonP as the datatype in the ajax request.. this is a hack but works.
//MAKE AJAX CALL TO REPOPULATE TABLE
var newData = 'page_number=1&type=2';
$.ajax({
type: 'POST', // HTTP method POST or GET
url: 'http://www.myurl.net/form_validate.php', //Where to make Ajax calls
dataType:'text', // Data type, HTML, json etc.
data:newData, //post variables
success:function(response){
//REFORMAT UPON SUCCESSFUL AJAX CALL
alert(response);
},
error:function (xhr, ajaxOptions, thrownError){
alert(xhr + " " + ajaxOptions + " " + thrownError); //throw any errors
}
});
All I've put in my PHP file is:
<?php echo "test"; ?>
When I go straight to that file, it echoes 'test.' When I try to run the AJAX function on the click of a button it gives me the error:
[object Object] error
in an alert window. I've put the absolute URL to the file because I was thinking that the relative linking I was using was wrong but it now seems like it's some other issue. Am I overlooking a simple syntax error? Sorry if this is super basic but I can't seem to figure this out after working on it for a really long time. Thanks for your help.
The problem is your absolute url . Some browsers have problems dealing with absolute urls, consider it as a cross-domain request and block it even if it's not a cross-domain request. You should try with relative url instead
The problem might be in the url, try with relative path instead of absolute.
You named the file was in the same folder as the .js file, so try
url: '/directory_path_to_the_same_folder_as_the_JS_file/form_validate.php',
Try using done with jQuery.post instead.
For example:
jQuery.post('form_validate.php', data).done(
function(data, textStatus, jqXHR) {
alert(jqXHR.responseText);
}).fail(function(jqXHR, textStatus, errorThrown) {
alert(jqXHR.responseText);
}).complete(function() {
// Common code when request completes
});
If your error is [object Object] error NOT FOUND then the reason is
the specified url in AJAX is not correct.
If your error is [object Object] error INTERNAL SERVER ERROR , its
because of the error in your server file ie the php file ,error like variables not defined correctly etc..
Some times error may occur due to cross domain, if you have not
specified headers when in case your php file is not in the same
domain
Hope this helps
Thank you
function abc(){
var ret=true;
$.ajax({
type: 'POST',
url: 'send_password.php',
data: 'mail_to=mymail&new_password=pwd',
async:false,
success: function(response){
},
error: function(r){
ret=false;
}
});
return ret;
}
alert(abc());
Have a look at this testfiddle
I am working on a seemingly basic mobile app (first). But I want to enable the application to request information from our 'head' server. To make sure it has the latest information.
I'm currently running a jQuery script like this.
$.ajax({
url: 'http://www.domain.com/list.php',
dataType: 'json',
crossDomain: true,
success: function(data) {
// Remove all content first
$(contentId +' li').remove();
// Load Data
$.each(data.items, function(index, list){
$(contentId).append('<li><a href="details.html?id=' + list.homeId + '" >' + list.name + '</a></li>\n');
});
// Reload View
$(contentId).listview('refresh');
},
error: function(jqXHR, textStatus, errorThrown) {
console.log('Error: '+ jqXHR + textStatus + errorThrown);
}
});
And actually on that LIST.PHP file, it does return a JSON string. But what I did for security was by adding this as a header
header("Access-Control-Allow-Origin: *");
Or I could change * to a domain/url to add better security. But if I don't add that header() code in their, my javascript breaks and won't run properly.
I guess what i'm truly wondering is, am I doing this properly? or is there a better way to do this? I have tried JSONP, but I can't seem to get that to work for cross domain.
Is my solution sound? or total crap? Any thoughts or direction would be greatly appreciated!
I think you should look into JSONP. It's not that hard. On the client side, jQuery already handles it out of the box, just append a ?callback=? to the URL. On the server, instead of just responding with JSON, e.g.:
{
"foo": "bar"
}
Look for the query parameter callback, and if it exists, wrap your JSON output in a function call with the name being the value of the callback parameter, so, for callback=foo:
foo({
"foo": "bar"
})
When responding with JSONP, send Content-Type: text/javascript. This should work without setting Access-Control-Allow-Origin or anything like that.