Skip to main content

Bug Tracker

Side navigation

#4025 closed bug (invalid)

Opened January 29, 2009 01:48PM UTC

Closed October 13, 2009 12:37AM UTC

Last modified March 15, 2012 03:08PM UTC

[autocomplete] (v.1.0.2) populate() function loads raw data not parsed data

Reported by: johnsa Owned by:
Priority: major Milestone: 1.3.2
Component: unfiled Version: 1.3.1
Keywords: Cc:
Blocked by: Blocking:
Description

While implementing the autocomplete plugin v.1.0.2 (excellent work, btw) - we overrode the parse() function in the options to grab an arbitrary json object and load the data array. That worked very well.

However, we found that the populate() function is referencing back to the original raw data rather than the parsed data, which caused the plugin to fail, and struck us as a bug.

By changing this so that we reference only our parsed data, we were able to easily implement the plugin against our json feed. Below I list the very small change we made to jquery.autocomplete.js, our initialization code, and an example of data we were working against:

=

The changes we made were on lines 451 - 452 on jquery.autocomplete.js :

loop through the array and create a lookup structure

for ( var i = 0, ol = options.data.length; i < ol; i++ ) {

var rawValue = options.data[i];

became

loop through the array and create a lookup structure

for ( var i = 0, ol = data.length; i < ol; i++ ) {

var rawValue = data[i];

=

We instantiated the plugin with the following code:

var options = {

minChars: 0,

width: 310,

matchContains: false,

autoFill: false,

extraParams: {

format: 'json'

},

dataType: 'json',

// our parse function maps our json object to the expected data structure for use with autocomplete

parse: function(data) {

var parsed = [];

data = data.microformats.vcard;

for (var i = 0; i < data.length; i++) {

dataRow = {

fn: data[i].fn.value,

email: data[i].email[0].value,

uri: data[i].caladruri.value,

type: data[i].kind.value

};

parsed[i] = {

data: dataRow,

value: data[i].fn.value,

result: data[i].email[0].value

};

}

return parsed;

},

formatItem: function(item) {

return " \\"" + item.fn + "\\" [" + item.email + "]";

},

formatMatch: function(item) {

return " \\"" + item.fn + "\\" [" + item.email + "]";

},

formatResult: function(item) {

return item.email;

}

};

jQuery(document).ready(function($) {

$('#bwRaUri').autocomplete("url-to-carddav-server-went-here", options)

});

=

and the data returned looks something like this:

{

"microformats": {

"vcard": [

{

"version" : {"value" : "4.0"},

"rev" : {"value" : "20090128184009Z"},

"source" : [ {"value" : "\\/ucarddav\\/principals\\/users\\/user1.vcf"},

],

"uid" : {"value" : "\\/ucarddav\\/principals\\/users\\/user1.vcf"},

"kind" : {"value" : "individual"},

"fn" : {"value" : "User, User1"},

"email" : [ {"value" : "user1@mysite.edu"},

],

"caladruri" : {"value" : "mailto:user1@mysite.edu"},

},

{

"version" : {"value" : "4.0"},

"rev" : {"value" : "20090128185914Z"},

"source" : [ {"value" : "\\/ucarddav\\/principals\\/users\\/user2.vcf"},

],

"uid" : {"value" : "\\/ucarddav\\/principals\\/users\\/user2.vcf"},

"kind" : {"value" : "individual"},

"fn" : {"value" : "User, User2"},

"email" : [ {"value" : "user2@mysite.edu"},

],

"caladruri" : {"value" : "mailto:user2@mysite.edu"},

}

]

}

}

=

Two other quick notes:

We had to fall back on FormatItem() rather than FormatMatch() even though the latter was defined.

It would be great to parameterize the query (rather than just sending "q") as some won't have control over the parameter name.

Thanks for the excellent work!

Arlen

Attachments (0)
Change History (2)

Changed January 29, 2009 01:56PM UTC by johnsa comment:1

Ugh - what a formatting mess...hit publish before preview (argh). Sorry about that. Here's the code again:

The changes we made were on lines 451 - 452 on jquery.autocomplete.js :

  // loop through the array and create a lookup structure
  for ( var i = 0, ol = options.data.length; i < ol; i++ ) {
    var rawValue = options.data[i];

became

  // loop through the array and create a lookup structure
  for ( var i = 0, ol = data.length; i < ol; i++ ) {
    var rawValue = data[i];

We instantiated the plugin with the following code:

var options = {
  minChars: 0,
  width: 310,
  matchContains: false,
  autoFill: false,

  extraParams: {
    format: 'json'
  },

  dataType: 'json',

 // our parse function maps our json object to the expected data structure for use with autocomplete
  parse: function(data) {
    var parsed = [];
    data = data.microformats.vcard;
    for (var i = 0; i < data.length; i++) {
      dataRow = {
        fn: data[i].fn.value,
        email: data[i].email[0].value,
        uri: data[i].caladruri.value,
        type: data[i].kind.value
      };
      parsed[i] = {
        data: dataRow,
        value: data[i].fn.value,
        result: data[i].email[0].value
      };
    }
    return parsed;
  },
  formatItem: function(item) {
      return " \\"" + item.fn + "\\" [" + item.email + "]";
  },

  formatMatch: function(item) {
      return " \\"" + item.fn + "\\" [" + item.email + "]";
  },
  formatResult: function(item) {
    return item.email;
  }
};

jQuery(document).ready(function($) {
  $('#bwRaUri').autocomplete("url-to-carddav-server-went-here", options)
});

and the data returned looks something like this:

{
  "microformats": {
    "vcard": [
      {
      "version" : {"value" : "4.0"},
      
      "rev" : {"value" : "20090128184009Z"},
      
      "source" : [      {"value" : "\\/ucarddav\\/principals\\/users\\/user1.vcf"},
      ],
      "uid" : {"value" : "\\/ucarddav\\/principals\\/users\\/user1.vcf"},
      
      "kind" : {"value" : "individual"},
      
      "fn" : {"value" : "User, User1"},
      
      "email" : [      {"value" : "user1@mysite.edu"},
      ],
      "caladruri" : {"value" : "mailto:user1@mysite.edu"},
      
      },
      {
      "version" : {"value" : "4.0"},
      
      "rev" : {"value" : "20090128185914Z"},
      
      "source" : [      {"value" : "\\/ucarddav\\/principals\\/users\\/user2.vcf"},
      ],
      "uid" : {"value" : "\\/ucarddav\\/principals\\/users\\/user2.vcf"},
      
      "kind" : {"value" : "individual"},
      
      "fn" : {"value" : "User, User2"},
      
      "email" : [      {"value" : "user2@mysite.edu"},
      ],
      "caladruri" : {"value" : "mailto:user2@mysite.edu"},
      
      }
    ]
  }
}

Changed October 13, 2009 12:37AM UTC by dmethvin comment:2

resolution: → invalid
status: newclosed

This is not a jQuery core bug. Please use the jQuery forums or contact the author via the method they request. For jQuery UI plugins, please file a bug on http://dev.jqueryui.com .