SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Evangelist
    Join Date
    Apr 2005
    Location
    London, UK
    Posts
    506
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    jquery/ajax post array data

    hello guys,

    I'm passing data to a jquery/ajax that in turns pass the data to a php program. this works fine when i post singular values, but i cannot get it to work when passing an array of data, i need to know how I can capture the array of data and pass on as an array.

    my html form:

    PHP Code:
    while($result mysql_fetch_object($run)){
    //dynamically generate input
    <input type="text" name="id[]" id="id" class="input" value="1" />
    <
    input type="text" name="price[]" id="price" class="input" value="2.00" />

    jquery:
    PHP Code:
    var price = $("input#price").val();
    var 
    id = $("input#id").val();

     
    var 
    dataString '&price=' price '&id=' id;

    $.
    ajax({
    type"POST",
    url"../web20forms/edit_template_1.php",
    datadataString,
    success: function() {
    $(
    '#editpriceoflessondiv').html("<div id='message'></div>");
    $(
    '#message').html("Thank you<br />Signup was successful!")
    .
    hide()
    .
    fadeIn(1500, function() {
             
            });
          } 
    so the bit of code i need to change is:
    var dataString = '&price=' + price + '&id=' + id;

    and maybe the section in the data: as well.

    i need my jquery/ajax to send back this type of array:
    PHP Code:
    array(5) { ["id"]=>  array(4) { [0]=>  string(2"27" [1]=>  string(2"28" [2]=>  string(2"29" [3]=>  string(2"30" } ["price"]=>  array(4) { [0]=>  string(4"1.00" [1]=>  string(4"1.00" [2]=>  string(4"1.00" [3]=>  string(4"1.00" } ["submit_tmp_lessons_x"]=>  string(3"135" ["submit_tmp_lessons_y"]=>  string(2"12" ["submit_tmp_lessons"]=>  string(4"Save" 
    thanks

  2. #2
    SitePoint Wizard bronze trophy chris.upjohn's Avatar
    Join Date
    Apr 2010
    Location
    Melbourne, AU
    Posts
    2,197
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    A typical solution these days is to use JSON to return arrays to a JS script, to do this in your PHP script use json_encode() like the example below

    PHP Code:
    echo json_encode(array());
    exit; 
    In your $.ajax() source add the method dataType and the value json which would look like the example below

    Code JavaScript:
    $.ajax({
        dataType: 'json'
    });

    Then in your success function you should be able to simply call the array values using

    Code JavaScript:
    $.ajax({
        dataType: 'json',
        success: function(data){
            alert(data.id[0]);
        }
    });

  3. #3
    SitePoint Evangelist
    Join Date
    Apr 2005
    Location
    London, UK
    Posts
    506
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by SgtLegend View Post
    A typical solution these days is to use JSON to return arrays to a JS script, to do this in your PHP script use json_encode() like the example below

    PHP Code:
    echo json_encode(array());
    exit; 
    In your $.ajax() source add the method dataType and the value json which would look like the example below

    Code JavaScript:
    $.ajax({
        dataType: 'json'
    });

    Then in your success function you should be able to simply call the array values using

    Code JavaScript:
    $.ajax({
        dataType: 'json',
        success: function(data){
            alert(data.id[0]);
        }
    });
    I have tried this, but it won’t work. when I add the dataType: "json", my jquery form wont even submit. I have the latest jquery lib. Is there any other way to do this? Is it not possible to loop through my array when posted to my jquery/ajax than somehow pass it back to my php as an array so I can process it?

    Thanks

  4. #4
    SitePoint Evangelist
    Join Date
    Apr 2005
    Location
    London, UK
    Posts
    506
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I have now slightly modified my jquery/ajax to this:

    PHP Code:
     $(".button").click(function() {
        
             var 
    price = $("input#price").val();
            var 
    id = $("input#id").val();
            
            var 
    dataString = {pricepriceidid};
            
    //var dataString = '&price=' + price + '&id=' + id;
                    
            
    $.ajax({
          
    type"POST",
          
    url"../web20forms/edit_template_1.php",
          
    datadataString.serialize(),
          
    dataType"json",
          
    success: function(data) {
            $(
    '#editpriceoflessondiv').html("<div id='message_1'></div>");
            $(
    '#message_1').html(data)
            
            .
    hide()
            .
    fadeIn(1500, function() {
            
            });
          }
         });
        return 
    false;
        }); 
    so I have change this:
    var dataString = '&price=' + price + '&id=' + id;

    to this:
    var dataString = {price: price, id: id};

    and on my php it's coming out as:
    array(2) { ["price"]=> string(5) "12.00" ["id"]=> string(1) "6" }

    this is good, but I need to know how to loop this bit of jquery/ajax:

    var dataString = {price: price, id: id};

    so that is pass all instances of the data.

    anyone?


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •