post data from table row like json format

Question

this is related to my last question( NOTE: I already got some good answers there). I'm doing a program that will filter. I didn't include this question because i thought that it is easier for me to add text as long as i know how to get the data from the row. But to my dismay, I wasn't able to code a good program til now.

Im currently using this javascript code (thanks to Awea):

$('#out').click(function(){    
   $('table tr').each(function(){
      var td = '';
      $(this).find('option:selected').each(function(){
         td = td + ' ' + $(this).text();
      });
      td = td + ' ' + $(this).find('input').val();
      alert(td);
   });
})

my question is: How to add text before the data from the row? like for example, this code alert the first row like data1.1 data1.2 data1.3,

then the second row like data2.1 data2.2 data2.3,

I want my output to be displayed like this

[ {"name":"data1.1","comparison":"data1.2", "value":"data1.3"}, {"name":"data2.1","comparison":"data2.2", "value":"data2.3"}, {"name":"data3.1","comparison":"data3.2", "value":"data3.3"} {.....and so on......}]

but before that happen, i want to check if all the FIRST cell in a row is not empty. if its empty, skip that row then proceed to next row.

is there somebody can help me, please...

Answer 1

var a = []; a[0] = "data1.1 data1.2 data1.3" a[1] = "data1.6 data1.2 data1.3" var jsonobj = {}; var c = [] for (var i = 0;i

alert(c); //it will give ["{"name":"data1.1","comp...1.2","value":"data1.3"}", "{"name":"data1.6","comp...1.2","value":"data1.3"}"]

u have to include library for function from JSON.stringify from https://github.com/douglascrockford/JSON-js/blob/master/json2.js

hope this helps

Answer 2

Building on my answer to your previous question, see http://jsfiddle.net/evbUa/1/

Once you have your data in a javascript object (dataArray in my example), you can write the JSON yourself, per my example, but you will find it much easier to use a library such as JSON-js (see this also).

// object to hold your data
function dataRow(value1,value2,value3) {
    this.name = value1;
    this.comparison = value2;
    this.value = value3;
}

$('#out').click(function(){   

    // create array to hold your data
    var dataArray = new Array();

    // iterate through rows of table
    for(var i = 1; i <= $("table tr").length; i++){

        // check if first field is used
        if($("table tr:nth-child(" + i + ") select[class='field']").val().length > 0) {

            // create object and push to array
            dataArray.push(    
                new dataRow(
                    $("table tr:nth-child(" + i + ") select[class='field']").val(),
                    $("table tr:nth-child(" + i + ") select[class='comp']").val(),
                    $("table tr:nth-child(" + i + ") input").val())
            );
        }

    }

    // consider using a JSON library to do this for you
    for(var i = 0; i < dataArray.length; i++){
        var output = "";
        output = output + '{"name":"data' + (i + 1) + '.' + dataArray[i].name + '",';
        output = output + '"comparison":"data' + (i + 1) + '.' + dataArray[i].comparison + '",';
        output = output + '"value":"data' + (i + 1) + '.' + dataArray[i].value + '"}';
        alert(output);
    }
})

Answer 3

There are two things you need to do here. First get the data into an array of objects, and secondly get the string representation.

I have not tested this, but it should give you a basic idea of what to do.

Edit Please take a look at this JS-Fiddle example I've made. http://jsfiddle.net/4Nr9m/52/

$(document).ready(function() {
    var objects = new Array();
    $('table tr').each(function(key, value) {
        if($(this).find('td:first').not(':empty')) {
        //loop over the cells
        obj = {};
        $(this).find('td').each(function(key, value) {
                var label = $(this).parents('table').find('th')[key].innerHTML;
                obj[label] = value.innerHTML;

        });
        objects.push(obj);

        }
    });
    //get JSON.
    var json = objects.toSource();
    $('#result').append(json);
});