Question

单击“查找”按钮时如何关闭搜索弹出窗口。在jqgrid中搜索数据后，我点击Find按钮，Search popup未关闭。搜索到的数据已过滤，但弹出窗口未关闭。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
        <script src="<%=request.getContextPath()%>/js/jquery-1.9.1.js" type="text/javascript" ></script>
        <script src="<%=request.getContextPath()%>/js/jquery.jqGrid.min.js" type="text/javascript"></script>
        <link rel="stylesheet" type="text/css" href="<%=request.getContextPath()%>/style/colorbox.css" />
        <link rel="stylesheet" type="text/css" media="screen" href="<%=request.getContextPath()%>/style/jquery-ui.css" />
        <link rel="stylesheet" type="text/css" media="screen" href="<%=request.getContextPath()%>/style/ui.jqgrid.css" />
        <script type="text/javascript" src="<%=request.getContextPath()%>/js/jquery-ui.js"></script>
        <script type="text/javascript" src="<%=request.getContextPath()%>/js/jquery-validation.js"></script>
        <script type="text/javascript" src="<%=request.getContextPath()%>/js/jquery.colorbox.js"></script>
        <script type="text/javascript" src="<%=request.getContextPath()%>/js/grid.locale-en.js"></script>

    <script type="text/javascript">
        $(document).ready(function(){
            //jqGrid
            $("#usersList").jqGrid({
                url:'<%=request.getContextPath() %>/Admin/getAllUsersList',
                datatype: "json",               
                colNames:['Edit','Primary Email','Active','First Name','Middle Name','LastName','Mobile Number','Cloud Url', 'Cloud User Name','Cloud Folder'],
                colModel:[
                    {name:'userId',search:false,index:'userId',width:30,sortable: false,formatter: editLink},                       
                    {name:'email',index:'user.primaryEmail',width:150},
                    {name:'isActive',index:'user.isActive',width:80},
                    {name:'firstName',index:'firstName', width:100},
                    {name:'middleName',index:'middleName', width:100},
                    {name:'lastName',index:'lastName', width:100},
                    {name:'mobileNo',index:'user.mobileNo', width:100},
                    {name:'cloudUrl',index:'user.cloudUrl', width:200},
                    {name:'cloudUserName',index:'user.cloudUserName', width:120},
                    {name:'cloudFolderName',index:'user.cloudFolderName', width:120},
                    ],
                    rowNum:20,
                    rowList:[10,20,30,40,50],
                    rownumbers: true,  
                    pager: '#pagerDiv',
                    sortname: 'user.primaryEmail',  
                    viewrecords: true,  
                    sortorder: "asc",
                    autowidth:'true',
            });
            $('#gridContainer div:not(.ui-jqgrid-titlebar)').width("100%");
            $('.ui-jqgrid-bdiv').css('height', window.innerHeight * .65);
            $('#load_usersList').width("130");
            $("#usersList").jqGrid('navGrid','#pagerDiv',{edit:false,add:false,del:false});
            $(".inline").colorbox({inline:true, width:"20%"});
        });

        function editLink(cellValue, options, rowdata, action)
        {
            return "<a href='<%=request.getContextPath()%>/Admin/editUser/" + rowdata.userId + "' class='ui-icon ui-icon-pencil' ></a>";
        }
    </script>
</head>

<body>
<div style="" class="wrapper">
    <div style="height:10px; clear:both;"></div>
    <div class="ContentHolder">
        <div class="bgcolorblack">
            <div style="clear:both;"></div>
            <div style="padding:10px;">
                <div id="gridContainer">
                    <table id="usersList"></table>
                    <div id="pagerDiv"></div>
                </div>
            </div>
        </div>
    </div>
</div>

Answer 1

在jqgrid中提及closeAfterSearch:true后问题得以解决。

单击“查找”按钮时，搜索弹出窗口将关闭。

<强>代码：

$("#usersList").jqGrid('navGrid','#pagerDiv',{edit:false,add:false,del:false},{},{},{}, {closeAfterSearch:true});

单击jqgrid中的find按钮后关闭搜索弹出窗口

1 个答案: