jqgrid页面导航栏没有出现

时间:2012-10-31 12:21:19

标签: jqgrid

我在多选项卡中构建搜索功能,其中用户搜索条件将是一个选项卡,用户搜索结果将位于其他选项卡中。当我第一次搜索时,我在第二个选项卡中使用正确的页面导航栏获得了我的结果。但是,当用户返回上一个选项卡(搜索选项卡)并再次搜索时,我的网格结果将使用适当的值刷新,但我的navgrid未显示。我无法在firebug中找到导航网格的dom以及最初在第一次搜索时出现的dom。

以下是代码段。

function dispSearchResults() {
var no = document.getElementById("stNo").value;
var firstName = document.getElementById("firstName").value;
var lastName = document.getElementById("lastName").value;
var dateOfBirth = document.getElementById("dateOfBirth").value;

document.getElementById("searchContainerModal").innerHTML='<table 
    id="searchResultsTab"  style="width:100%"></table>';

jQuery("#searchResultsTab").jqGrid({
    url : contextPath + '/web/getSearchViewResults.json',
    datatype : "json",
    mtype: "POST",
    postData:{'NO': no, 'FIRST_NAME':firstName, 'LAST_NAME':lastName, 
        'DATE_OF_BIRTH':dateOfBirth},       
    colNames : [ 'no', 'First Name', 'Last Name', 'Date Of Birth'],
    colModel : [ {
        name : 'No',
        index : 'No',
        width : 100,
        align : "center",
        formatter: fmtStateno
    }, {
        name : 'firstName',
        index : 'firstName',
        width : 220,
        align : "left",
        formatter: fmFName
    }, {
        name : 'lastName',
        index : 'lastName',
        width : 220,
        align : "left",
        formatter: fmLName
    }, {
        name : 'dateOfBirth',
        index : 'dateOfBirth',
        width : 120,
        align : "left",
        formatter: fmBirthDate
    }],
    altRows : true,
    altClass : 'oddRow',        
    loadComplete : function() {
        document.getElementById("sResultsTab").style.visibility = 
                                "visible";

        if (jQuery("#searchResultsTab").getGridParam("records")==0) {
          jQuery("#searchResultsTab").addRowData(
                "blankRow", {"No":"No data was found", 
                       "firstName":"", "lastName":"", "dateOfBirth":""}
          );
        }else{              
            $("tr.jqgrow:odd").addClass('oddRow');
        }           
    },
    onCellSelect: function(rowid,iCol,cellcontent,e) {
        // alert(rowid);
        cContent = cellcontent;
        rId = rowid;
    },
    height : 240,
    width : 1165,
    rowNum : 25,
    rowList : [25,50,75,100],
    loadonce: true,
    pagination:true,
    pager : '#searchPagerDiv1',
    sortname : 'no',        
    viewrecords : true,     
    sortorder : "desc",
    caption : "Search Results",
    gridview : true,
    jsonReader : {
        root : "rows",  
        page : "currentPage",
        total : "totalPages",
        repeatitems : false,
        id : "id"                           
    }       
 }).navGrid("#searchPagerDiv1",reloadAfterSubmit: false,
       {edit:false,add:false,del:false});
});

$("#tabs").tabs("select", "#searchResultsTb");
 }

Here are the code snippets 

main jsp for tabs
------------------
&lt;div id="mainContentDiv"&lt;
&lt;div id="tabs" style="background-color: transparent; height:auto"&lt;
&lt;ul id="Tabs1"&lt;
&lt;li id="sCriteriaTab"&lt;&lt;a href="#searchTab"&lt;Search Criteria &lt;/a&lt;   
&lt;/li&lt;
&lt;li id="sResultsTab"&lt; &lt;a href="#searchResultsTb"&lt;Search 
Results&lt;/a&lt;  &lt;/li&lt; 
&lt;/ul&lt;                 
&lt;div id="searchTab" style="background-color: transparent" class="height250"&lt;  
&lt;%@ include file="../search/SearchCriteria.jsp" % &lt; 
&lt;/div&lt;    
&lt;div id="searchResultsTb" style="background-color: transparent;"&lt;     
&lt;%@ include file="../search/SearchResults.jsp" %   
&lt;                    
&lt;/div&lt;
SearchCriteria.jsp
-------------------
&lt;form id="searchForm" name="searchForm"&lt;
&lt;div class="personDetailsDiv" id="personNameInfoDiv"&lt;
&lt;div style="float:right"&lt;
&lt;font class="standardInputTitle"&lt;no&lt;/font&lt;
&lt;input id="No" name="No"  class="standardInputText marginRight50" value="" 
type="text"&lt;&lt;/div&lt; &lt;/div&lt;
........
............
&lt;div class="button-row"&lt;
&lt;a href="javascript:dispSearchResults()" class="button rounded blue effect- 
3"&lt;Search&lt;/a&lt;
&lt;/div&lt;
&lt;/div&lt;    &lt;/form&lt;   

SearchResults.jsp
----------------
&lt;div id="searchContainerModal" style="width:100%"&lt;&lt;/div&lt;
&lt;div id="searchPagerDiv1"&lt;&lt;/div&lt;
&lt;div id="searchPagerDiv" style="width:100%"&lt;
&lt;div id="searchZeroRec" style="display:none;"&lt; Zero Records Found ...   
&lt;/div&lt;
&lt;/div&lt; 

Appreciate your help !!!!

0 个答案:

没有答案