单列数据用表格显示

Question

请教大神，在前端显示成图3的效果，后台数据的数量是乱的，最多可能有80条，还要有提交数据的功能，请问代码要如何写？

Answer 1

简单看下问题，要的效果是把数据库的四条记录，放到table中。
那么肯定是可以拿到这四条记录的list的，假如是List<T> list。
下面，把list传到前台，然后循环遍历就可以了。

var html = '<tr>';
for(var i = 0,i<list.length;i++)
{
    html += '<td>"list[i].zi"</td>';
}
html += '</tr>';

这个问题关键在于，有多少行和列。所以，搞清楚有多少tr和td就可以了。

Answer 2

var trs = '<tr>';

    for(var i=0;i<80;i++){
        if(i==9 || i==19 || i==29 || i==39 || i==49 || i==59 || i==69){
            if(i<d.mxs.length){
                trs += '<td style="padding: 0px;"><input type="text" name="data['+i+'][zl]" value="'+d.mxs[i]['zl']+'" class="layui-input" autocomplete="off"></td></tr><tr>';
            }else{
                trs += '<td style="padding: 0px;"><input type="text" name="data['+i+'][zl]" class="layui-input" autocomplete="off"></td></tr><tr>';
            }          
        }else{
            if(i<d.mxs.length){
                trs += '<td style="padding: 0px;"><input type="text" name="data['+i+'][zl]" value="'+d.mxs[i]['zl']+'" class="layui-input" autocomplete="off"></td>';
            }else{
               trs += '<td style="padding: 0px;"><input type="text" name="data['+i+'][zl]]" class="layui-input" autocomplete="off"></td>'; 
            }
            
        }
                   
    }
    trs += '</tr>';$('#goodsKc-form-table tbody').append(trs);

d.mxs 为后台返回的数据