2011-05-21 105 views
1

我刚开始玩jqgrid,遇到一个奇怪的问题?jqgrid自定义编辑功能undefined

香港专业教育学院从jqGrid的演示的站点复制自定义编辑例子,并增加了额外的按钮

我的代码:

gridComplete: function(){ 
      var ids = jQuery("#rowed2").jqGrid('getDataIDs'); 
      for(var i=0;i < ids.length;i++){ var cl = ids[i]; 
       be = "<input style='height:22px;width:20px;' type='button' value='E' onclick=\"jQuery('#rowed2').editRow('"+cl+"');\" />"; 
       se = "<input style='height:22px;width:20px;' type='button' value='S' onclick=\"jQuery('#rowed2').saveRow('"+cl+"');\" />"; 
       ce = "<input style='height:22px;width:20px;' type='button' value='C' onclick=\"jQuery('#rowed2').restoreRow('"+cl+"');\" />"; 
       gc = "<input style='height:22px;width:20px;' type='button' value='G' onclick=\"geocodeMe("+cl+");\" />"; 
       jQuery("#rowed2").jqGrid('setRowData',ids[i],{Actions:be+se+ce+gc}); 
      } 
     } 

当我点击标有G中的按钮,它应该我thoughr叫我的功能

但我得到一个js错误,geocodeMe是undefined 其在我的代码中,所以不知道为什么它不能找到它我猜它的范围问题,任何想法如何解决它?

的geocodeMe功能:

function geocodeMe(myID) { 
     // set default region 
     region = 'uk'; 
     // address not empty 
     removemarkers(); 
     $('#geo_detail').html('<label>Geocoding address...</label>'); 
     // lookup the address 
     var myData = $("#rowed2").getRowData(myID); 
     address = myData.geoaddr_mdt; 
     geocoder.geocode({'address':address,'region':region}, function(results, status) { 
      // if the address was found 
      if(status == google.maps.GeocoderStatus.OK) { 
       $str = '<label>Geocode Successful<br> Lattitude: '+results[0].geometry.location.lat()+' Longitude: '+results[0].geometry.location.lng()+'<br> The address is displayed below and will be stored in the database.<br> If the address is incorrect you may edit it before saving the location to the database.<br>If the marker is in the wrong location you may drag it to where you believe it should be.</label>'; 
       $('#geo_detail').html($str); 
       // insert lat/long into form 
       $('#lat').val(results[0].geometry.location.lat()); 
       $('#lng').val(results[0].geometry.location.lng()); 
       // create new lat/long object 
       latlng = new google.maps.LatLng(results[0].geometry.location.lat(),results[0].geometry.location.lng()); 
       $('#disp_addr').val(address); 
       $('#form_buttons').show(); 
       $('#detail_address').show(); 
       //reverselookup(results[0].geometry.location.lat(), results[0].geometry.location.lng()); 
       // set zoom option 
       map.setZoom(15); 
       // center the map on the new location 
       map.setCenter(results[0].geometry.location); 
       createMarker(map, latlng, true, false); 

       if(savetype ='update'){ 
        savedata('update'); 
       }; 
       if(savedata='save'){ 
        savedata('save'); 
       }; 
      } else { 
       // display error 
       $('#geo_detail').append('<label>Geocoder failed to retrieve address: '+status+'</label>'); 
       $('#disp_addr').val($('#geo_addr').val()); 
      }; 
     }); 
    }; 

回答

1

发现在这个线程Answer here

我craeted名为地理编码我的按钮一类的答案,

gridComplete: function(){ 
      var ids = jQuery("#rowed2").jqGrid('getDataIDs'); 
      for(var i=0;i < ids.length;i++){ var cl = ids[i]; 
       be = "<input style='height:22px;width:20px;' type='button' value='E' onclick=\"jQuery('#rowed2').editRow('"+cl+"');\" />"; 
       se = "<input style='height:22px;width:20px;' type='button' value='S' onclick=\"jQuery('#rowed2').saveRow('"+cl+"');\" />"; 
       ce = "<input style='height:22px;width:20px;' type='button' value='C' onclick=\"jQuery('#rowed2').restoreRow('"+cl+"');\" />"; 
       gc = "<input style='height:22px;width:20px;' type='button' value='G' class='geocodeMe' rel='"+cl+"' />"; 
       jQuery("#rowed2").jqGrid('setRowData',ids[i],{Actions:be+se+ce+gc}); 
      } 

然后创建一个点击功能该类读取持有正确的id的rel属性:

$('body').delegate('.geocodeMe', 'click', function() { 
     var myID = $(this).attr('rel'); 
     var myData = $("#rowed2").getRowData(myID); 
     rest of function code............. 

    }); 
+0

非常感谢你的回答,这真的很有帮助。 @Dizzy布莱恩高 – 2012-05-18 08:38:08

1

如果使用onclick=\"geocodeMe("+cl+"),功能geocodeMe必须被定义为全球,所以在顶层像jQuery

我建议你看看其他可能性来实现相同的行为:herehere

此外,您应该清楚,在for循环中枚举所有项目jqGrid('getDataIDs')可能会非常缓慢(如果网格中有大量项目(大约100个或更多))。更有效的方法是使用描述here的jQuery选择。更有效的方式是在任何rows元素内使用table元素和cells属性的rows阵列。请参阅here多一个答案,其中还包括相应的演示。