1. 程式人生 > >小插件: 例 新增操作人 點擊文本框需要展示所有的人員提供選擇彈框 人員信息全部自動帶出來

小插件: 例 新增操作人 點擊文本框需要展示所有的人員提供選擇彈框 人員信息全部自動帶出來

隱藏域 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>&nbsp;&nbsp;查詢&nbsp;  </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>&nbsp;&nbsp;選擇&nbsp;  </a>;
    str += <a href="javascript:void(0);" class="btn btn-danger" data-dismiss="modal">;
    str += <i class="glyphicon glyphicon-remove"></i>&nbsp;&nbsp;取消&nbsp;  </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 },
        ]]
    });

}

小插件: 例 新增操作人 點擊文本框需要展示所有的人員提供選擇彈框 人員信息全部自動帶出來