Question

List<Object1> list = new ArrayList<>();
List<Object2> list = new ArrayList<>();

添加列表按钮用于将代码和值添加到文本框中，如下所示。
ADD 按钮用于将所有输入数据添加到下表中。
DELETE 按钮用于从表格中删除 SUBMIT 按钮用于发布到服务器。

所以我试图做的是

对于按钮添加 而不是添加列表＆lt; - 根本不知道这个！

function Add() {
            var url = "/root/info/add&"+$("#fieldrows").serialize();
            uField(url);
            return false;
        }

        function uField(url) {
            $.ajax({
                type: 'GET'
                url: url,
                async: false,
                success: function(data) {
                    try {
                        var res = eval("("+data+")");
                        if (res.success) {
                            var content="";
                            $.each(res.result, function(i, f) {
                                content+=addRow((i%2==1),f.seq,f.name,....);
                            });
                            $("#fieldrows").find("tbody").html(content);
                            bindFieldLink();
                        } else {
                            alert(res.error);
                        }
                    }catch(e) {}
                }
            });
        }
        function addRow(odd, seq,name,...) {
            var oddS = "odd";
            if (!odd) { oddS = "even"; }            
            var style="";

            var seq="<a id='field_id_"+seq+"' class='fLink' href='#'>"+label+"</a>";
            var row = "<tr class='"+oddS+"'><td class='chk'><input type='checkbox' seq='ids' value='"+seq+"' class='checkbox'></td>";
            row += "<td>"+seq+"</td>";
            row += "<td>"+rexp+"</td>";
            row +="</tr>";
            return row;
        }

调用函数通过ajax调用服务器，不确定 url的 .serialize（）
在服务器上它以JSON身份返回，我也是新手。
之后为结果表构建html。但我不确定bindFieldLink（）是什么。

有人请帮忙。我正在使用JAVA，Spring MVC。非常感谢你。

这篇文章可以结束。

Answer 1

var myJson = [{"name" : "abc", "age" : 50},
          {"age" : "25", "hobby" : "swimming"},
          {"name" : "xyz", "hobby" : "programming"}];

// Builds the HTML Table out of myList.
function buildHtmlTable(selector) {
var columns = addAllColumnHeaders(myList, selector);
for (var i = 0 ; i < myJson.length ; i++) {
    var row$ = $('<tr/>');
    for (var colIndex = 0 ; colIndex < columns.length ; colIndex++) {
        var cellValue = myList[i][columns[colIndex]];
        if (cellValue == null) { cellValue = ""; }
        row$.append($('<td/>').html(cellValue));
    }
    $(selector).append(row$);
 }
}

// Adds a header row to the table and returns the set of columns.
// Need to do union of keys from all records as some records may not contain
// all records
 function addAllColumnHeaders(myList){
   var columnSet = [];
   var headerTr$ = $('<tr/>');
   for (var i = 0 ; i < myList.length ; i++) {
      var rowHash = myList[i];
       for (var key in rowHash) {
          if ($.inArray(key, columnSet) == -1){
              columnSet.push(key);
              headerTr$.append($('<th/>').html(key));
           }
        }
     }
    $(selector).append(headerTr$);
   return columnSet;
   }

HTML：

 <body onLoad="buildHtmlTable('#excelDataTable')">
   <table id="excelDataTable" border="1">
   </table>
 </body>

如何将输入数据（许多数据）添加到同一页面下面的表格中？

1 个答案: