Home >Web Front-end >JS Tutorial >jQuery+json realizes the method of dynamically creating complex tables

jQuery+json realizes the method of dynamically creating complex tables

高洛峰
高洛峰Original
2016-12-09 09:17:161655browse

The example in this article describes the method of dynamically creating complex tables with jQuery+json. Share it with everyone for your reference, the details are as follows:

function SetSubTable() {
  var obj = jQuery.parseJSON($("#SubJsonStrValue").val());
  window.ALLPARAMTERS = obj;
  var row_str = "";
  var span_num = 1
  for (var i = 0; i < obj.length; i++) {
    if (obj[i].ParamNames.length > 0) {
      row_str += &#39;<tr><td rowspan="&#39; + obj[i].ParamNames.length + &#39;"><input type="checkbox" name="_&#39;+obj[i].Id+&#39;" />&#39; + obj[i].Name + &#39;</td>&#39;;
      for (var j = 0; j < obj[i].ParamNames.length; j++) {
        if (j != 0) {
          row_str += "<tr>";
        }
        row_str += &#39;<td><input type="checkbox" name="p_&#39;+obj[i].ParamNames[j].Id+&#39;_&#39;+obj[i].Id+&#39;" />&#39; + obj[i].ParamNames[j].Name + &#39;</td><td>&#39;;
        for (var k = 0; k < obj[i].ParamNames[j].ListItems.length; k++) {
          row_str += obj[i].ParamNames[j].ListItems[k].Name+"|";
        }
        row_str = row_str.substring(0, row_str.length - 2);
        row_str += "</td><td>";
        if (obj[i].ParamNames[j].CanMultiSelecte) {
          row_str += "多选";
        } else {
          row_str += "单选";
        }
        row_str += "</td></tr>";
      }
    }
  }
  $("#sub_table_header").after(row_str);
}


Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn