I am new to magento and not so expierenced with ajax. I need to do a ajax request to send the data to the php. I have this code to send the data to the php file:
function Ajax() {
jQuery.ajax({
type: 'POST',
url: "./handler.php",
data: {
source1: catId
},
success: function( data ) {
console.log( data );
},
error: function(jqXHR, textStatus, errorThrown) {
console.log(textStatus, errorThrown);
}
});
}
It seems that the data won't reach the php file. If anyone can help me fix my code, that would be great.
This is JS, so you need the full URL for an ajax request.
url: "http://www.test.com/handler.php",
Related
I am using codeigniter with csrf enabled. i am making some ajax post requests but somehow i am getting 403 post forbidden error. my folder structure is like this i have included this js in which ajax code is written outside of application folder. the code i am using for ajax request is
var data = {
name: $('.name').val(),
crm_csrf_token: $('input[name="crm_csrf_token"]').val()
}
var url = 'http://demo/signup/signup';
$.ajax({
url: url,
dataType: 'json',
type: 'post',
contentType: 'application/json',
data: data,
success: function( data, textStatus, jQxhr ){
console.log(data);
console.log(textStatus);
console.log(jQxhr);
},
error: function( jqXhr, textStatus, errorThrown ){
console.log(jqXhr);
console.log(textStatus);
console.log(errorThrown);
}
});
so where am i going wrong. before making this ajax call i am validating form using javascript too. site_url() and base_url is not accessible outside application forlder too.
you just need to send csrf token via using jquery cookie you can download it from here
https://github.com/js-cookie/js-cookie
now in your ajax call
$.ajax({
url:url,
data:{
"<?php echo $this->security->get_csrf_token_name(); ?>": Cookies.get('your_csrf_cookie_name_in_config')
},
method :"POST",
success:function(data){
$("#city").html(data);
}
});
Try this working for me, I guess its problem with your url. Here i correct this, might be work for you.
JQuery
var data = {
name: $('.name').val(),
crm_csrf_token: $('input[name="crm_csrf_token"]').val()
}
//Url should be index.php/YourControllerName/YourMethodName
var url = '<?php echo base_url(); ?>index.php/demo/signup';
$.ajax({
url: url,
dataType: 'json',
type: 'post',
contentType: 'application/json',
data: data,
success: function( data, textStatus, jQxhr ){
console.log(data);
console.log(textStatus);
console.log(jQxhr);
},
error: function( jqXhr, textStatus, errorThrown ){
console.log(jqXhr);
console.log(textStatus);
console.log(errorThrown);
}
});
CI Controller :
<?php
class demo extends CI_Controller {
public function signup()
{
echo 'Hello World!';
}
}
Greetings!
I have mobile services configured on my Azure database and I am trying to send a POST request to update the data. The service keeps returning a bad request and I fear its because of the format of my JQuery.Ajax request. I have tried a number combinations but I can't see what I'm doing wrong. The schema of the request can be found here (http://msdn.microsoft.com/en-us/library/windowsazure/jj677200.aspx), any help would be appreciated.
function RegisterPatient(){
var wsUrl = "https://vervemobile.azure-mobile.net/tables/ref_*****";
var data = {"YearOfBirth":1970,"Sex":"M","ControlGroupMember":false,"OrganisationID":null,"Type":null}
$.ajax({
url:wsUrl,
type: "POST",
data:data,
beforeSend: function (request)
{
request.setRequestHeader("X-ZUMO-APPLICATION", "******");
request.setRequestHeader("Content-Type", "application/json");
},
success: function(data, textStatus, jqXHR)
{
alert(JSON.stringify(data));
},
error: function (jqXHR, textStatus, errorThrown)
{
alert(JSON.stringify(jqXHR));
console.log(JSON.stringify(jqXHR));
console.log(JSON.stringify(textStatus));
console.log(JSON.stringify(errorThrown));
}
});
}
Thanks in Advance,
Bradley
The request requires a json body to be sent, so you have to stringify your data.
...
$.ajax({
url:wsUrl,
type: "POST",
data: JSON.stringify(data),
...
I am trying to submit a form with the user's inserted data and get the html back from the page called (update.asp).
How do I get the html response and how do I write it to a div on the page? The response would be "success".
If my page throws a 500 or other type of error, how can I handle that?
$('input#btnUpdate').click( function() {
$.ajax({
url: 'update.asp',
type: 'post',
dataType: 'json',
data: $('form#myForm').serialize(),
success: function(data) {
// how do i catch the response? is this the right place?
},
error: function(data) {
// how do I catch the error code here?
}
});
The response from the server in both cases would be passed to the callback as the data variable in your example. Try using console.log(data) inside of your callbacks to see the result in your developer console.
$('input#btnUpdate').click( function() {
$.ajax({
url: 'update.asp',
type: 'post',
dataType: 'json',
data: $('#myForm').serialize(),
success: function(response) {
$("#yourDIV").html(response);
},
error: function (xhr, ajaxOptions, thrownError) {
alert(thrownError); //output, 500
}
});
});
More on this: ajax()
Forgive me, I am a complete JSON newbie here. I'm trying to load a file of json information from an external file, and I'm not sure how I can tell if the information has loaded or not. Here's what I have so far:
$(document).ready(function(){
$.ajax({
dataType: 'json',
success: function(string) {
data = $.parseJSON(string);
console.log(data);
alert(data);
document.write(data);
},
url: 'http://www.site.com/mystuff.php'
});
});
I've tried putting all kinds of stuff to see if the info has loaded, as you can see, and nothing has. How do I know if I've even gotten anything? I would really appreciate any help!
As already pointed out, two things:
You don't need to parse the string when setting the datatype as JSON
Check if the request returned successfully at all
Which could look like this:
$(document).ready(function(){
$.ajax({
dataType: 'json',
success: function(json) {
console.log(data);
},
error : function(xhr, text) {
console.log('An error occurred', xhr, text);
},
url: 'http://www.site.com/mystuff.php'
});
});
When setting the datatype to JSON you also have to make sure that mystuff.php sets the Content-Type header to application/json:
<?php
header('Content-Type: application/json');
?>
No need to parse to json again.. you can directly use the object
Also add the error Function to keep a check if you are getting any error..
$(document).ready(function(){
$.ajax({
dataType: 'json',
beforeSend : function() {
console.log('Before Ajax Request Starts !!');
},
success: function(data) {
console.log(data);
alert(data);
document.write(data);
},
error : function(jqXHR, textStatus, errorThrown) {
alert("Error occurred: " + errorThrown);
},
beforeSend : function() {
console.log('Ajax Request Complete !!');
},
url: 'http://www.site.com/mystuff.php'
});
});
This makes sure you have feedback at every step..
I have a problem to refresh a bloc in my page.
Here is the request:
> $("#pwd_lost_link").click(function(){
alert('1');
$.ajax({
type : 'POST',
url: 'test.php',
dataType: 'json',
data :{"nom" : "akbar"},
success : function(data){
$("#main_bloc").append(data.msg);
alert('2');
},
error : function(XMLHttpRequest, textStatus, errorThrown) {
alert(XMLHttpRequest.responseText);
alert(errorThrown); }
}); })
and here is the php file
<?php
$return['nom'] = "ffrfrfrfr";
echo json_encode($return)
?>
It doesn't work. It give me a status error ( 0 ) and the page is automatically reloaded
Thanks
Michaël
Confusing question Michael, not sure what you mean by "the page is automatically reloaded" but you should do 2 things:
In the $.ajax() method, make sure your success called back is handling the data correctly. You are looking for data.msg but I don't see where .msg comes from.
$.ajax({
type: "GET",
contentType: "application/json; charset=utf-8",
data: {},
dataType: "json",
url: url,
success: function(data) {
// parse data object so you can see what's being returned ex. alert(data) or alert(data[0]) or alert(data.nom)
},
error: function (xhr, status, error) {
// XHR DOM reference: http://www.w3schools.com/dom/dom_http.asp
// check for errors ex. alert(xhr.statusText);
}
});
On the PHP side, you may want to debug there to see what is being received and what you are sending back.
Aside from that using an XHR viewer like Firebug or Chrome's built-in utility (CTRL+SHIFT+I) can be very helpful.
And on a final note, if pwd_lost_link is a link elment a id="pwd_lost_link" href="..." then you will have to stop the browser from following the link before you process the AJAX.
$("#pwd_lost_link").click(function(e) {
e.preventDefault();
alert('1');
$.ajax({
...
});
If you aren't seeing the '1' being alerted then that is definitely your first problem.
You're trying to access data.msg, but your PHP script is only creating data.nom. So data.msg doesn't exist. Try changing data.msg to data.nom and see if this does what you want.