jquery autocomplete question

Question

I am trying to make this plug-in work for my scenario. my data is in the following format:

["50986.1 ST SAVINGS BANK", "70625.1-800 GOT JUNK COMMERCIAL SERVICES (USA) LLC", "42755.103RD ST SAND LLC"]

the first part is the id of the company and i need to save that value once the data is selected.

my code:

 <script type="text/javascript">
 $().ready(function() {
$("#suggest1").focus(function(){
          $("#suggest1").autocomplete(cities,
              {
    formatResult: function(data) {
  return data.split(".")[1];
       }
});
 });

});
</script>

<form autocomplete="off">
 <p>
  <label>Single City (local):</label>
  <input type="text" id="suggest1" />
        <input type="hidden" id="suggest1ID"/>
  <input type="button" value="Get Value" />
 </p>
</form>

Firebug is telling me that "data.split" is not a function. How do i format the result to: a) get the text for the #suggest1 b) get the id and save it in suggest1ID. like: $("#suggest1ID").val(data.split(".")[0]) ?

Oh, one more thing: On the second focus(), is there a way to clean up the first pick from the textbox?

thanks in advance.

Answer 1

Your data is already in an array, its not being fed from the server. So you don't have to do the split thing.

Answer 2

I'm not to familiar with the autocomplete but if you want an array you with just the display names you can use this. Hope it helps.

formatResult: function(data) {
    var i,
        l = data.length,
        displayNames;

    for (i = 0, i < l; (i += 1) {
        displayNames.push(data[i].split('.')[1]);
    };

    return displayNames;
}

If it doesn't work check that data is in fact and Array not an string.

..fredrik

Answer 3

Building on Fredrik's example, I think this will work for autocomplete

function t(data) {
    var i;
    var l = data.length;
    var displayNames=[];

    for (i = 0; i < l; i++) {
        displayNames.push(data[i].split('.')[1]);
    };

    return displayNames.join(" ");
}

You see, with your data.split(), you are trying to apply a "string" function on an "array", you have to find each element in the array and split them individually, and then join them back up and return them to the function

Hope that clears it up...

Answer 4

I ended up referring to this page: http://docs.jquery.com/Plugins/Autocomplete

Created a data variable in this format: [ {text:'1 ST SAVINGS BANK', id:'50986'}, {text:'1-800 GOT JUNK COMMERCIAL SERVICES (USA) LLC', id: '70625'} ];

and used:

  $("#sVendor").focus(function(){
 $("#sVendor").autocomplete(vendors, {formatItem: function(item) {
              return item.text; 
           }
        }).result(function(event,item) {
          //alert(item.id);
          $("#sVendorID").val(item.id);
       });
});

I had to track what vendor is being picked via vendorID. Thanks