safesite/safesite/templates/equipmentcheckformupdate.html

<div class="easyui-layout" style="width:100%;height:100%;">
    <div data-options="region:'center'" style="height:100%;padding:15px 15px;">
    <form id="jcbff" method="post" name="jcbff" enctype="multipart/form-data">
        <input type=hidden name="id" value={{pk}}>
        <div style="margin-bottom:5px">
                <input id="name" class="easyui-textbox validatebox" name="name" style="width:100%;" data-options="label:'名称'"
                required=true />
        </div>
        <div style="margin-bottom:5px">
            <input id="desc" class="easyui-textbox validatebox" name="desc" style="width:100%;height:80px" data-options="label:'功能描述',multiline:true"
                required=true />
        </div>
        <div class="labeldiv">配置检查条目</div>
        <table width=100% rules=all>
            <thead>
                <tr>
                    <th>
                        
                    </th>
                    <th width="35%">
                        检查项目
                    </th>
                    <th width="15%">
                        检查类型
                    </th>
                    <th width="60%">
                        检查具体内容
                    </th>
                </tr>
            </thead>
            <tbody id="itemsbody">

            </tbody>
        </table>
        <a class="easyui-linkbutton" iconCls="fa-plus" onclick="additems()">添加检查项目</a>
    </form>
    </div>
    <div id='southdiv' data-options="region:'south'" style="height:50px;text-align:center;padding:5px">
        <a href="javascript:void(0)" iconCls="fa-check" class="easyui-linkbutton" onclick="jcbsubmitForm()"
            id="submitb">保存</a>
        <a href="javascript:void(0)" iconCls="fa-close" class="easyui-linkbutton" onclick="closeForm()">取消</a>
    </div>
</div>
<script>
    var typeData
    $.get('api/equipmentcheckform/'+{{pk}},function(res){
                    $('#jcbff').form('load',res)
    $.get('getdickey?dicclass=57&a=combobox',function(res1){
           typeData = res1
           for(var i=0;i<res.items.length;i++){
                        //html = html + '<tr class="items" pk='+res.items[i].id+'><th><button onclick="delitem(this)">删</button></th><th><input class="easyui-textbox name" style="width:90%;height:40px" data-options="multiline:true" value="'+res.items[i].name+'"/></th><th><input class="easyui-textbox content" style="width:100%;height:40px" data-options="multiline:true" value="'+res.items[i].content+'"/></th><tr>'
                            var index =i+1;
        var tr=$('<tr class="items" id="item'+index+'" pk="'+res.items[i].id+'"></tr>');
        tr.append($('<th><button onclick="delitem(this)">删</button></th><th><input class="easyui-textbox name" style="width:100%;height:40px" value="'+res.items[i].name+'"data-options="multiline:true"/></th><th><input id="typex'+index+'" class="easyui-combobox type" value="'+res.items[i].type+'" data-options=""></input></th><th><input class="easyui-textbox content" style="width:100%;height:40px" value="'+res.items[i].content+'"data-options="multiline:true"/></th>'))
        $("#itemsbody").append(tr);
        $.parser.parse(tr);
        $('#typex'+index).combobox({data:typeData})
                    }
        })
                    
                    
                })
    function delitem(o){
        $(o).parent().parent().remove()
    }
    function additems(){
        $.get('getdickey?dicclass=57&a=combobox',function(res){
            console.log(res)
        })
        var index =$("#itemsbody>tr").length;
        var tr=$('<tr class="items" id="item'+index+'"></tr>');
        tr.append($('<th><button onclick="delitem(this)">删</button></th><th><input class="easyui-textbox name" style="width:100%;height:40px" data-options="multiline:true"/></th><th><input class="easyui-combobox type"  data-options="'+ "url:'getdickey?dicclass=57&a=combobox'," + '"></input></th><th><input class="easyui-textbox content" style="width:100%;height:40px" data-options="multiline:true"/></th>'))
        $("#itemsbody").append(tr);
        $.parser.parse(tr);
        //$("#itemsbody").append('<tr class="items"><th><button onclick="delitem(this)">删</button></th><th><input class="easyui-textbox name" style="width:90%;height:40px" data-options="multiline:true"/></th><th><input class="easyui-combobox type" ></input></th><th><input class="easyui-textbox content" style="width:100%;height:40px" data-options="multiline:true"/></th><tr>')
        //$("#xxi").combobox()

    }
    function jcbsubmitForm(){
        var items = new Array();
        $(".items").each(function () {
            let id = $(this).attr('pk')
            let name = $(this).find(".name").val()
            let content = $(this).find(".content").val()
            let type = $(this).find("input.type").combobox("getValue")
            items.push({'id':id,'name':name,'content':content, 'type':type})
        });
        //console.log(items)
        var data = $('#jcbff').serializeJSON();
        data['items']=items
        $.ajax({
            type: "POST",
            url: 'api/equipmentcheckform',
            data: JSON.stringify(data),
            datatype: "json",
            processData: false,
            contentType: "application/json;charset=utf-8",
            beforeSend: function () {
                var bo = $('#jcbff').form('validate')
                if (bo == false) {
                    return bo
                } else {
                    // $('#submitb').linkbutton('disable');
                }
            },
            success: function (data) {
                if (data.code == 200) {
                    $('#jcbtable').datagrid('reload');
                    $("#dd").dialog("close");
                } else { $.messager.alert('提示', '失败!'+data.msg); }
                // $('#submitb').linkbutton('enable');
            },
        });
    }
</script>