首页新闻找找看学习计划

【.net开发】jqueryui弹窗bug,多弹出一个空白窗口,求助

0
悬赏园豆:100 [已关闭问题] 关闭于 2016-10-29 23:57

求大神帮助,各位来猜猜也行。你出想法,我来实验

弹窗代码如下:

<!-- Ztree -->

@{Html.RenderPartial("~/Views/Shared/Script.zTree.cshtml");}

<!-- DataSource -->

@{Html.RenderPartial("~/Areas/Core/Views/DepartmentManagement/Department/DataSource.Department.cshtml");}

 

<!-- 选择科室 -->

<div id="select_department_dialog" style="display:none;">

    <div id="select_department_tree_border_div" class="select-department-tree-div">

        <ul id="select_department_z_tree" class="ztree"></ul>

    </div>

</div>

 

<!-- 选择科室样式 -->

<style type="text/css">

    /* ZTree样式 */

    #select_department_dialog .ztree * {

        padding-top: 4.5px;

        font-size: 14px;

        font-family: "microsoft yahei";

    }

 

    /* 科室选择 */

    #select_department_dialog .select-department-tree-div {

        height: 500px; 

        margin-bottom: 10px;  

        /*border: 1px solid #c5c5c5;*/ 

        background-color: #ffffff; 

        border-radius: 4px;

    }

</style>

 

<!-- 窗口初始化 -->

