send each element with class name via AJAX to php - php

Hi i'm using the below code to take data and send it to a php page, it works as i want it to but its only sending the first ".order" it comes across, ie. i need to send every element with class="order", would this be some sort of .each()?
$('#submit').click(function(){
var order=$('.order').html();
var dataString = 'order='+ order;
$.ajax
({
type: "POST",
url: "order.php",
data: dataString,
cache: false,
success: function(html)
{
$("#response").html(html);
}
});
});
Did this instead and it now works, bizarre!
$('#submit').live('click',function(){
var order=$('.order').text();
var dataString = 'order='+ order;
$.ajax
({
type: "POST",
url: "order.php",
data: dataString,
cache: false,
success: function(html)
{
$("#response").html(html);
}
});
});

Try var order = $('form').serialize() as explained here http://api.jquery.com/serialize/
Other than this, you must do something like:
$('.order').each(function(){
// Get values from order here... something like: order += $(this).html();
// Also, note that if '.order' are inputs you should use $(this).val() instead of $(this).html();
});
Hope it helps.

I believe this should do it:
var order=$('.order')
.map(function(){ return this.innerHtml; })
.get().join('');
var dataString = 'order='+ order;

Related

How to pass json data to html form?

I am trying to pass json data after successfully received the array, but what i am trying to pass to modal window to edit the values. data is array actually have the values but not passing to the html form.
function passvalue(val,start,end)
{
var id=val;
var start=start;
var end =end;
//var dataString = "id=" + id;
$.ajax ({
type: "POST",
url: "get-results.php",
data: {id:id},
// dataType: 'json',
success: function(data)
{
//console.log(data);
$('#ctemail').val(data.cemail);
}
});
}
And my html is:
Enter Customer Email
I corrected some shortcomings.
function passvalue(val,start,end)
{
var id=val;
var start=start;
var end =end;
//var dataString = "id=" + id;
$.ajax ({
type: "POST",
url: "get-results.php",
data: 'id='+id, // multiple: data: 'id='+id+'&id2='id2,
// dataType: 'json',
success: function(json_data)
{
var data = JSON.parse(json_data); // Json parse
//console.log(data);
$('#ctemail').val(data.cemail);
}
});
}

when I send data with ajax php wont get anything

post and get works fine but json returns wrong value , or something is wrong with my php code.
$(function () {
$('#username').on('keypress',function () {
var input = $('#username').val();
if(input.length>=4){
$.ajax({
url:'registration_php.php',
type: 'POST',
data:{username:input},
success:function () {
$.getJSON('registration_php.php',function (text) {
alert(text.user);
});
}
});
}
});
});
success:function(result) {
var items = JSON.parse(result);
alert(items['user']);
}
pass the result directly to your reponse as an argument like this
you should specify a dataType: "json" in your ajax call
var postData = JSON.stringify({
username: 'value'
});
var request = $.ajax({
url: "registration_php.php",
method: "POST",
dataType: "json",
data: postData,
});
request.success(function( results ) {
console.log(results)
});

how to pass whole data using ajax in php using keypress event

I am passing empcode using key press event, but my whole empcode is not transfered and the last digit is cut.
Here is my code:
$(document).ready(function(){
$("#e_code").keypress(function(){
//var dataString=document.getElementById("e_code").value;
var dataString = 'e_code='+ $(this).val();
$.ajax({
type: "POST",
url: "getdata.php",
data: dataString,
cache: false,
success: function (html) {
$('#details').html(html);
$('#custTrnHistory').show()
}
});
});
});
on getdata file code is
write code in keyup instead of keypress
$("#e_code").keyup(function(){
You can bind your keypress on document --- try this
$(document).on('keypress',"#e_code",function(){
Try this
$(document).ready(function(){
var minlength = 5; //change as per the the length of empcode
$("#e_code").keyup(function () {
var inputvalue= $(this).val();
if (inputvalue.length >= minlength ) {
var dataString = 'e_code='+ $(this).val();
$.ajax({
type: "POST",
url: "getdata.php",
data: dataString,
cache: false,
success: function (html) {
$('#details').html(html);
$('#custTrnHistory').show()
}
});
}
});
});

How to use jquery VALUE in an ajax success function

I cannot use value div name in fourth-last line
I want to use div name in Ajax function in $("divname").html(data);
$('.edit').click(function() {
var object = $(this);
var rowvalue = object.attr('id');
var rowvalue_array = rowvalue.split('_');
var id = rowvalue_array[1];
var comment = $('#comment_'+id).val();
var divname = '#'+id;
var varData = 'id='+id+'&comment='+comment;
console.log(varData);
$.ajax ({
type: "POST",
url: "edit_field.php",
data: varData,
success: function(data) {
$("divname").html(data);
}
});
return false;
});
Use the following code..
$.ajax ({
type: "POST",
url: "edit_field.php",
data: varData,
success: function(data) {
$(divname).html(data);
}
});
Please replace your line as below :
$(divname).html(data);
remove quata (")
divname is variable
or you can use as below :
$("#"+id).html(data);
Try this:
$.ajax ({
type: "POST",
url: "edit_field.php",
data: varData,
success: function() {
$("divname").html($(this).data);
}
});
Why are you accessing the element by id when u have the element.....try
$(object).html(data);

Stop previous ajax when new request is made

I have a script
$('#postinput').on('keyup',function(){
var txt=$(this).val();
$.ajax({
type: "POST",
url: "action.php",
data: 'txt='+txt,
cache: false,
context:this,
success: function(html)
{
alert(html);
}
});
});
Suppose someone types a ,ajax runs . Immediately he types b c and so on. Ajax runs everytime. Is there a way to stop previous request when new is made ?
You can use the abort() method of the xhr. Try this:
var currentXhr;
$('#postinput').on('keyup',function(){
currentXhr && currentXhr.readyState != 4 && currentXhr.abort(); // clear previous request
var txt = $(this).val();
var currentXhr = $.ajax({
type: "POST",
url: "action.php",
data: 'txt=' + txt,
cache: false,
context:this,
success: function(html) {
alert(html);
}
});
});
If you don't want to use a global variable, you could store the xhr in a data-* attribute of the #postinput element.
Another method is to only fire the AJAX request when the user has stopped typing:
var timer;
$('#postinput').on('keyup',function(){
clearTimeout(timer);
var txt = $(this).val();
var timer = setTimeout(function() {
$.ajax({
type: "POST",
url: "action.php",
data: 'txt=' + txt,
cache: false,
context:this,
success: function(html) {
alert(html);
}
});
}, 100); // sends request 100ms after typing stops.
});
You can do like this with Jquery-
jaxRequests = new Array();
queueRequest = function(whatever, you, want) {
if(ajaxRequests[ajaxRequests.length - 1]) {
ajaxRequests[ajaxRequests.length - 1].abort();
}
ajaxRequests[ajaxRequests.length] = //Insert New jQuery AJAX call here.
}

Categories