web JS JSP 动态列，我也不太懂是个什么鬼。。。。

Question

web显示的一个信息管理Java插件，主要是说什么web显示的表，对象属性是放在一种动态列的机制里（什么鬼）
大意就是表一的一个对象，比如说人，大概就有
名字 年龄 性别 身高 体重 这里就有5列了
张三 20 男 170 60
而显示表二，另外一种对象，比如说一个器件，可能就只有
名称 规格 备注 变成了3列了，这就是所谓的动态列。。。
量尺 10-20 无
本人不懂web前端，特来求大神调教，话不多说，上代码：
这是action：
public JSONObject ssss() throws Exception {
String flbmID = request.getParameter("parentid");
JSONArray json = new JSONArray();
JSONObject jn = new JSONObject();
long total = 0;
try {
JSONArray array = JSONArray.fromObject(webservice
.doSearchBmFlTreeSX(flbmID));
List list = new ArrayList();
for (SXMCBean wuziflmx : list) {
jn.put("Col1", wuziflmx.getCol1());
jn.put("Col2", wuziflmx.getCol2());
jn.put("Col3", wuziflmx.getCol3());
jn.put("Col4", wuziflmx.getCol4());
jn.put("Col5", wuziflmx.getCol5());
jn.put("Col6", wuziflmx.getCol6());
jn.put("Col7", wuziflmx.getCol7());
jn.put("Col8", wuziflmx.getCol8());
jn.put("Col9", wuziflmx.getCol9());
jn.put("Col10", wuziflmx.getCol10());

            json.add(jn);
        }
        jn.put("Rows", json);
    } catch (JSONException e) {
        e.printStackTrace();
    }
    return jn;
}

这是。。。set，get存值取值？本人小白，见谅哈。。。：
public class SXMCBean {
private String  col1;
private String  col2;
private String  col3;
private String  col4;
private String  col5;
private String  col6;
private String  col7;
private String  col8;
private String  col9;
private String  col10;
public String getCol1() {
    return col1;
}
public void setCol1(String col1) {
    this.col1 = col1;
}
public String getCol2() {
    return col2;
}
public void setCol2(String col2) {
    this.col2 = col2;
}
public String getCol3() {
    return col3;
}
public void setCol3(String col3) {
    this.col3 = col3;
}
public String getCol4() {
    return col4;
}
public void setCol4(String col4) {
    this.col4 = col4;
}
public String getCol5() {
    return col5;
}
public void setCol5(String col5) {
    this.col5 = col5;
}
public String getCol6() {
    return col6;
}
public void setCol6(String col6) {
    this.col6 = col6;
}
public String getCol7() {
    return col7;
}
public void setCol7(String col7) {
    this.col7 = col7;
}
public String getCol8() {
    return col8;
}
public void setCol8(String col8) {
    this.col8 = col8;
}
public String getCol9() {
    return col9;
}
public void setCol9(String col9) {
    this.col9 = col9;
}
public String getCol10() {
    return col10;
}
public void setCol10(String col10) {
    this.col10 = col10;
}

}
我也不太懂，不管有用没用我都copy下来了，主要问题是
1：这个动态列只增不减的，如前一次对象是五列，第二次该显示3列，但还是会显示五列，只是多余的没值而已
名称 规格 备注 身高 体重
量尺 10-20 无
2：现在这个动态列上限是到col10,10列，但需要上限是到30，难道我接着在这些代码屁股后面接着按着他的方式直接写到30就ok了吗？这样可以吗？

Answer 1

