JQGrid数组数据的问题 - 客户端

时间:2010-07-22 11:21:19

标签: jquery jqgrid

我正在使用Google地图的本地搜索,以查找特定地址区域内的商家。 结果将被拦截,并应显示在JQGrid表中。 我想使用JQGrid的“数组数据”将结果本地插入到网格中。 这时我有以下代码:

        <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函数,我在firebug中收到此错误:

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

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

P.S。:我解决了这个问题。在HTML部分中,我为Grid而不是表创建了一个DIV标记...我非常愚蠢

2 个答案:

答案 0 :(得分:0)

您可以尝试包含jqGrid JavaScript文件的非缩小版本 - 这样您就可以看到(并发布)生成此错误的jqGrid代码中的确切行。

另外,你使用的是什么版本的jqGrid?

对于它的价值,我在本地网格中使用了以下选项,但我怀疑这会解决您的问题:

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

答案 1 :(得分:0)