小插件: 例 新增操作人 點擊文本框需要展示所有的人員提供選擇彈框 人員信息全部自動帶出來
阿新 • • 發佈:2019-01-15
隱藏域 put end sin nova focus dialog image horizon
效果圖:
描述: 點擊人員input 彈出模態框提供選擇 , 選擇確定後人員信息自動帶入以下文本框
頁面:
<div class="form-group"> <label class="col-md-3 control-label">維修人系統編號:</label> <div class="col-md-8"> <input id="RepairUserAccount" name="RepairUserAccount" onfocus="ShowBaseGetUser(‘RepairUserAccount‘,‘RepairUserName‘,‘RepairUser‘)" style="width: 100%; height: 30px;" type="text" /> </div> </div> <div class="form-group"> <label class="col-md-3 control-label">維修人姓名:</label> <div class="col-md-8"> <input id="RepairUserName" name="RepairUserName" disabled="disabled" style="width: 100%; height: 30px;" type="text" /> </div> </div>
js:
///account用戶編號 、userName系統編號 、userId用戶Id(隱藏域) function ShowBaseGetUser(account, userName, userId) { var str = ‘<div class="modal fade" id="_SendRepairUserModal" tabindex="1000" role="dialog" data-keyboard="false" aria-labelledby="remoteModalLabel" aria-hidden="true">‘; str += ‘<div class="modal-dialog" style="width:550px;">‘; str += ‘<div class="modal-content" id="_SendRepairUserModal_content">‘; str += ‘<div class="modal-body" style="padding-top:2px;padding-bottom: 2px;">‘; str += ‘<div class="row">‘; str += ‘<table id="form_table" class="form-horizontal easyui-form" novalidate="novalidate">‘; str += ‘<tr style="height: 45px;">‘; str += ‘<td class="textright" style="width: 60px">姓名:</td>‘; str += ‘<td class="textright" style="width: 150px">‘; str += ‘<input id="_selUserName" name="_selUserName" class="easyui-validatebox form-control" />‘; str += ‘</td>‘; str += ‘<td class="textright" style="width: 80px">所屬部門:</td>‘; str += ‘<td style="width: 150px">‘; str += ‘<input type="hidden" id="_parentid" name="_parentid" />‘; str += ‘<input id="_parentname" name="_parentname" style="width: 100%; height: 32px;" data-options="" />‘; str += ‘</td>‘; str += ‘<td class="textright" style="width:90px;">‘; str += ‘<a href="javascript:void(0);" type="button" class="btn btn-primary" onclick="$UloadGridUser()">‘; str += ‘<i class="glyphicon glyphicon-search"></i> 查詢 </a>‘; str += ‘</td>‘; str += ‘</tr>‘; str += ‘</table>‘; str += ‘<div class="decinfo">‘; str += ‘<table id="_companyuser_datagrid" style="width: 100%">‘; str += ‘</table>‘; str += ‘</div>‘; str += ‘</div>‘; str += ‘<div class="modal-footer" style="padding-top:2px;padding-bottom: 2px; border-top:0px;">‘; str += ‘<a href="javascript:void(0);" type="button" class="btn btn-success" id="_selectUser">‘; str += ‘<i class="glyphicon glyphicon-ok"></i> 選擇 </a>‘; str += ‘<a href="javascript:void(0);" class="btn btn-danger" data-dismiss="modal">‘; str += ‘<i class="glyphicon glyphicon-remove"></i> 取消 </a>‘; str += ‘</div>‘; str += ‘</div>‘; str += ‘</div>‘; str += ‘</div>‘; $("#form1").after(str); setTimeout(‘$UloadGridUser()‘, 500); $USelloadCombxTree(); $(‘#_SendRepairUserModal‘).modal(‘show‘); //保存 $("#_selectUser").unbind(‘click‘).bind(‘click‘, function (e) { var row = $("#_companyuser_datagrid").datagrid("getSelected"); if (row != null) { if (account != "") { $("#" + account).val(row.Account); } if (userName != "") { $("#" + userName).val(row.UserName); } if (userId != "") { $("#" + userId).val(row.ID); } } $(‘#_SendRepairUserModal‘).modal(‘hide‘); }) } //上級部門下拉選項加載 function $USelloadCombxTree() { $(‘#_parentname‘).combotree({ url: ‘/admin/CompanyAdmin/Hanlder/CompanyService.ashx?function=getCompanyComboxTreeList‘, animate: true, loadFilter: function (rows) { return convert3(rows); }, lines: true, dataPlain: true,//該屬性用以啟用當前 easyui-tree 控件對平滑數據格式的支持 toggleOnClick: false, checkbox: true, enableContextMenu: false, onClick: function (node) { $("#_parentid").val(node.id); $("#_parentname").combotree("setText", node.text); $(‘#_parentname‘).combotree("hidePanel"); }, }); } function $UloadGridUser() { $(‘#_companyuser_datagrid‘).datagrid({ url: ‘/admin/CompanySystemadmin/Hanlder/companyService.ashx?function=getUserListByCompanyId‘, pageSize: 10, pageList: [10, 15, 20, 25], queryParams: { UserName: $("#_selUserName").val(), seleducation: $("#_seleducation").val(), parentid: $("#_parentid").val() }, pagination: true, rownumbers: false, singleSelect: true, fitColumns: true, columns: [[ { field: ‘ck‘, checkbox: true }, { field: ‘Account‘, title: ‘<center>系統編號</center>‘, width: 110 }, { field: ‘UserName‘, title: ‘<center>姓 名</center>‘, width: 80 }, { field: ‘OrgName‘, title: ‘<center>所屬部門</center>‘, width: 160 }, { field: ‘Position‘, title: ‘<center>職務(工種)</center>‘, width: 200 } //{ field: ‘Statue‘, title: ‘<center>狀態</center>‘, width: 60, formatter: StatueFormatter }, //{ field: ‘Sex‘, title: ‘<center>性別</center>‘, width: 60 }, //{ field: ‘Education‘, title: ‘<center>學歷</center>‘, width: 90 }, //{ field: ‘BirthDate‘, title: ‘<center>出生年月</center>‘, width: 100, formatter: dateNYRFormatter }, //{ field: ‘Age‘, title: ‘<center>年齡</center>‘, width: 60 }, //{ field: ‘EntryTime‘, title: ‘<center>進地鐵年月</center>‘, width: 120, formatter: dateNYRFormatter }, //{ field: ‘EnglishName‘, title: ‘<center>英文名</center>‘, width:100 }, // { field: ‘UserType‘, title: ‘<center>用戶類別</center>‘, width: 80, formatter: UserTypeFormatter }, ]] }); }
小插件: 例 新增操作人 點擊文本框需要展示所有的人員提供選擇彈框 人員信息全部自動帶出來