单列数据用表格显示

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 为后台返回的数据