动态表格的生成及数据保存 【脚本-生成表单 插入表单】

Q：如何生成动态表格及数据的保存和展示？

A: 1、在表单定义计算脚本用于表格的生成和数据的解析，脚本如下：

1. var dynamic_table = (function(){
   
2.    var dynamic_table = {};
   
3.    dynamic_table['create'] = function () {
   
4.       var row_sql = "select * from tlk_row_form";
   
5.           var rows = queryBySQL(row_sql);
   
6.           var col_sql = "select * from tlk_column_form";
   
7.           var cols = queryBySQL(col_sql);
   
8.           var html = "";
   
9.           html += "<table class='dynamic_table'>";
   
10.           html += "   <thead>";
    
11.           html += "                <tr><th> </td>";
    
12.           for(var col_iter = cols.iterator(); col_iter.hasNext();) {
    
13.                 html += "<th>" + col_iter.next().getItemValueAsString("column_name") + "</th>";
    
14.           }
    
15.           html += "     </tr>";
    
16.           html += "   </thead>";
    
17.           html += "   <tbody>";
    
18.           
    
19.           for(var row_iter = rows.iterator(); row_iter.hasNext();) {
    
20.             html += "     <tr>";
    
21.                 var row_name = row_iter.next().getItemValueAsString("row_name");
    
22.                 html += "        <td>" + row_name + "</td>";
    
23.                 for(var col_iter = cols.iterator(); col_iter.hasNext();) {
    
24.                         var col_name = col_iter.next().getItemValueAsString("column_name");
    
25.                         html += "<td><input name='" + row_name + "_" + col_name   + "'/></td>";
    
26.                 }
    
27.             html += " </tr>";
    
28.           }
    
29.           html += "   </tbody></table>";
    
30.   html += "<script>(function(){ " +
    
31. 
    
32.                         "        var json_data = jQuery.parseJSON(jQuery('input[_name=json_data]').val()); "+
    
33.                        
    
34.                         "        jQuery('.dynamic_table').find('input').each(function(){ " +
    
35.                         "        jQuery(this).val(json_data[jQuery(this).attr('name')]); " +
    
36.                         "        }); " +
    
37.                         "})();</script>";
    
38.           return html;          
    
39.    };
    
40.    
    
41. 
    
42.    
    
43.    return dynamic_table;
    
44. })();
    
45. 
    
46. dynamic_table.create();

复制代码

2、定义隐藏字段，用于保存动态表格中文本框的数据信息，例子的隐藏字段名为json_data；
3、在表单的保存按钮的动作执行前加上脚本，用于构建动态文本框的json数据保存到隐藏字段中，脚本如下：

1. var params = getParamsTable();
   
2. var parameters = params.getParams();
   
3. var json_data = "{";
   
4. for(var iterator = parameters.entrySet().iterator(); iterator.hasNext();) {
   
5.    var nt = iterator.next();
   
6.    var name = nt.getKey().toString();
   
7.    var val =  nt.getValue().toString();
   
8.    if(name.startsWith("row")) {//用于判断动态生成的文本框
   
9.         if(val == null) {
   
10.                   val = "";
    
11.                 }
    
12.             json_data += """ + name + "":"" + val + "",";
    
13.    }         
    
14. }
    
15. var lastIndex = json_data.lastIndexOf(",");
    
16. if (lastIndex > -1) {
    
17.   json_data = json_data.substring(0, lastIndex) + json_data.substring(lastIndex + 1, json_data.length);         
    
18. }
    
19. json_data += "}";
    
20. 
    
21. params.setParameter("json_data", json_data);
    
22. getCurrentDocument().findItem("json_data").setValue(json_data);
    
23. true;
    
24. 
    

复制代码

注意事项：动态文本框名字要有规律，例子中的名字均是以row开头