2010-07-22 4 views
0

J'utilise la recherche locale de Google Maps pour trouver des entreprises dans le domaine d'une adresse spécifique. Les résultats seront interceptés et devraient être affichés dans une table JQGrid. Je voudrais utiliser "Array Data" de JQGrid pour insérer les résultats localement dans la grille. A cette époque, je le code suivant:Problème avec JQGrid Array Data - 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> 

Si une recherche est terminée et que la fonction est appelée onSearchCompleteCallback je reçois cette erreur dans Firebug:

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

Je ne peux trouver aucune solution pour ce problème. Est-ce que quelqu'un en sait plus sur cette erreur ou sur l'utilisation de tableaux de données locaux avec JQGrid?

P.S .: J'ai résolu le problème. Dans la section HTML, j'ai créé un tag DIV pour la grille au lieu d'une table ... assez stupide de moi

Répondre

0

Votre erreur principale est très faible et pourrait être très simple être résolu: vous devez modifier le fragment de code html

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

au

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

Vous pouvez essayer d'inclure la version non-minifiée du fichier JavaScript jqGrid - de cette façon vous pouvez voir (et publier) la ligne exacte dans le code jqGrid qui génère cette erreur.

En outre, quelle version de jqGrid utilisez-vous?

Pour ce que ça vaut, je l'ai utilisé les options suivantes avec mes réseaux locaux, même si je doute que cela va résoudre votre problème:

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