<script type="text/javascript">

    $(function () {

        (function ($) {

            if (!$.isPlainObject($.SelectDepartmentDialog)) {

                /* Dialog命名空间声明 */

                $.SelectDepartmentDialog = {};

                var selectDepartmentDialogID = "select_department_dialog";

                /* 窗口初始化 */

                var selectDepartmentDialog = $("div#" + selectDepartmentDialogID);

                /* 回调函数 */

                var callbackFunction;

                var rootNodeID = "@Common.Enumeration.CommonEnum.Department.ROOT_NODE_ID";

                /* 不能选中的节点 */

                var disabledNodeIDList;

 

                selectDepartmentDialog.dialog({

                    autoOpen: false,

                    closeText: "关闭",

                    height: 500,

                    width: 480,

                    resizable: false,

                    modal: true,

                    title: "选择科室",

                    open: function () {

                        //if (addDepartmentDialog.attr("isMiniUIParse") == "false") {

                        //    mini.parse();

                        //    addDepartmentDialog.attr("isMiniUIParse", "true");

                        //}

                    },

                    buttons: [{

                        text: "保存",

                        icons: {

                            primary: "dialog-button-icon-save"

                        },

                        click: function () {

 

                            /* 判断是否已选中 */

                            var callbackParameterMap = {

                                /* 选中的科室ID selectedDepartmentID */

                                /* 选中的科室Name selectedDepartmentName */

                            };

                           

                            var selectDepartmentZTree = $.fn.zTree.getZTreeObj("select_department_z_tree");

                            var selectNodes = selectDepartmentZTree.getSelectedNodes();

                            if (selectNodes.length == 0) {

                                $.MessageDialog.showMessageDialog({

                                    Message: "请至少选中一个科室!",

                                    ImageType: $.MessageDialog.ImageType.Error

                                });

                                return;

                            }

 

                            if (selectNodes.length > 1) {

                                $.MessageDialog.showMessageDialog({

                                    Message: "最多只能选中一个科室!",

                                    ImageType: $.MessageDialog.ImageType.Error

                                });

                                return;

                            }

 

                            var selectNode = selectNodes[0];

                            var departmentAllParentIDList = selectNode["departmentAllParentIDList"];

                            var departmentAllParentNameList = selectNode["departmentAllParentNameList"];

                            var selectedDepartmentAllParentIDList = "";

                            /* 用于显示的值 */

                            var selectedDepartmentAllParentNameList = "";

                            /* 用于保存的值 */

                            var selectedDepartmentAllParentNameValueList = "";

 

                            if (departmentAllParentIDList == "") {

                                /* 选中的节点没有父节点 */

                                if (selectNode["departmentID"] == rootNodeID) {

                                    /* 如果选中的节点是“顶级科室” */

                                    selectedDepartmentAllParentIDList = "";

                                    selectedDepartmentAllParentNameList = "顶级科室";

                                    selectedDepartmentAllParentNameValueList = "";

                                } else {

                                    selectedDepartmentAllParentIDList = selectNode["id"];

                                    selectedDepartmentAllParentNameList = selectNode["name"];

                                    selectedDepartmentAllParentNameValueList = selectNode["name"];

                                }

 

                            } else {

                                /* 选中的节点含有父节点 */

                                selectedDepartmentAllParentIDList = departmentAllParentIDList + "," + selectNode["id"];

                                selectedDepartmentAllParentNameList = departmentAllParentNameList + "," + selectNode["name"];

                                selectedDepartmentAllParentNameValueList = departmentAllParentNameList + "," + selectNode["name"];

                            }

 

                            callbackParameterMap["selectedDepartmentAllParentIDList"] = selectedDepartmentAllParentIDList;

                            callbackParameterMap["selectedDepartmentAllParentNameList"] = selectedDepartmentAllParentNameList;

                            callbackParameterMap["selectedDepartmentAllParentNameValueList"] = selectedDepartmentAllParentNameValueList;

                            callbackParameterMap["selectDepartmentID"] = selectNode["departmentID"];

 

                            /* 执行回调函数 */

                            if ($.isFunction(callbackFunction)) {

                                selectDepartmentDialog.dialog("close");

                                callbackFunction(callbackParameterMap);

                            }

                        }

                    }, {

                        text: "取消",

                        icons: {

                            primary: "dialog-button-icon-cancel"

                        },

                        click: function () {

                            selectDepartmentDialog.dialog("close");

                        }

                    }],

                    close: function (event, ui) {

 

                    }

                });

 

                /* 渲染科室树 */

                var renderSelectDepartmentZTree = function (departmentList, currentSelectedDepartmentID, ifHasTopNode, currentSelectedDepartmentAllParentID) {

                    var selectDepartmentZTree = $.fn.zTree.getZTreeObj("select_department_z_tree");

                    var parentIcon = "/Image/Core/DepartmentManagement/parent.png";

                    var leafIcon = "/Image/Core/DepartmentManagement/leaf.png";

                    var treeNodesArray = [];

                    if (ifHasTopNode == "1") {

                        treeNodesArray[0] = {

                            id: rootNodeID,

                            pId: "",

                            name: "顶级科室",

                            departmentID: rootNodeID,

                            departmentAllParentIDList: "",

                            departmentAllParentNameList: "",

                            open: true,

                            isParent: true,

                            icon: parentIcon,

                            iconOpen: parentIcon,

                            iconClose: parentIcon

                        }

                    }

                   

                    for (var i = 0; i < departmentList.length; i++) {

                        var departmentItem = departmentList[i];

                        var departmentID = departmentItem["DepartmentID"];

                        var departmentNextLevelNodeCount = departmentItem["DepartmentNextLevelNodeCount"];

 

                        var isParentFlg = false;

                        var iconSkinName = leafIcon;

                        if (departmentNextLevelNodeCount != "0") {

                            isParentFlg = true;

                            iconSkinName = parentIcon;

                        }

 

                        treeNodesArray[treeNodesArray.length] = {

                            id: departmentID,

                            pId: departmentItem["DepartmentParentID"],

                            name: departmentItem["DepartmentName"],

                            departmentID: departmentID,

                            departmentAllParentIDList: departmentItem["DepartmentAllParentID"],

                            departmentAllParentNameList: departmentItem["DepartmentAllParentName"],

                            open: false,

                            isParent: isParentFlg,

                            icon: iconSkinName,

                            iconOpen: iconSkinName,

                            iconClose: iconSkinName

                            // click: "departmentZTreeNodeClick('" + isParentFlg + "','" + departmentID + "')"

                        };

                    }

                    var setting = {

                        data: {

                            //数据是否采用简单 Array 格式,默认false

                            simpleData: {

                                enable: true

                            }

                        },

                        view: {

                            fontCss: setDepartmentZTreeNodeFontCss

                            //fontCss: { color: "red"} 

                        },

                        callback: {

                            /* 展开 */

                            beforeExpand: onSelectDepartmentZTreeBeforeExpand,

                            /* 单击 */

                            beforeClick: onSelectDepartmentZTreeBeforeClick

 

                        },

                        expandSpeed: "normal",

                        treeNodeKey: "id",           //在isSimpleData格式下,当前节点id属性

                        treeNodeParentKey: "pId",    //在isSimpleData格式下,当前节点的父节点id属性

                        showLine: true,              //是否显示节点间的连线

                        checkable: false             //每个节点上是否显示 CheckBox

                    };

                    var treeObj = $.fn.zTree.init($("#select_department_z_tree"), setting, treeNodesArray);

                    if (typeof(currentSelectedDepartmentAllParentID)!= "undefined" && currentSelectedDepartmentAllParentID != "") {

                        /* 迭代目前选中节点的父节点集合,将这些节点添加到Ztree中,才能定位到该节点 */

                        var currentDepartmentParentIDList = currentSelectedDepartmentAllParentID.split(',');

                        searchDepartmentZtreeSelectNodeByIteration(currentDepartmentParentIDList, currentSelectedDepartmentID);

                    } else {

                        /* 默认选中 */

                        var selectedNode = treeObj.getNodeByParam("departmentID", currentSelectedDepartmentID, null);

                        //选中默认节点

                        treeObj.selectNode(selectedNode);

                    }

                }

 

                /* 设置字体颜色。(不可选节点的字体颜色需要特别设置:当前修改节点及其子节点) */

                var setDepartmentZTreeNodeFontCss = function (treeId, treeNode) {

                    if (typeof (disabledNodeIDList) == "undefined" || disabledNodeIDList.length == 0)

                    {

                        return {};

                    }

                    /* 不可选节点集合中含有当前元素 */

                    if (disabledNodeIDList.indexOf(treeNode["departmentID"]) >= 0) {

                        return { color: "#ccc9c9" };

                    }

                };

 

                /* 单击节点事件:不可选节点单击后不能选中 */

                var onSelectDepartmentZTreeBeforeClick = function (treeId, treeNode) {

                    if (typeof (disabledNodeIDList) == "undefined" || disabledNodeIDList.length == 0) {

                        return true;

                    }

 

                    /* 不可选节点集合中含有当前元素 */

                    if (disabledNodeIDList.indexOf(treeNode["departmentID"]) >= 0) {

                        return false;

                    }

                };

 

                /* 迭代展开Ztree,默认选中调用dialog前已选的节点 */

                var searchDepartmentZtreeSelectNodeByIteration = function (currentDepartmentParentIDList, currentSelectedDepartmentID) {

                    if (currentDepartmentParentIDList.length == 0) {

                        var treeObj = $.fn.zTree.getZTreeObj("select_department_z_tree");

                        /* 默认选中 */

                        var selectedNode = treeObj.getNodeByParam("departmentID", currentSelectedDepartmentID, null);

                        //选中默认节点

                        treeObj.selectNode(selectedNode);

                        return;

                    }

                    var loadPagePanel = mini.loading("正在查询科室信息...", messageDialogTitle);

                    var errorFunction = function () {

                        $.MessageDialog.showMessageDialog({

                            Message: "查询科室信息失败!",

                            ImageType: $.MessageDialog.ImageType.Error

                        });

                        mini.hideMessageBox(loadPagePanel);

                    };

 

                    var treeObj = $.fn.zTree.getZTreeObj("select_department_z_tree");

                    var parentNode = treeObj.getNodeByParam("departmentID", currentDepartmentParentIDList[0], null);

 

                    //var childNodes = parentNode.children;

                    //if (typeof (childNodes) != "undefined") {

                    //    return;

                    //}

 

                    /* 之前未查询过,需要调用ajax进行查询子节点 */

                    var conditionMap = {

                        "DepartmentParentID,Eq": currentDepartmentParentIDList[0]

                    };

                    var resultMap = {};

                    //when + 渲染 + 父节点处理+移除 +迭代

                    $.when(

                        $.DataSource.Department.searchDepartmentList($.Deferred(), conditionMap, resultMap, "resultDepartmentList")

                    ).done(function () {

                        /* 科室信息 */

                        if (!$.isArray(resultMap["resultDepartmentList"])) {

                            errorFunction();

                            return;

                        }

                        var resultDepartmentList = resultMap["resultDepartmentList"];

                        /* 渲染Ztree:将每次查询到的子节点赋值给Ztree */

                        renderSelectDepartmentZTreeBySearchResult(resultDepartmentList, parentNode);

                        /* 此处执行nodeList拼接节点 */

                        var nodeList = new Array();

                        /* 设置子节点。判断+ 加到父ID集合中+回调迭代方法 */

                        if (resultDepartmentList.length > 0) {

                            for (var i = 0; i < resultDepartmentList.length; i++) {

                                var departmentTreeDataMap = resultDepartmentList[i];

                                nodeList.push(departmentTreeDataMap);

                            }

                            /* 移除第一个元素 */

                            currentDepartmentParentIDList.shift();

                            /* 迭代展开 */

                            searchDepartmentZtreeSelectNodeByIteration(currentDepartmentParentIDList, currentSelectedDepartmentID);

                        }

                        mini.hideMessageBox(loadPagePanel);

 

                    }).fail(function () {

                        errorFunction();

                        return;

                    });

                   

                };

 

                /* 展开树节点  */

                var onSelectDepartmentZTreeBeforeExpand = function (treeId, treeNode) {

                    /*  treeId:对应 zTree 的 treeId; treeNode:要展开的父节点 JSON 数据对象*/

                    /* 判断是否有子节点,若有,则说明展开过,就不再进行查询TODO 还是设置一个“是否展开过属性”比较好? */

                    var childNodes = treeNode.children;

                    if (typeof (childNodes) != "undefined") {

                        return;

                    }

 

                    var departmentID = treeNode["departmentID"];

                    /* 查询该节点下的子节点信息 */

                    var conditionMap = {

                        "DepartmentParentID,Eq": departmentID

                    };

                    /* 查询结果集合 */

                    var resultMap = {

                    };

 

                    var loadPagePanel = mini.loading("正在查询科室信息...", messageDialogTitle);

                    var errorFunction = function () {

                        $.MessageDialog.showMessageDialog({

                            Message: "查询科室信息失败!",

                            ImageType: $.MessageDialog.ImageType.Error

                        });

                        mini.hideMessageBox(loadPagePanel);

                    };

                    $.when(

                        $.DataSource.Department.searchDepartmentList($.Deferred(), conditionMap, resultMap, "resultDepartmentList")

                    ).done(function () {

                        /* 科室信息 */

                        if (!$.isArray(resultMap["resultDepartmentList"])) {

                            errorFunction();

                            return;

                        }

                        renderSelectDepartmentZTreeBySearchResult(resultMap["resultDepartmentList"], treeNode);

                        mini.hideMessageBox(loadPagePanel);

                    }).fail(function () {

                        errorFunction();

                        return;

                    });

 

                };

 

                /* 根据每次的查询结果渲染Ztree */

                var renderSelectDepartmentZTreeBySearchResult = function (resultDepartmentList, treeNode) {

                    /* 渲染ZTree信息,将查出来的节点信息添加到ZTree上 */

                    var departmentList = $.CommonFunction.decodeObjectList(resultDepartmentList);

                    var newTreeNodesArray = [];

                    for (var i = 0; i < departmentList.length; i++) {

                        var departmentItem = departmentList[i];

                        var departmentID = departmentItem["DepartmentID"];

                        var departmentNextLevelNodeCount = departmentItem["DepartmentNextLevelNodeCount"];

                        var parentIcon = "/Image/Core/DepartmentManagement/parent.png";

                        var leafIcon = "/Image/Core/DepartmentManagement/leaf.png";

 

                        var iconSkinName = leafIcon;

                        var isParentFlg = false;

                        if (departmentNextLevelNodeCount != "0") {

                            isParentFlg = true;

                            iconSkinName = parentIcon;

                        }

                        newTreeNodesArray[newTreeNodesArray.length] = {

                            id: departmentID,

                            pId: departmentItem["DepartmentParentID"],

                            name: departmentItem["DepartmentName"],

                            departmentID: departmentID,

                            departmentAllParentIDList: departmentItem["DepartmentAllParentID"],

                            departmentAllParentNameList: departmentItem["DepartmentAllParentName"],

                            open: false,

                            isParent: isParentFlg,

                            icon: iconSkinName,

                            iconOpen: iconSkinName,

                            iconClose: iconSkinName

                            //click: "departmentZTreeNodeClick('" + isParentFlg + "','" + departmentID + "')"

                        };

                    }

 

                    var selectDepartmentZTree = $.fn.zTree.getZTreeObj("select_department_z_tree");

                    /* 方法二: 为解决重复添加问题,先删除原有子节点,再添加 */

                    //selectDepartmentZTree.removeChildNodes(treeNode);

                    selectDepartmentZTree.addNodes(treeNode, newTreeNodesArray);

                };

 

                /* 显示“科室选择”窗口 */

                $.SelectDepartmentDialog.showSelectDepartmentDialog = function (option) {

                    /* 当前已有科室,应该默认选中。父节点没问题,叶子节点应该展开至其所在位置:20160722解决了此问题  */

                    /* 将所有父节点迭代,查询出来目前已选中的节点,即可定位。 */

                    /* 0721 添加科室时,需要“顶级科室”节点。其他时候暂不用该节点。故修改为可控方式 ifHasTopNode(0:没有顶级节点。1:有顶级节点) */

                    /* 0811 disabledNodeIDList 不可选节点ID集合  */

                    var currentSelectedDepartmentID = option["currentSelectedDepartmentID"];

                    var currentSelectedDepartmentAllParentID = option["currentSelectedDepartmentAllParentID"];

 

                    callbackFunction = option["Callback"];

                    /* 默认没有顶级节点 */

                    var ifHasTopNode = "0";

                    if (typeof (option["ifHasTopNode"]) != "undefined") {

                        ifHasTopNode = option["ifHasTopNode"];

                    }

 

                    disabledNodeIDList = option["disabledNodeIDList"];

 

                    var loadPagePanel = mini.loading("正在查询科室信息...", messageDialogTitle);

                    var errorFunction = function () {

                        $.MessageDialog.showMessageDialog({

                            Message: "查询科室信息失败!",

                            ImageType: $.MessageDialog.ImageType.Error

                        });

                        mini.hideMessageBox(loadPagePanel);

                    };

 

                    var conditionMap = {

                        "DepartmentParentID,Eq": "@Common.Enumeration.CommonEnum.Department.ROOT_NODE_ID"

                    };

                    /* 查询结果集合 */

                    var resultMap = {

                    };

                    $.when(

                        $.DataSource.Department.searchDepartmentList($.Deferred(), conditionMap, resultMap, "resultDepartmentList")

                    ).done(function () {

                        /* 科室信息 */

                        if (!$.isArray(resultMap["resultDepartmentList"])) {

                            errorFunction();

                            return;

                        }

                        /* 渲染选择科室窗口 */

                        renderSelectDepartmentZTree($.CommonFunction.decodeObjectList(resultMap["resultDepartmentList"]),

                            currentSelectedDepartmentID, ifHasTopNode, currentSelectedDepartmentAllParentID);

                       

                          selectDepartmentDialog//这里是文档开头定义的选择器,如果直接在这里写选择器是可以解决问题的,但师傅说可能是引包的问题,问问各位大神可能是什么问题。

                            .dialog("option", "position", { my: "center", at: "center", of: window })

                            .dialog("open");

                        mini.hideMessageBox(loadPagePanel);

 

                    }).fail(function () {

                        errorFunction();

                        return;

                    });

                };

            }

        })(jQuery)

    });

</script>

 

最后html渲染出的代码是这样的:

 


stagebo的主页 stagebo | 初学一级 | 园豆:132
提问于:2016-10-28 10:17
< >
分享
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册