I have 2 pages one is chart page and another one is detail page. On click the chart bar I get the value and pass it to post method and get the response from another page.
Chart page:
$('.bar').click(function() {
$.ajax({
url: 'detail',
dataType: 'json',
data: filtervalues_rightclick,
type: 'post',
success: function(response) {
url_value = 'http://domain/detailview';
$url = url_value + response.query_string;
window.open($url, "_blank");
}
});
});
Get the value from the detail view. I want to retail the post response in second page (detail_view) even in page refresh. So I have passed the value in the URL. Is there any other way without passing parameter in the URL?
Yes, you can set cookie in the AJAX request like below and the use it on other page:
$('.bar').click(function() {
$.ajax({
url: 'detail',
dataType: 'json',
data: filtervalues_rightclick,
type: 'post',
success: function(response) {
url_value = 'http://domain/detailview';
$url = url_value + response.query_string;
setCookie('pageurl', url, 1);
}
});
});
function setCookie(cname, cvalue, exdays) {
var d = new Date();
d.setTime(d.getTime() + (exdays*24*60*60*1000));
var expires = "expires="+ d.toUTCString();
document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
}
Related
So I am basically creating a Restaurant Menu editor for their website. The issue I am having is when the click a category named Brunch, I load the file edit_cat.php via ajax onto the page. All data is passed correctly, but on success of the form being filled out I would like to post a success message on the parent window and am having no luck. Coincidentally, upon success the alert(data) does popup with the response.
edit_cat.php both handles the form submission and is the form
$(document).ready(function(){
$('.editBtn').on('click', function(e) {
e.preventDefault();
var $this = $(this),
id = $this.data('id'),
type = $this.data('type');
if (type == 'cat') {
data = "&cat=" + id;
$.ajax({
data: data,
type: 'POST',
url: 'edit_cat.php',
success: function(data) {
$('#contentLeft').html(data);
}
});
}
});
$('#contentLeft').on('click', 'input[type="submit"]', function(e) {
e.preventDefault();
var $this = $(this),
frm = $('#edit-cat-frm'),
id = $('form').data('id'),
name = $(frm).find('input[name="name"]').val(),
desc = $(frm).find('textarea[name="desc"]').val(),
send = $(frm).find('input[name="submit"]').val();
data = "&cat=" + id + "&name=" + name + "&desc=" + desc + "&submit=" + send;
$.ajax({
data: data,
type: 'POST',
url: 'edit_cat.php',
success: function(data) {
window.parent.$('.left-container-head').innerHtml(data);
}
});
});
});
Can you please try this as simply,
$('.left-container-head').html(data);
Try this:
$(".left-container-head", window.parent.document).html(data);
I need to serialize two forms in the same ajax function with one call. I have tried the following but it just serialize the last one.
function sssssss2(page){
var form1 = document.myform1;
var form2 = document.myform2;
var dataString1 = $(form1).serialize() + '&page=' + page;
var dataString2 = $(form2).serialize() + '&page=' + page;
$.ajax
({
type: "GET",
url: "load_data.php",
data: {dataString1, dataString2}
success: function(ccc)
{
$("#container").html(ccc);
}
});
}
It doesn't work. How may I serialize both of them within the same function?
Try this one
var dataString1 = $(form1).serialize() + '&page=' + page +$(form2).serialize();
data: {dataString1}
I'm working on an existing script at the moment which uses Ajax, something I've never worked with before. I have a variable set in my javascript file which gets its value from an input field on my page. I need to use Ajax to post this to my PHP page only I've no idea where to start,
Im not sure what code you would need to see, but My javascript/AJAX code is, the variable I need to pass is 'var credoff'
$(".getPoint").click(function () {
var theid = $(this).attr("id");
var onlyID = theid.split("_");
var onlyID = onlyID[1];
var credoff = parseInt($(this).children('input.credoff:hidden').val());
$.ajax({
url: 'do.php',
type: 'POST',
data: "userID=" + onlyID,
success: function (data) {
if (data != "success1" && data != "success5") {
$("#" + theid).text(data);
} else {
$("#thediv_" + onlyID).fadeOut("slow");
$('#creditsBalance').fadeOut("slow");
newbalance = parseInt($('#creditsBalance').text());
Wouldit have to be in this format?
data: "userID=" + onlyID,
"credoff=" + credoff
...
data: {
userId: onlyID,
credoff: credoff
},
...
Or you can do this:
data: "userID=" + onlyID + "&credoff=" + credoff
don't forget the ampersand! &
I have built an AJAX function that links to some PHP on the same page. The PHP worked fine but with the AJAX function there is an error and the validation is not taking place.
The AJAX
function contact() {
var ENQemail = $('#ENQemail').val();
var ENQfirstname = $('#ENQfirst_name').val();
var ENQlastname = $('#ENQlast_name').val();
var ENQmessage = $('#ENQmessage').val();
var ENQsecword = $('#ENQsecword').val();
var dataString = 'ENQemail=' + ENQemail + '&ENQfirstname=' + ENQfirstname + '&ENQlastname=' + ENQlastname + '&ENQmessage=' + ENQmessage + '&ENQsecword=' + ENQsecword;
$.ajax({
type: 'POST',
url: 'http://www.divethegap.com/update/contact',
data: dataString,
dataType:'json',
success: function(data) {
$('#ERRemail').html(data.ERRemail);
$('#ERRfirstname').html(data.ERRfirstname);
$('#ERRlastname').html(data.ERRlastname);
$('#ERRmessage').html(data.ERRmessage);
$('#ERRsecword').html(data.secword);
$("#enquiry").effect("shake", { times:4 }, 100);
},
error: function() {
$("#enquiry").effect("shake", { times:4 }, 100);
},
});
}
Could it be that one cannot have the PHP on the same page when using AJAX.
Any ideas,
Marvellous
It is always a good idea to encode request parameters. This may or may not be the source of your problem:
var dataString = 'ENQemail=' + encodeURIComponent(ENQemail) + '&ENQfirstname=' + encodeURIComponent(ENQfirstname) + '...';
Also, it looks like you are telling the AJAX function to send a JSON message (dataType:'json'). However, the data you are passing into it is not a JSON message.
I'm using zend framework, i would like to get POST data using Jquery ajax post on a to save without refreshing the page.
//submit.js
$(function() {
$('#buttonSaveDetails').click(function (){
var details = $('textarea#details').val();
var id = $('#task_id').val();
$.ajax({
type: 'POST',
url: 'http://localhost/myproject/public/module/save',
async: false,
data: 'id=' + id + '&details=' + details,
success: function(responseText) {
//alert(responseText)
console.log(responseText);
}
});
});
});
On my controller, I just don't know how to retrieve the POST data from ajax.
public function saveAction()
{
$data = $this->_request->getPost();
echo $id = $data['id'];
echo $details = $data['details'];
//this wont work;
}
Thanks in advance.
Set $.ajax's dataType option to 'json', and modify the success callback to read from the received JSON:
$('#buttonSaveDetails').click(function (){
var details = $('textarea#details').val();
var id = $('#task_id').val();
$.ajax({
type: 'POST',
dataType: 'json',
url: 'http://localhost/myproject/public/module/save',
async: false,
// you can use an object here
data: { id: id, details: details },
success: function(json) {
console.log(json.id + ' ' + json.details);
}
});
// you might need to do this, to prevent anchors from following
// or form controls from submitting
return false;
});
And from your controller, send the data like this:
$data = $this->_request->getPost();
echo Zend_Json::encode(array('id' => $data['id'], 'details' => $data['details']));
As a closing point, make sure that automatic view rendering has been disabled, so the only output going back to the client is the JSON object.
Simplest way for getting this is:
$details=$this->getRequest()->getPost('details');
$id= $this->getRequest()->getPost('id');
Hope this will work for you.