2010-07-22 75 views
0

我正在使用Google Maps的本地搜索功能查找特定地址区域中的商户。 结果将被拦截并应显示在JQGrid表中。 我想使用JQGrid的“数组数据”将结果本地插入到网格中。 在这个时候,我有以下代码:JQGrid阵列数据问题 - clientSide

 <script type="text/javascript"> 
     var map = null; 
    var geocoder = null; 

    function initialize() { 
     /* Initialize Google Maps */ 
     if (GBrowserIsCompatible()) { 
     map = new GMap2(document.getElementById("map")); 
     map.setCenter(new GLatLng(50.786916, 6.101360), 16); 
     //map.setUIToDefault(); 
     var customUI = map.getDefaultUI(); 
       customUI.controls.scalecontrol = false; 
       map.setUI(customUI); 
     var options = { 
      onSearchCompleteCallback:function(searcher){ 
       var resultcontent = ''; 
       if (searcher.results && searcher.results.length > 0) { 
        for (var i = 0; i < searcher.results.length; i++) { 
         var result = searcher.results[i]; 

         // Split Address-Lines into Street and No 
         var TempString = result.addressLines[0]; 
         var StreetLine = TempString.split(/\b[0-9]/); 
         // Split Address-Lines to get Zipcode 
         TempString = result.addressLines[1]; 
         var CityLine = TempString.split(/\b[^0-9]/); 

         // Construct the Data Array 
         var InputData = "{Firma:\""+result.titleNoFormatting+"\", Strasse:\""+StreetLine[0]+"\", Hausnummer:\""+StreetLine[1]+"\", Postleitzahl:\""+CityLine[0]+"\", Ort:\""+result.city+"\", Telefonnummer:\""+result.phoneNumbers[0].number+"\"}"; 
         alert(InputData); 
         // Outputs for example: {Firma:"Lukull Pizza Service GbR", Strasse:"Jülicher Straße ", Hausnummer:"6", Postleitzahl:"52070", Ort:"AACHEN", Telefonnummer:"0241 9010080"} 

         // Apply Data to Grid 
         jQuery("#ResultGrid").addRowData(i, InputData); 
        } 
       } 
      } 
     }; 
     localSearch = new google.maps.LocalSearch(options); 
     map.addControl(localSearch); 
     map.removeControl(GScaleControl); 

     geocoder = new GClientGeocoder(); 
     $("#map").hide("fast"); 
     } 
    } 
    function showAddress(address, CompleteAdd) { 
     // Gets an address from database to pinpoint the location 
     if (geocoder) { 
     geocoder.getLatLng(
      address, 
      function(point) { 
      if (!point) { 
       alert(address + " not found"); 
      } else { 
       map.setCenter(point, 16); 
       var marker = new GMarker(point); 
       map.addOverlay(marker); 
       marker.openInfoWindowHtml(CompleteAdd); 
      } 
      } 
     ); 
     } 
     $("#map").show("fast"); 
    } 
     $("#ResultGrid") 
      .jqGrid({ 
       colNames:['ID', 'Firma', 'Strasse', 'Hausnummer', 'Postleitzahl', 'Ort', 'Telefonnummer'], 
       colModel:[ 
       {name:'ID', index:'ID', width:55, editable:false, searchable:false}, 
       {name:'Nachname', index:'Nachname', width:150, editable:false, searchable:false}, 
       {name:'Strasse', index:'Strasse', width:150, editable:false, searchable:false}, 
       {name:'Hausnummer', index:'Hausnummer', width:150, editable:false, searchable:false, sorttype:'int'}, 
       {name:'Postleitzahl', index:'Postleitzahl', width:150, editable:false, searchable:false, sorttype:'int'}, 
       {name:'Ort', index:'Ort', width:150, editable:false, searchable:false}, 
       {name:'Telefonnummer', index:'Telefonnummer', width:150, editable:false, searchable:false} 
       ], 
       datatype: 'clientSide', 
       //editurl:'Edit.php', 
       height: 240, 
       multiselect: true, 
       pager:'#ResultPager' 
      }) 
      .navGrid('#ResultPager', {view:false, edit:false, add:false, del:false, search:false, refresh:false}) 
      .navButtonAdd('#ResultPager', {title:"Adresse in Addressbuch speichern", buttonicon:"ui-icon-disk", caption:"In Adressbuch speichern", onClickButton:function(){ 
       //This method should save the selected addresses to the database 
       }})     
     }); 
    </script> 
</head> 
<body onload="initialize()" onunload="GUnload()"> 
    <div class="main" align="center"> 
     <table id="MyGrid"></table> 
     <div id="pager"></div>  
     <div class="ui-dialog ui-widget ui-widget-content ui-corner-all ui-draggable ui-resizable" style="height: 150px" id="Dialog"></div> 
     <div id="map" style="width: 850px; height:450px; padding:10px; font-size: medium; color:#853805; background-color:#FFE8CF;"></div> 
     <br/> 

     <div id="ResultGrid"> 
      <div id="ResultPager"></div> 
     </div> 
    </div> 

如果搜索完成,onSearchCompleteCallback函数被调用我的萤火得到这个错误:

t.rows is undefined 
http://localhost/jQuery_Adressbuch/js/jquery.jqGrid.min.js 
Line 123 

我找不到任何解决方案这个问题。 有没有人知道更多关于这个错误或关于在JQGrid中使用本地数据数组?

P.S .:我解决了这个问题。在HTML部分,我为Grid创建了一个DIV标签,而不是一张表......我很蠢

回答

0

你的主要误差非常小,可以很简单的是解决:你应该HTML代码片段

<div id="ResultGrid"> 
    <div id="ResultPager"></div> 
</div> 

更改为以下

<table id="ResultGrid"></table> 
<div id="ResultPager"></div> 
0

你可以尝试包括非缩小版本的jqGrid JavaScript文件 - 这样你就可以查看(并张贴)产生此错误的jqGrid代码中的确切行。

此外,您正在使用什么版本的jqGrid?

对于它的价值,我用我的本地电网下面的选项,但我怀疑这会解决你的问题:

editurl: "clientArray", // Save to local memory (sync back up on save) 
rowNum: -1, 
loadonce: true, 
imgpath: "../css/redmond/images",