这是js：
//编码分类变量定义
var manager3;//编码属性列表对象
var manager2;//编码
var gridManager1;//
var gridManager2;//
var bmzhujianid;
var shuxingnr="";//属性内容
var shuxingmc="";//属性名称
$(function(){
$("#layout1").ligerLayout({
leftWidth: 300,
centerBottomHeight:250,
bottomHeight:70
});
$("#MenuName").html("当前位置：编码标准->编码分类->获取编码");
//编码属性别表
manager3=$("#maingrid1").ligerGrid({
columns : [{ display: '编码', name: 'F_BM',width:180 },
{ display: '设备名称', name: 'COL1',width:180
/* render: function (rowdata, rowindex, value)
{
alert(rowindex+"\"+rowdata.COL1);
if(rowdata.COL1==0){
return this.display="" ;
}else{

                      return this.display=rowdata.COL1;
                  }
               }*/
             },
             { display: '设备名称', name: 'COL2',width:180},
             { display: '规格型号', name: 'COL3',width:180},
             { display: '机构名称', name: 'COL4',width:180},
             { display: '工具编号', name: 'COL5',width:180},
             { display: '工具名称', name: 'COL6',width:180},
             { display: '备注', name: 'COL7',width:180},
             { display: '其他', name: 'COL8',width:180},
             { display: '其他', name: 'COL9',width:180},
             { display: '其他', name: 'COL10',width:180},
             { display: '创建时间', name: 'F_CJSJ',width:180 }],
  usePager: true, 
  //url : '../getBmAction!testCol.action',
  //checkbox: true,
  dataAction : 'server',
  onDblClickRow:function (rowdata,rowindex, rowobj){
      f_onSelectRow(rowdata,rowindex, rowobj);
  },
  width: '100%', 
  height:'55%'

});
gridManager1= $("#maingrid1").ligerGetGridManager();
gridManager1.toggleCol('COL1', false);
gridManager1.toggleCol('COL2', false);
gridManager1.toggleCol('COL3', false);
gridManager1.toggleCol('COL4', false);
gridManager1.toggleCol('COL5', false);
gridManager1.toggleCol('COL6', false);
gridManager1.toggleCol('COL7', false);
gridManager1.toggleCol('COL8', false);
gridManager1.toggleCol('COL9', false);
gridManager1.toggleCol('COL10', false);
$("#maingrid1").ligerGetGridManager();
$("#pageloading").hide();

//序号编码属性列表
manager2=$("#maingrid2").ligerGrid({
columns : [{ display: '编码', name: 'F_BM',width:180 },
{ display: '设备资产编号', name: 'F_SBZCBH',width:150},
{ display: '型号', name: 'F_XH',width:150 },
{ display: '设备名称', name: 'F_SBMC',width:180 },
{ display: '设备描述', name: 'F_SBMS',width:180 },
{ display: '创建日期', name: 'CREATE_DATE',width:180 },
{ display: '启用日期', name: 'LAST_MODIFY',width:180 },
{ display: '目前使用部门', name: 'F_MQSYBM',width:180 },
{ display: '备注', name: 'F_SXNR',width:180 }],
//usePager: true,
dataAction : 'server',

width: '100%',
height:'40%'
});
gridManager2= $("#maingrid2").ligerGetGridManager();
gridManager2.toggleCol('F_BZGS', false);
gridManager2.toggleCol('F_SBZCBH', false);
gridManager2.toggleCol('F_XH', false);
gridManager2.toggleCol('F_ZCBH', false);
gridManager2.toggleCol('F_SBMS', false);
//gridManager2.toggleCol('F_SBMC', false);
gridManager2.toggleCol('CREATE_DATE', false);
gridManager2.toggleCol('F_MQSYBM', false);
$("#maingrid2").ligerGetGridManager();
$("#pageloading").hide();
});

//分类编码显示列表 头
function getaddColumns(){
return [{ display: '编码', name: 'F_BM',width:180 },
{ display: '设备名称', name: 'F_SBMC',width:180,
render: function (rowdata, rowindex, value)
{
//alert(rowdata.F_SXNR);
return this.display=rowdata.F_SXNR;
}
},
{ display: '属性名称', name: 'F_SXMC',width:180,
render:function(rowdata, rowindex, value){
return this.display=rowdata.F_SXMC;
}

},
{ display: '规格型号', name: 'F_GGXH',width:180 },
{ display: '机构名称', name: 'F_JGMC',width:180 },
{ display: '工具编号', name: 'F_GJBH',width:180 },
{ display: '工具名称', name: 'F_GJMC',width:180 },
{ display: '其他', name: 'F_TEST',width:180 },
{ display: '创建时间', name: 'F_CJSJ',width:180 },
{ display: '备注', name: 'F_BZ',width:180 }];
}

