dimanche 12 juin 2016

jQuery autocomplete highlighting until ", "


I'm using jQuery autocomplete widget for my forms, and have this code to highlight the entire matched term in the results of the autocomplete. However, I don't have it quite where I need it to be.

It currently highlights the entire word and breaks at the space; but my word results include commas, so it looks something like this:

New York, New York

but I want to get it to look something like this instead:

New York, New York (without the comma bolded).

Here is my current code for highlighting the matched text:

$.ui.autocomplete.prototype._renderItem = function( ul, item) {
  var term = this.term.split(' ').join('|');
  var re = new RegExp("^(" + term + "\S*)", "gi") ;
  var t = item.label.replace(re,"<span class='matched'>$&</span>");
  return $( "<li></li>" )
     .data( "item.autocomplete", item )
     .append( "<a><div class='autocomplete-icon'></div>" + t + "</a>" )
     .appendTo( ul );
};

I've tried to remove the comma highlighting by adjusting the var re line to this:

var re = new RegExp("^(" + term + "\S*?(?=,))", "gi");

and that slightly works but unmatching the comma, but when I type "New York," in the input box, it completely removes the styling from the autocomplete results, which isn't something I want to happen.

Any help would be much appreciated.


Aucun commentaire:

Enregistrer un commentaire