How to send data to another server using jquery - php

I need to post data to another server using jquery.
Here is the code i am using
$.ajax({
url:"https://www.thewiseagent.com:443/secure/webcontactAllFields.asp",
type:'POST',
data:"ID=" + $ID
+ "&Source=" + $Source
+ "&notifyCc=" + $notifyCc
+ "&notifyBcc=" + $notifyBcc
+ "&noMail=" + $noMail
+ "&CFirst=" + $first
+ "&CLast=" + $last
+ "&Phone=" + $Phone
+ "&Fax=" + $Fax
+ "&CEmail=" + $CEmail
+ "&Message=" + $message,
success: function() {
//window.location.href = "http://www.petlooza.com";
}
});
i got error (302 object moved) in case of firefox/chorme although data is inserting.. but in case of IE data is not entering in external database. In IE i got a Access denied error.
Can anyone have alternative?
I have tried with json and jsonp still same error.
$.ajax({
type: "POST",
url: "https://www.thewiseagent.com:443/secure/webcontactAllFields.asp",
data: dataString,
dataType: "jsonp",
success: function(data) {
}
});

If you want to use $.ajax() and make a request to another domain you must set crossDomain option to true as stated in the documentation
$.ajax({
url:"https://www.thewiseagent.com:443/secure/webcontactAllFields.asp",
type:'POST',
crossDomain: true,
data:"ID="+$ID+"&Source="+$Source+"&notifyCc="+$notifyCc+"&notifyBcc="+$notifyBcc+"&noMail="+$noMail+"&CFirst="+$first+"&CLast="+$last+"&Phone="+$Phone+"&Fax="+$Fax+"&CEmail="+$CEmail+"&Message="+$message,
success: function() {
//window.location.href = "http://www.petlooza.com";
}
});

You could make an AJAX request to a php script on your own server, which then gets the information from the other server and returns it to you jQuery. I can't think of any other way at the moment.

You have a crossdomain problem. Try using jsonp:
$.ajax({
url:"https://www.thewiseagent.com:443/secure/webcontactAllFields.asp",
type:'POST',
dataType: "jsonp",
data:"ID="+$ID+"&Source="+$Source+"&notifyCc="+$notifyCc+"&notifyBcc="+$notifyBcc+"&noMail="+$noMail+"&CFirst="+$first+"&CLast="+$last+"&Phone="+$Phone+"&Fax="+$Fax+"&CEmail="+$CEmail+"&Message="+$message,
success: function(data) {
//window.location.href = "http://www.petlooza.com";
}
});

Related

How to pass array back to PHP using Ajax [duplicate]

Is it possible to work with a response from AJAX request in PHP? I am not really a JS dev so i am polling my hair out with this one.
I have sort of hacked this together:
var base_url = 'http://dev.local/westview/public';
$('select.child_id').change(function() {
var child_id = $('#child_id');
var dataString = 'child_id=' + child_id;
$.ajax({
type: "POST",
url: base_url + "/finance/payment-history",
data: dataString,
dataType: 'html',
success: function(html) {
alert(html);
},
});
return false;
});
The function appears to work ok, it gives me an alert with the correct data.
{"payments":[{"id":"19","child_id":"21","club":"Breakfast Club","term":"Half Term 3","amount":"15.00","pdate":"2015-02-25","notes":"","created_at":"2015-02-11 12:16:32","updated_at":"2015-02-11 12:16:32","starting_debt":"0","debt_start_date":"2015-01-05"},{"id":"20","child_id":"21","club":"After School Club","term":"Half Term 3","amount":"11.50","pdate":"2015-02-25","notes":"","created_at":"2015-02-11 12:16:49","updated_at":"2015-02-11 12:16:49","starting_debt":"0","debt_start_date":"2015-01-05"}]}
I need to be able output this to the user so that it is readable. A lot of guides I find describe replacing data but as it stands there is no data until a child_id is selected.. i then want it show the above data in a readable way.
I have no idea how to start working with the data in my view file(php).
Thanks
[EDIT]updated with working code:
var base_url = 'http://dev.local/westview/public';
$('select.child_id').change(function() {
var response = "";
var child_id = $('#child_id').val();
var dataString = 'child_id=' + child_id;
$.ajax({
type: "POST",
url: base_url + "/finance/payment-history",
data: dataString,
success: function(response) {
var json_obj = $.parseJSON(response);
var output = "<ul>";
for (i=0; i < json_obj.payments.length; i++)
{
var payment = json_obj.payments[i];
var date = moment(payment.pdate).format('Do MMM YYYY');
output += "<li>£" + payment.amount + " - " + date + " (" + payment.club + ")</li>";
}
output += "</ul>";
$('.history-section').html(output);
},
dataType: "html"
});
});
Do like this.
var data = $.parseJSON("your_json");
var output= "<ul>";
for (i=0; i < data.payments.length; i++){
output += "<li>" + data.payments[i].id + ", " + data.payments[i].child_id + "</li>";
}
output += "</ul>";
use
dataType: 'json',
instead
dataType: 'html',
and then use each to fetch the record from response in success function
Use $.parseJSON() For Convert Json Format Data To Array
Right code at sucess of ajax..
Like,
var data = $.parseJSON(html);
data in you get array format of responce
You need to use json_encode() in your php file to send the data back as an array
For example;
$myarray = array("data1"=>"value1","data2"=>"value2");
echo json_encode($myarray);
You can then access the data separately in the js file like this;
success: function(html) {
alert(html.data1);
alert(html.data2);
},
You also need to change the dataType to 'json'
$('input[name=\'product_attribute[' + attribute_row + '][name]\']').catcomplete({
delay: 0,
source: function(request, response) {
$.ajax({
url: 'index.php?route=catalog/attribute/autocomplete&token=<?php echo $token; ?>',
type: 'POST',
dataType: 'json',
data: 'filter_name=' + encodeURIComponent(request.term),
success: function(data) {
response($.map(data, function(item) {
return {
category: item.attribute_group,
label: item.name,
value: item.attribute_id
}
}));
}
});
},
select: function(event, ui) {
$('input[name=\'product_attribute[' + attribute_row + '][name]\']').attr('value', ui.item.label);
$('input[name=\'product_attribute[' + attribute_row + '][attribute_id]\']').attr('value', ui.item.value);
return false;
}
});
You Can map your json something like this