//选择分类编码获取序号编码数据
function selectRowGetData(){

}

//分类编码列表
function getaddColumnsFLBMLb(){
return [{ display: '编码', name: 'F_BM', align: 'left',width:160},
{ display: '设备资产编号', name: 'F_SBZCBH',width:180 },
{ display: '设备名称', name: 'F_SBMC',width:200 },
{ display: '设备描述', name: 'F_SBMS',width:200 },
{ display: '目前使用部门', name: 'F_MQSYBM',width:200 }];
}
//获取编码数据
function huoqubmsj(){
/*$.ligerDialog.confirm('确定要提交数据吗？', function (yes) {
if(yes){
///var s = JSON2.stringify(gridManageradd.getData());

 }

});*/

var row = gridManager1.getSelectedRow();
if (row==""||row==null){
    alert("请选择1个编码行！");
    return;
}else{
    ////获取的编码数据转换
    var fkbmcode=row.F_BM;
    //传入中间保存参数
    //; new Date().getTime();
    /*bmzhujianid =new Date().getTime();
    alert(bmzhujianid);*/
    $.ajax({
           type: "POST",
           url : '../getBmAction!addFlBMCode.action',
           dataType:"json",
           data : [ {name:'bmflid',value:bmzhujianid},{name:'flbmcode',value:fkbmcode}],
           ///async:true,
           success: function(msg){

           },
           complete:function (data,responseText,textStatus) {         
               /*$.ajax( {
                     type : "POST",
                     url :"../getBmAction!GetFlBmCode.action",
                     data : [{name : 'flbmcode',value : bmzhujianid}],
                     dataType : "json",
                     success : function(msg) {
                         alert("OK");
                         window.location.href="getbmcode.jsp?bmcocde="+bmzhujianid;
                     },
                     complete:function(data,responseText,textStatus){

                     }
                });*/
               ///window.location.href="getbmcode.jsp?bmcocde="+bmzhujianid;

                //var h = (window.screen.availHeight-500)/2;
                //var w = (window.screen.availWidth-420)/2;
                //window.showModalDialog('getbmcode.jsp?bmcode=\''+bmzhujianid+'\'&bmcode2=\''+bmzhujianid+'\'','','height=500, width=420,top='+h+',left='+w+', toolbar=no, menubar=no, scrollbars=no,edge=raised,unadorned=yes, resizable=yes,location=no, status=no');

           }
        }); 
    window.close();
}

}

