jQuery Grid Plugin - jqGrid - Topic: Integrate jqGrid with Autocomplete http://www.trirand.com/blog/?page_id=393/help/integrate-jqgrid-with-autocomplete Simple:Press Version 5.7.5.3 davidbemenderfer on Integrate jqGrid with Autocomplete http://www.trirand.com/blog/?page_id=393/help/integrate-jqgrid-with-autocomplete#p12198 Help http://www.trirand.com/blog/?page_id=393/help/integrate-jqgrid-with-autocomplete#p12198 Per Tony's advice, I'm trying to implement autocomplete into my project.  I'm using the jquery.ui.autocomplete.js file version 1.1 (the latest).  This version is supposed to be included in an upcoming version of the jQuery UI package 1.8.  I'm trying to implement using JSON but my php is not very good.  If my below code is close, maybe someone can tell me what I'm doing wrong.  If I'm off base, maybe someone can verify or provide a sample of the server side JSON results and a client side example.  When complete, I will post my working example.  The jqGrid documentation says this can be done but does not provide an example.

Thanks in advance,

-David

My colModel code

{name:'TimeCode_ID',   index:'TimeCode_ID',   width:100,  editable:true,  editoptions:{ dataInit : function (elem) {$(elem).autocomplete();}}},

My autocomplete function

function auto_complete(id){
     jQuery(”#”+id+”TimeCode_ID”,”#list”).autocomplete({
      //$(”#TimeCode_ID”).autocomplete({
      cache: {limit: 15},
      source: function(request, response) {
       $.ajax({
        dataType: “JSON”,
        data: {
         style: “full”,
         maxRows: 15,
         name_startsWith: request.term
        },
        success: function(data) {
         response($.map(data.geonames, function(item) {
          return {
           label: item.name + (item.adminName1 ? “, ” + item.adminName1 : “”) + “, ” + item.countryName,
           result: item.name
          }
         }))
        }
       })
      },
      minLength: 1,
      change: function(event, ui) {
       log(ui.item ? (”Selected: ” + ui.item.label) : “Nothing selected, input was ” + this.value);
      },
      open: function() {
       $(this).removeClass(”ui-corner-all”).addClass(”ui-corner-top”);
      },
      close: function() {
       $(this).removeClass(”ui-corner-top”).addClass(”ui-corner-all”);
      }
     });
    };

My JSON file results

[{labortype_id: "1",LaborType: "Paralegal Time"}, {labortype_id: "2",LaborType: "Mediator Setup Time"}, {labortype_id: "3",LaborType: "Reschedule(s)"}, {labortype_id: "4",LaborType: "Mediator Preparation Time"}, {labortype_id: "5",LaborType: "Mediate Case"}, {labortype_id: "6",LaborType: "Post Mediation Time"}, {labortype_id: "7",LaborType: "Cancellation"}];

Code that generates the JSON file

 dblCounter = 1
 response.write “["
 While Not (rs.EOF Or rs.BOF)
  if dblCounter > 1 then response.write ", "
  response.write "{"
  response.write "labortype_id: """ & trim(rs("labortype_id")) & ""","
  response.write "LaborType: """ & trim(rs("LaborType"))& """"
  response.write "}"
  dblCounter = dblCounter + 1
  response.flush
  rs.MoveNext
 Wend
 response.write "];”
]]> Thu, 19 Nov 2009 13:08:39 +0200