Send large Json data to php via ajax call

I need to post large amount of json data to php file via ajax, but its is showing me 413 entity too large error.
I have tried using data type as json but it still shows the same error.
$.ajax({
url: ajaxURL,
data: "ajax=true&action=manageSavedLayouts&a=" + result + "&b=" + encodeURIComponent(productdb),
success: function(result) {
console.log(result);
// alert(result);
}
});
This is the code i am using to make the ajax call and the variable which is causing problem is productdb.
Any help will be greatly appreciated.
Thanks in advance.
$.ajax({
url: ajaxURL,
type: "POST",
data: {
ajax: true,
action: "manageSavedLayouts",
a: result,
b: productdb
}
success: function(result) {
console.log(result);
}
});
Use type POST, e.g.:
$.ajax({
url: ajaxURL,
type: 'POST',
data: "ajax=true&action=manageSavedLayouts&a=" + result + "&b=" + encodeURIComponent(productdb),
success: function(result) {
console.log(result);
// alert(result);
}
});

Ajax Jquery getting error

var a = $('.level').find(":selected").attr('value');
var b = $('.category').find(":selected").attr('value');
var c = $('.topic').find(":selected").attr('value');
var d = $('.question').val();
$.ajax({
url: "http://localhost/2016/2016_02_15_Quiz/index.php/Admin/getthecompr/" + a + "/" + b + "/" + c,
type: "GET",
dataType: 'json',
data: '',
success: function(data) {
var id = data;
$.ajax({
url: "http://localhost/2016/2016_02_15_Quiz/index.php/Admin/insert4/" + id[0]['id_comprehens'] + "/" + d,
type: "GET",
dataType: 'json',
data: '',
success: function(data) {
alert("Success");
},
error: function() {
alert("Fail")
}
});
},
error: function() {
console.log('Paastoge');
}
});
});
I got trouble making this nested-JQuery-Ajax. In the first Ajax, I take the value of compre_id that I want to use in second Ajax. In the second Ajax, I will insert the id_comprhensive and question in MySQL table. The Problem is, inserting data to SQL table is success. But, instead of displaying "success", fail alert does appear. Is there something problem with this code ?

Ajax disable star rate after vote

