@{ ViewData["Title"] = "維修原因維護"; Layout = "~/Views/Shared/_AMESLayout.cshtml"; } <div class="layui-card"> <div class="layui-card-header"> <div class="layui-form"> <div class="layui-form-item "> <div class="layui-inline"><i class="fa fa-file-text-o fa-fw"></i> @ViewBag.Title</div> </div> <div class="layui-form-item layui-layout-left"> <div class="layui-inline"> <label class="layui-form-label">請選擇群組</label> <div class="layui-input-inline"> <select id="rmaGroup" lay-filter="rmaGroup" lay-verify="required" lay-submit asp-items="@ViewBag.RMAGroupList"> <option value="*">全部</option> </select> </div> <input id="rmaGroupNo" type="hidden" name="rmaGroupNo" value="*" /> <label class="layui-form-label">請選擇類別</label> <div class="layui-input-inline"> <select id="rmaClass" lay-filter="rmaClass" lay-verify="required" lay-submit asp-items="@ViewBag.RMAClassList" > <option value="*">全部</option> </select> </div> <input id="rmaClassNo" type="hidden" name="rmaClassNo" value="*" /> </div> <div class="layui-inline layui-show-xs-block"> <button class="layui-btn layui-btn-sm layui-btn-normal" lay-submit lay-filter="querysubmit"> <i class="layui-icon layui-icon-sm"></i> </button> </div> </div> </div> </div> <div class="layui-card-body"> <table class="layui-hide" id="test" lay-filter="test"></table> </div> </div> @section Scripts{ <script type="text/javascript"> function getRMAClassList(data) { $.ajax( { url: "@Url.Action("GetRMAClassJson", "PPS")", dataType: 'json', data: { "group_no": $("#rmaGroupNo").val()}, //contentType: "application/json", type: 'post', success: function (result) { console.info(result.data); $("#rmaClass").empty();//清空下拉框的值 $.each(result.data, function (index, item) { $("#rmaClass").append(new Option(item.text, item.value));// 下拉菜单里添加元素 //$("#errorClass").append($("<option>").text(item.text).val(item.value)) }); layui.form.render("select");//重新渲染 固定写法 }, error: function (result) { alert(result); } }); }; layui.use(['form', 'layer'], function () { form = layui.form; form.on('select(rmaGroup)', function (data) { $("#rmaGroupNo").val(data.value); getRMAClassList(data.value); var qs = $('button[lay-filter="querysubmit"]'); qs.click(); }); form.on('select(rmaClass)', function (data) { $("#rmaClassNo").val(data.value); var qs = $('button[lay-filter="querysubmit"]'); qs.click(); }); }); //监听表单提交事件 hg.form.onsubmit('querysubmit', function (data) { table && table.reload(data); }); var tableCols = [[ { field: 'rmaReasonNo', width: 200, title: '維修原因代碼' }, { field: 'rmaReasonDesc', width: 400, title: '維修原因描述' }, { field: 'rmaReasonDescEn', title: '維修原因英文描述' }, { field: 'statusNo', width: 200, title: '維修原因狀態' }, { field: 'right', width: 200, title: '操作', fixed: 'right', templet: function (d) { return '<a class="layui-btn layui-btn-normal layui-btn-xs layui-icon layui-icon-edit" lay-event="edit">修改</a> <a class="layui-btn layui-btn-danger layui-btn-xs layui-icon layui-icon-delete" lay-event="del">删除</a>' } }] ]; //通过行tool编辑,lay-event="edit" function edit(obj) { if (obj.data.rmaReasonNo) { var no = rmaGroupNo.value; hg.open('修改維修原因', '/PPS/PPS013U/' + obj.data.rmaReasonNo + ',' + no, 800, 640); } } //通过行tool删除,lay-event="del" function del(obj) { if (obj.data.rmaReasonNo) { hg.confirm("維修原因:" + obj.data.rmaReasonDesc + ",确定要删除吗?", function () { $.ajax({ url: '/PPS/PPS013D', data: { id: obj.data.rmaReasonNo }, type: 'POST', success: function (data) { if (data.success) { obj.del(); //只删本地数据 hg.msghide("删除成功!"); } else { hg.msg(data.msg); } }, error: function () { hg.msg("网络请求失败!"); } }); }); } } var toolbar = [{ text: '新增', layuiicon: '', class: 'layui-btn-normal', handler: function () { var id = rmaClassNo.value; var no = rmaGroupNo.value; hg.open('新增維修原因', '/PPS/PPS013C/' + id + ',' + no, 800, 640); } } ]; //基本数据表格 var table = hg.table.datatable('test', '維修原因維護', '/PPS/GetRMAReasonsByGroupClass/', {}, tableCols, toolbar, true, 'full-100', ['filter', 'print', 'exports']); </script> }