jquery:How do i attach an array to form request and send it to php in Jquery

Question

var subtbl = $(this).attr('data-counter');
                 var stunbr = $(this).attr('data-stunbr');
                var m = 0;
                var checkedlines = new Array();
            $.each($("#sub-table"+subtbl+"  "+"input:checked"),function (m){            
            var chk_value = $("#chk_"+stunbr+"_"+m).attr('value');
                var txt_value = $("#txt_"+stunbr+"_"+m).attr('value');
              //alert("Txt value --->"+ txt_value +" Chk Value --->"+ chk_value);           
            checkedlines[m] = { STUNBR: stunbr, SNO: chk_value, NAME: txt_value }; 
                m++;          
        });

How do iattach the "checkedlines" to form request in jquery and send it to php .I mean do we need to use $.ajax can you show in attaching "checkedlines[]" Can we produce this array n Json any method available in Jquery to produce JSON How can i consume that in php if it is a plain array .One more thin How do i Iterate through the "checkedlines[]" array outside of the each loop without using the "var r=0 " variable

    var r=0;
    $.each(checkedlines,function(r){
        alert("ASNURNNBR==>"+checkedlines[r]['STUNBR']+"SEQNO==>"+checkedlines[r]['SNO']+"RCVDATY==>"+checkedlines[r]['NAME']);
        r++;
    });

Answer 1

One option would be to serialize the object into a JSON string and write the result into a hidden field inside of a form the user can submit.

<form>

 ...

<input id="json_array" type="hidden" name="json_array" />

 ...

</form>


<script type="text/javascript">

function stringify(obj) {
    var t = typeof (obj);
    if (t != "object" || obj === null) {
        // simple data type
        if (t == "string") obj = '"'+obj+'"';
        return String(obj);
    }
    else {
        // recurse array or object
        var n, v, json = [], arr = (obj && obj.constructor == Array);
        for (n in obj) {
            v = obj[n]; t = typeof(v);
            if (t == "string") v = '"'+v+'"';
            else if (t == "object" && v !== null) v = stringify(v);
            json.push((arr ? "" : '"' + n + '":') + String(v));
        }
        return (arr ? "[" : "{") + String(json) + (arr ? "]" : "}");
    }
};

var checkedLines = {};

//
// Your code populating the checkLines object goes here
//

var jsonResult = stringify(checkedlines);

$('#json_array').val(jsonResult);

</script>

The stringify() function is taken from the JSON.org library.

If you don't want to use a form then yes, $.ajax(); is a way to go. Simply add jsonResult to the data property with a relevant variable name:

$.ajax({
  method: "POST",
  url: 'http://example.com',
  data: "json_array=" + jsonResult,
  success: function(data) {
    $('.result').html(data);
    alert('Load was performed.');
  }
});

Answer 2

ok so here is what you can do. I created an example to show you how it works. It is actualy not using the serializeArray, but the JSON object:

///// if using IE6, you will have to include the following js file into the header of your html document : http://json.org/json2.js /////

// JAVASCRIPT $(document).ready(function() { var names = ["John", "Mike", "Joe"]; var positions = ["flash", "php", "javascript"];

var arr = new Array();
for (var i = 0; i < positions.length; i++){
    arr.push({"firstname": names[i], "position": positions[i] });
};

var json = JSON.stringify(arr);

$.ajax({
  url: "data.php",
  method:"GET",
  data: "json="+json,
   success: function(data){alert("data: "+data);},
  dataType: "text"
});

});

// DATA.PHP $decoded = json_decode($_GET['json']); echo $decoded[0]->firstname;

that works!