i have problem with my rate, my code like below
$(function(){
var href = jQuery(location).attr('href');
$('.rate-it').rating({
required: true,
callback: function(value, link){
$.ajax({
type: "POST",
url: "<? echo base_url('post/rate/'); ?>",
dataType: "json",
data: "&postlink=" + href + "&ratevalue=" + value,
success: function(msg){
$('.rate-it').attr('disabled', true);
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
displayError();
}
});
},
how to set people to can not vote repeatedly?
i'm using codeigniter
$(function(){
var href = jQuery(location).attr('href');
$('.rate-it').rating({
required: true,
callback: function(value, link){
$.ajax({
type: "POST",
url: "<? echo base_url('post/rate/'); ?>",
dataType: "json",
data: "&postlink=" + href + "&ratevalue=" + value,
success: function(msg){
$('.rate-it').attr('disabled', true);
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
displayError();
}
});
},
focus: function(value, link){
var tip = $('#rate-result');
tip[0].data = tip[0].data || tip.html();
tip.html(link.title || 'value: '+value);
},
blur: function(value, link){
var tip = $('#rate-result');
$('#rate-result').html(tip[0].data || '');
}
});
});
If you want someone not to be able to vote repeatedly, you have to disable the button AND check on the server side that this client didn't vote yet.
Otherwise one could intercept the ajax request and repeat it.
You can try it :
In firefox or chrome, browse to your site, type F12, go to the console menu and copy the following :
$.ajax({
type: "POST",
url: "[your url here]",
dataType: "json",
data: "&postlink=" + href + "&ratevalue=" + value,
});
Launching it with ctrl + enter, you send a vote request.
Now put that in a for loop, and you have tons of votes.
Globally, keep in mind that you never clean user input on the client side.

How to stop jQuery .ajax() execution when success is false?

I have this code which works.
$.ajax({
type: "GET",
url: "includes/process.php",
data: "captcha=" + captcha,
success: function(data) {
if(data == 'true')
alert("OK");
else
alert("not ok");
}
});
However I have some more code after that like:
var dataString = 'name='+ name + '&email=' + email + '&phone=' + phone + '&message=' + message;
$.ajax({
type: "POST",
url: "bin/process.php",
data: dataString,
...
...
...etc
However, I need to stop the script when success:function(data) is false.
So, I thought that return false; should stop the execution
success: function(data) {
if(data == 'true') {
alert("OK");
} else {
alert("not ok");
return false;
}
}
, however it is not working and the code after $.ajax is executed anyway.
How to stop the script when the success is false?
Any advice? Thanks in advance.
ADDITIONAL INFO:
I have another ajax call which I want to execute when success is true:
var dataString = 'name='+ name + '&email=' + email + '&phone=' + phone + '&message=' + message;
$.ajax({
type: "POST",
url: "bin/process.php",
data: dataString,
success: function() {
alert ('mail was sent OK');
}
});
How to execute this code only after success of the first ajax call?
Your extra code should be in the callback itself.
$.ajax({
type: "GET",
url: "includes/process.php",
data: "captcha=" + captcha,
success: function(data) {
if (data == 'true') {
alert("OK");
// more code
var dataString = 'name='+ name + '&email=' + email + '&phone=' + phone + '&message=' + message;
// ... second ajax call
} else {
alert("not ok");
}
}
});
You could also add async:false to your AJAX call. This way, the code after won't execute until the request has ended. return false won't do anything either, but you could set a flag in the success function.
var isOk = false;
$.ajax({
type: "GET",
async: false, // prevent the asynchronous call
url: "includes/process.php",
data: "captcha=" + captcha,
success: function(data) {
if (data.length) {
alert("OK");
isOk = true;
}
}
});
if (isOk) {
// do your stuff
}
You can
1) add your additional code to the callback success function
$.ajax({
type: "GET",
url: "includes/process.php",
data: "captcha=" + captcha,
success:function(data){
if(data=='true') {
alert("OK");
//continue here
var datastring = ...
}
else
alert("not ok");
}
});
2) change the ajax call to not be asynchronous by adding this option to the .ajax call
var isSuccess = false;
$.ajax({
type: "GET",
url: "includes/process.php",
data: "captcha=" + captcha,
success:function(data){
isSuccess = (data=='true');
},
async: false
});
Then you can set a var in your success function to tell the rest of your code whether to continue or not.
Since $.ajax() is asynchronous, code after that will execute anyway. You can put the code in success handler. That way, it'll run only if its successful.
AJAX is an asynchronous call (hence the first 'A'). This means that jQuery makes your request and then goes on about its business while waiting for the call to complete.
The code after $.ajax is usually executed before the success function, because the $.ajax call is asynchronous. If you keep it asyncronous, you cannot stop the execution of the other code. You can set in the success function value of a variable in the outer scope and use syncronous code. But maybe it's better to move it in a function, called by the success callback? Anyway, to get better answer, please post more code.
Try this:
$.ajax({
type: "GET",
url: "includes/process.php",
data: "captcha=" + captcha,
success: function(data) {
if (data.length) {
alert("OK");
doMoreStuff(data);
}
}
});
function doMoreStuff(data){
// Code here will only be executed if ajax call is successful.
}

Categories