如何将html表数据作为数组发布

时间:2014-07-04 12:16:36

标签: php jquery html ajax

这是我的html表代码,其中包含用于填充html表数据的php foreach循环, 我想通过form.serialize将整个表数据作为数组发布到我的控制器 在ajax, 我可以这样做吗??怎么??

<table class="table table-striped table-vcenter table-bordered">
                        <thead>
                        <th>Master Name</th>
                        <th>From No.</th>
                        <th>To No.</th>
                        <th>Total</th>
                        </thead>
                        <tbody>
                            <?php foreach ($master as $name) { ?>
                                <tr class="rc1_tr">
                                    <td class="td_amount"><div id="amount"><?php echo $name['amount']; ?></div></td>
                                    <td id="form_no"><div id="div_to_no"><?php echo $name['receipt_no_to'] ? $name['receipt_no_to'] : '0'; ?></div></td>
                                    <td align='center' class="qt" id="<?php echo $name['id'] ?>" style="width: 250px;"><input type="text" id="to_no" class="quantity" value="" style="text-align:center;width:180px;height:26px;margin-bottom: 2px;"/></td>
                                    <td id="td_total"><div id="total"></div></td>
                                </tr>
                            <?php } ?>
                        </tbody>
                        <tfoot>
                            <tr class="grand_total">
                                <td colspan="3">Grand Total</td>
                                <td><div id="div_grand_total"></div></td>
                            </tr>
                        </tfoot>
                    </table>

2 个答案:

答案 0 :(得分:0)

您可以序列化所有输入,试试这个

//dynamic query_string generation
var filters_query_string = "&" + $(".rc1_tr input").map(function (i,e) {
    return $(e).serialize()
    }).toArray().join("&")

$.ajax({url  : $("#your_form").attr('action') +filters_query_string, 
        //other ajax params
        success: function(data) {
            //do stuff
        },
        dataType: 'json' /* return type, f.e: json  */,
        error: function(error) {
           console.log(error);                   
        },
})        

答案 1 :(得分:0)

尝试这种方式..将其内容放在javascript对象中

var rowIndex=0;
var columnIndex=0;
var tableJson = [];
$(".table tr").each(function () {
  var row = $(this);
  $("td", row).each(function () {
    var tdElem= $(this);
    tableJson.push({row=rowIndex,column=columnIndex,value=tdElem.html()});
    columnIndex+=1;
  });
 rowIndex+=1;
});

将此代码放在函数

function getJsonTable(){
   //previous code
  return JSON.stringify(tableJson);
}

并将结果作为jquery ajax调用的data参数传递