//获取序号编码数据
function f_onSelectRow(rowdata,rowindex, rowobj){

var row = gridManager1.getSelectedRow();
if (row==""||row==null){
alert("请选择1个编码行！");
return;
}else{
//获取开始时间及结束时间
var starttime=$("#startoftime").val();
var endtime=$("#endoftime").val();
var fobjid_bm=row.F_BM;
///alert("编码："+fobjid_bm+"||"+starttime+"||"+endtime);
//获取序号编码数据
$.ajax({
type: "POST",
url : '../getBmAction!doServiceSearchXHLTm.action?parentid='+fobjid_bm,//序号编码
dataType:"json",
async:true,
success: function(data){
gridManager2.setOptions( {
parms : [ {name : 'flbmid',value :fobjid_bm},//用分类编码ID查询序号编码数据
{name : 'starttime',value :starttime},
{name : 'endtime',value :endtime}],
url : '../getBmAction!doServiceSearchXhBmData.action'
//columns:getaddColumnsFLBMLb()
});
///gridManager2.loadData(true);
},
complete:function (data,responseText,textStatus) {

var getdeleteData=JSON2.stringify(data);
var jsonnn=eval("("+data.responseText+")");
for(var i in jsonnn){
var sxmc=jsonnn[i].F_SXMC;
if(sxmc){
switch (sxmc) {
case "编码":
gridManager2.changeHeaderText('F_BM',jsonnn[i].F_SXMC);
//g.toggleCol('F_SXMC1', true);
//g.getColumnByName();
//var columnnnn=g.columnname="F_BM";
//alert(columnnnn);
break;
case "设备名称":
gridManager2.changeHeaderText('F_SBMC',jsonnn[i].F_SXMC);
gridManager2.toggleCol('F_SBMC', true);
break;
case "备注":
gridManager2.changeHeaderText('F_SXNR1',jsonnn[i].F_SXMC);
gridManager2.toggleCol('F_SXNR1', true);
break;

                      case "创建时间":
                          gridManager2.changeHeaderText('F_CJSJ',jsonnn[i].F_SXMC);
                          gridManager2.toggleCol('F_CJSJ', true);
                      break;
                      case "工具编号":
                          gridManager2.changeHeaderText('F_GJBH',jsonnn[i].F_SXMC);
                          gridManager2.toggleCol('F_GJBH', true);
                      break;
                      case "工具名称":
                          gridManager2.changeHeaderText('F_SXNR',jsonnn[i].F_SXMC);
                          gridManager2.toggleCol('F_SXNR', true);
                      break;

                      case "机构名称":
                          gridManager2.changeHeaderText('F_JGMC',jsonnn[i].F_SXMC);
                          gridManager2.toggleCol('F_JGMC', true);
                      break;

                      case "规格型号":
                          gridManager2.changeHeaderText('F_GGXH',jsonnn[i].F_SXMC);
                          gridManager2.toggleCol('F_GGXH', true);
                      break;
                      case "测试":
                          gridManager2.changeHeaderText('F_TEST',jsonnn[i].F_SXMC);
                          gridManager2.toggleCol('F_TEST', true);
                      break;

                      default:
                        break;
                    }
                  }
               } 
           }
        }); 
}

}

function getBmGridData(btsxmc){
$.ajax( {
type : "POST",
url : '../getBmAction!doServiceSearch2.action?parentid='+nodeid,
///parms : [ {name : 'parentid',value :nodeid}],
dataType : "json",
success : function(data) {
/// alert("OK");
},
complete:function (data,responseText,textStatus) {
var getdeleteData=JSON.stringify(data);
var jsonn=eval("("+getdeleteData.Rows+")");
///return alert(jsonn.Rows);

         /*for(var i in jsonn.Rows){
              //if(jsonn.Rows[i].F_SXNR==btsxmc)
             //return alert(jsonn.Rows[i].F_SXNR);
         }*/
     }
 });

}
//点击查询按钮
function getBmSJChaXun(){
//获取输入编码
var chaxun_bm=$("#bmcode").val();
var flag=$("#bmzhuangtai").val();
$.ajax( {
type : "POST",
url :"../getBmAction!GetFlBmDatabyFlag.action",
data : [{name : 'flbmid',value : chaxun_bm},
{name : 'flag',value : flag}],
dataType : "json",
success : function(msg) {
alert("OK");
}
});
gridManager1.loadData(true);
alert("查询成功！");
}

//关闭添加物资页面窗体

function exit(){
if(!confirm("确认要退出添加物资吗?"))
return;
window.close();

}

//表头头部渲染
function headerRenderColumn(column){

}
//改变列表头内容
function changeHeaderText111(columnparm, headerText)
{

alert(columnparm);
var g = this, p = this.options;
var column;
if (typeof (columnparm) == "number")
{
    column = g.columns[columnparm];
}
else if (typeof (columnparm) == "object" && columnparm['__id'])
{
    column = columnparm;
}
else if (typeof (columnparm) == "string")
{

    if (g._isColumnId(columnparm)) // column id
    {
        column = g._columns[columnparm];
    }
    else  // column name
    {
        $(g.columns).each(function ()
        {
            if (this.name == columnparm)
                g.changeHeaderText(this, headerText);
        });
        return;
    }
}
if (!column) return;
var columnindex = column['__leafindex'];
var headercell = document.getElementById(column['__domid']);
$(".l-grid-hd-cell-text", headercell).html(headerText);
if (p.allowHideColumn)
{
    $(':checkbox[columnindex=' + columnindex + "]", g.popup).parent().next().html(headerText);
}

}