Question

I need a jquery autocomplete that only does one call to the server then stores locally and uses the returned array in subsequent calls in a jqgrid. it shoud also work outside the grid for othe autocmpletes;
i have a jquery function in my onload:

$('#text').myAutocomplete({url:'...'});

And another one in a jqgrid – the dataInit below is a callback that uses a textbox argument to be autocmpleted/modified in other ways
I am using a asp.net web service hence the msg.d in my ajax call

$('#table').jqGrid({
  ...,
  colModel:[...,
           name:'col1',...,dataInit:function(el){
                       $.myAutocomplete({url:'..',elem:el});
                       }
           ...],
  ...
});

then in my Autocomplete function:

(function($){
 var returnArray = [];
 $.fn.myAutocomplete = function(options){
   var element = options.elem || this;
   if(returnArray.length === 0){ //checking if the local array is populated or not
     $.ajax({ // all other ajax options for asp.net webservice to respond are also set here
     ...,
     url: options.url,
     success : function(msg){
                returnArray = msg.d;
               }
     });
    }
  return element.autocomplete({source:returnArray}); 
  }
})(jQuery);

problem is the autocomplete on the ‘text’ is not working – I will test the jqgrid autocompleter tommorrow at work

Answer 1

/*Decided to change the approach;
wrote the following code
calling my autocomplte for a textbox
*/

$('#textbox').txtAc({url:txtUrl});

//Calling the autocomplete from a call back in a jqgrid

dataInit:function(elem){
var gridArray;
var gridAc = $.getMyGridAc();
gridArray = gridAc.getStoredArray();
elem.autocomplete({source:gridArray});
};

//Among the plugins/ functions are:

(function($){
  $.myAc = function(options){
   var storedArray = [];

   $.fillStoredArray = function(){
     $.ajax({url:options.url,
             ...,
             success:function(msg){
                     storedArray = msg.d;
                     if(options.el){
                         options.el.autocomplete({source:storedArray}); //1st time called, call jquery ui autocomplete from the ajax call if the element was specified (textbox); grid cant specify element in advance
                        }
                     }
     });
   }
   return {
     getStoredArray :function(){
                       if (storedArray.length === 0){
                       $.fillStoredArray();
                     }
      return storedArray;
           }
  }
 }
})(jQuery);

/*Now I can start reusing my plugin – below for a jqgrid call back then for a regular text box
jqgrid auto complete:

for the jqgrid, 1st create and return a closure instance from $.myAc :

*/

(function($){
   $.prepareGridForAc = function(){
      var myGridAc = $.myAc({url:gridUrl});
      return function getMyGridAc (){
        return myGridAc;
      } 
   }
})(jQuery);

//when user loads grid for 1st time (or activates tab that grid is on)- call the prepareGridForAc

//
$.prepareGridforAc();
//

//textbox auto complete:

(function($){
  $.fn.txtAc = function(options){
    var myTxtAc ;
    var acArray;
    $.extend(options,el:this);
    myTxtAc = $.myAc(options);
    acArray = myTxtAc.getStoredArray();
    return this.autocomplete({source:acArray});
  }
})(jQuery);