Question

Hello I need to save multi values and update database using ajax.. I’m working on Yii framework..

in the first I need to send data using ajax as json but I have wrong on results.

Live code:
http://jsfiddle.net/kxJwp/2/

My javascript code is:

$("#save").live('click', function(){
    var showtimes = [];
    var values = {};
    $('li inputs').each(function() {
        values[$(this).attr('name')] = $(this).val();
    });
    $('li').each(function(i) {
        showtimes[i]=values;
    });
    alert(JSON.stringify(showtimes));
});

Javascript output:

It’s output last one li values x number of li

inputs:

<li>
    <input name="show_id" class="show_id att" type="hidden" value="" />
    <input name="movie_id" class="movie_id att" type="hidden" value="" />
    <input name="cinema_id" class="cinema_id att" type="hidden" value="" />
    <input name="status" class="status att" type="hidden" value="" />
    <input name="times" class="timesArray att" type="hidden" value="" />
<li>
<li>
    <input name="show_id" class="show_id att" type="hidden" value="" />
    <input name="movie_id" class="movie_id att" type="hidden" value="" />
    <input name="cinema_id" class="cinema_id att" type="hidden" value="" />
    <input name="status" class="status att" type="hidden" value="" />
    <input name="times" class="timesArray att" type="hidden" value="" />
<li>

Answer 1

You are seeing only one row because you have only one object, whereas you need an array of objects, so declare an array first, and then keep adding the objects to it. Something like this:

$("#save").live('click', function(){
  var showtimes = [];    // Create empty javascript array
  var objec={};
  $("li").find("input").each(function(index) {           // Iterate over inputs

    objec=new Object; // to create a new object for every matched element

    objec[$(this).attr('name')]=$(this).val()+'avla';
    showtimes[index]=objec;  // Add object to array
  });

  var json = JSON.stringify(showtimes);
  alert(json);
});

Code explanation:
Use the inbuilt index of each(), by passing the index to the function like: function(index){...}.

Edit: objec=new Object; is needed to avoid getting repeated values, because each time the same object was getting added to the array, but with new, a new object is created each time and that is added to the array.

Update: A better way to select the lis would be using a selector such as : $("li:has(input)") and then cycle through the children:

$("#save").live('click', function(){
    var showtimes = [];
    var values = {};
    $("li:has(input)").each(function(i){
        values = new Object;
        $(this).children().each(function(){
            values[$(this).attr('name')]=$(this).val();
        });
        showtimes.push(values);
    });
    alert(JSON.stringify(showtimes));
});

Edit: The output(arrays formed) in both the above samples is different.

Output for code sample 1:

json=[{"show_id":"1avla"},{"movie_id":"2avla"},{"cinema_id":"3avla"},{"status":"4avla"},{"times":"5avla"},{"show_id":"6avla"},{"movie_id":"7avla"},{"cinema_id":"8avla"},{"status":"9avla"},{"times":"0avla"}]

Output for code sample 2:

json=[{"show_id":"1","movie_id":"2","cinema_id":"3","status":"4","times":"5"},{"show_id":"6","movie_id":"7","cinema_id":"8","status":"9","times":"0"}]