扩展与自定义

动态创建对话框

注意动态创建的对象，在创建之前不可调用，不可赋值。

function createEditDialog(){
    // 定义 easyui-dialog
    let divElement = `
    <div id="editDialog" class="easyui-dialog" data-options="closed:true,left:0,top:0">
    <form id="form_setBadQty" style="width: 100%;height: 100%;">
        <div class="easyui-layout" data-options="fit:true">
            <div id="west" data-options="region:'west',split:false" title="基础信息" style="width:500px;">
                <div class="input-group">
                    <input type="hidden"  id="iid" name="iid" >
                    <input type="hidden"  id="product_plan_dtl_id" name="product_plan_dtl_id">
                </div>

                <table id="table01">
                    <tr>
                        <td><input class="easyui-textbox" id="plan_date" name="plan_date" data-options="label:'生产计划日期：', labelAlign:'right', readonly:true," style="width: 100%"></td>
                        <td><input class="easyui-textbox" id="order_code" name="order_code" data-options="label:'订单号：', labelAlign:'right', readonly:true," style="width: 100%"></td>
                    </tr>
                    <tr>
                        <td><input class="easyui-textbox" id="ct_name" name="ct_name" data-options="label:'客户：', labelAlign:'right', readonly:true," style="width: 100%"></td>
                        <td><input class="easyui-textbox" id="product_coded" name="product_coded" data-options="label:'存货编码：', labelAlign:'right', readonly:true," style="width: 100%"></td>
                    </tr>
                    <tr>
                        <td><input class="easyui-textbox" id="pf_name" name="pf_name" data-options="label:'存货名称：', labelAlign:'right', readonly:true," style="width: 100%"></td>
                        <td><input class="easyui-textbox" id="qty_total" name="qty_total" data-options="label:'过机数量：', labelAlign:'right', readonly:false," style="width: 100%"></td>
                    </tr>
                    <tr>
                        <td><input class="easyui-textbox" id="qty_good" name="qty_good" data-options="label:'良品数：', labelAlign:'right', readonly:false," style="width: 100%"></td>
                        <td><input class="easyui-textbox" id="qty_bad" name="qty_bad" data-options="label:'不良数：', labelAlign:'right', readonly:false," style="width: 100%"></td>
                    </tr>
                </table>
            </div>

            <div data-options="region:'center',split:false" title="不良原因1">
                <table id="table02">
                    <tr>
                        <td><input class="easyui-textbox" id="bad01" name="bad01" data-options="label:'bad01：', labelAlign:'right', readonly:false," style="width: 100%"></td>
                        <td><input class="easyui-textbox" id="bad02" name="bad02" data-options="label:'bad02：', labelAlign:'right', readonly:false," style="width: 100%"></td>
                    </tr>
    
                    <tr>
                        <td><input class="easyui-textbox" id="bad03" name="bad03" data-options="label:'bad03：', labelAlign:'right', readonly:false," style="width: 100%"></td>
                        <td><input class="easyui-textbox" id="bad04" name="bad04" data-options="label:'bad04：', labelAlign:'right', readonly:false," style="width: 100%"></td>
                    </tr>
    
                    <tr>
                        <td><input class="easyui-textbox" id="bad05" name="bad05" data-options="label:'bad05：', labelAlign:'right', readonly:false," style="width: 100%"></td>
                        <td><input class="easyui-textbox" id="bad06" name="bad06" data-options="label:'bad06：', labelAlign:'right', readonly:false," style="width: 100%"></td>
                    </tr>
    
                    <tr>
                        <td><input class="easyui-textbox" id="bad07" name="bad07" data-options="label:'bad07：', labelAlign:'right', readonly:false," style="width: 100%"></td>
                        <td><input class="easyui-textbox" id="bad08" name="bad08" data-options="label:'bad08：', labelAlign:'right', readonly:false," style="width: 100%"></td>
                    </tr>
    
                    <tr>
                        <td><input class="easyui-textbox" id="bad09" name="bad09" data-options="label:'bad09：', labelAlign:'right', readonly:false," style="width: 100%"></td>
                        <td><input class="easyui-textbox" id="bad10" name="bad10" data-options="label:'bad10：', labelAlign:'right', readonly:false," style="width: 100%"></td>
                    </tr>
    
                    <tr>
                        <td><input class="easyui-textbox" id="bad11" name="bad11" data-options="label:'bad11：', labelAlign:'right', readonly:false," style="width: 100%"></td>
                        <td><input class="easyui-textbox" id="bad12" name="bad12" data-options="label:'bad12：', labelAlign:'right', readonly:false," style="width: 100%"></td>
                    </tr>
                </table>
            </div>

            <div data-options="region:'east',split:false" title="不良原因2" style="width:480px;">
                <table id="table03">
                    <tr>
                        <td><input class="easyui-textbox" id="bad13" name="bad13" data-options="labelWidth:'100px',label:'bad13：', labelAlign:'right', readonly:false," style="width: 100%"></td>
                        <td><input class="easyui-textbox" id="bad14" name="bad14" data-options="labelWidth:'100px',label:'bad14：', labelAlign:'right', readonly:false," style="width: 100%"></td>
                    </tr>
                
                    <tr>
                        <td><input class="easyui-textbox" id="bad15" name="bad15" data-options="labelWidth:'100px',label:'bad15：', labelAlign:'right', readonly:false," style="width: 100%"></td>
                        <td><input class="easyui-textbox" id="bad16" name="bad16" data-options="labelWidth:'100px',label:'bad16：', labelAlign:'right', readonly:false," style="width: 100%"></td>
                    </tr>
                
                    <tr>
                        <td><input class="easyui-textbox" id="bad17" name="bad17" data-options="labelWidth:'100px',label:'bad17：', labelAlign:'right', readonly:false," style="width: 100%"></td>
                        <td><input class="easyui-textbox" id="bad18" name="bad18" data-options="labelWidth:'100px',label:'bad18：', labelAlign:'right', readonly:false," style="width: 100%"></td>
                    </tr>
                
                    <tr>
                        <td><input class="easyui-textbox" id="bad19" name="bad19" data-options="labelWidth:'100px',label:'bad19：', labelAlign:'right', readonly:false," style="width: 100%"></td>
                        <td><input class="easyui-textbox" id="sales_price_withtax" name="sales_price_withtax" data-options="labelWidth:'100px',label:'含税销售单价：', labelAlign:'right', readonly:true," style="width: 100%"></td>
                    </tr>
                
                    <tr>
                        <td><input class="easyui-textbox" id="bad_money" name="bad_money" data-options="labelWidth:'100px',label:'不良损失金额：', labelAlign:'right', readonly:true," style="width: 100%"></td>
                    </tr>
                
                    <tr>
                        <td><input class="easyui-textbox" id="bad_source_mill" name="bad_source_mill" data-options="labelWidth:'100px',label:'不良原因-厂家：', labelAlign:'right', readonly:false," style="width: 100%"></td>
                        <td><input class="easyui-textbox" id="bad_source_project" name="bad_source_project" data-options="labelWidth:'100px',label:'不良原因-工程内：', labelAlign:'right', readonly:false," style="width: 100%"></td>
                    </tr>
                </table>
            </div>
        </div>
    </form>
</div>
`
    // 绑定到 body 上
    if ($('#editDialog').length <= 0) {
        $(divElement).appendTo($('body'));
    }
}