rall0r
(Rall0r)
May 10, 2011, 2:46pm
1
Hi,
I’m using jui.autocomplete widget. Is there a way to highlight the entered words at the suggestion-list?
For example the current jui.autocomplete input-value is "ber"
and the list of suggested words is like that:
ber n
ber lin
Leber da
Thank you
Put this on your document:
$.ui.autocomplete.prototype._renderItem = function (ul, item) {
item.label = item.label.replace(new RegExp("(?![^&;]+<img src='http://www.yiiframework.com/forum/public/style_emoticons/default/wink.gif' class='bbc_emoticon' alt=';)' />(?!<[^<>]*)(" + $.ui.autocomplete.escapeRegex(this.term) + ")(?![^<>]*>)(?![^&;]+<img src='http://www.yiiframework.com/forum/public/style_emoticons/default/wink.gif' class='bbc_emoticon' alt=';)' />", "gi"), "<strong>$1</strong>");
return $("<li></li>")
.data("item.autocomplete", item)
.append("<a>" + item.label + "</a>")
.appendTo(ul);
};
Register the above script with CClientScript and POS_LOAD. Should work.
Cheers
rall0r
(Rall0r)
May 10, 2011, 3:58pm
3
Hi!
Thank you!
I tried the following:
Yii::app()->clientScript->registerScript('highlightAC','$.ui.autocomplete.prototype._renderItem = function (ul, item) {
item.label = item.label.replace(new RegExp("(?![^&;]+<img src='http://www.yiiframework.com/forum/public/style_emoticons/default/wink.gif' class='bbc_emoticon' alt=';)' />(?!<[^<>]*)(" + $.ui.autocomplete.escapeRegex(this.term) + ")(?![^<>]*>)(?![^&;]+<img src='http://www.yiiframework.com/forum/public/style_emoticons/default/wink.gif' class='bbc_emoticon' alt=';)' />", "gi"), "<strong>$1</strong>");
return $("<li></li>")
.data("item.autocomplete", item)
.append("<a>" + item.label + "</a>")
.appendTo(ul);
};',POS_LOAD);
…but unfortunately nothing changes
Is it important if I register the script at the controller or view, before or after calling the widget?
//Edit: by the way: if I simple copy that JS code into an javascript file (witch is available all the time (registered in every action)), an error occurs: "$.ui is undefined". Is this normal behavior?
If I use register script: nothing happend: no error, no highlighting.
rall0r:
Hi!
Thank you!
I tried the following:
Yii::app()->clientScript->registerScript('highlightAC','$.ui.autocomplete.prototype._renderItem = function (ul, item) {
item.label = item.label.replace(new RegExp("(?![^&;]+<img src='http://www.yiiframework.com/forum/public/style_emoticons/default/wink.gif' class='bbc_emoticon' alt=';)' />(?!<[^<>]*)(" + $.ui.autocomplete.escapeRegex(this.term) + ")(?![^<>]*>)(?![^&;]+<img src='http://www.yiiframework.com/forum/public/style_emoticons/default/wink.gif' class='bbc_emoticon' alt=';)' />", "gi"), "<strong>$1</strong>");
return $("<li></li>")
.data("item.autocomplete", item)
.append("<a>" + item.label + "</a>")
.appendTo(ul);
};',POS_LOAD);
CClientScript::POS_LOAD
Edit:: In fact, use it on CClientScript::POS_END
Make sure you don’t have any errors. I recommend you to load your page with FIREBUG (on Firefox) or Chrome Developer Tools (on Chrome).
rall0r
(Rall0r)
May 11, 2011, 9:00am
5
Hi!
Oh.yeh… “CClientScript::POS_LOAD” Thank you! That’s it.
Thank you so much. I’m working since days on that highlighting of autocomplete suggestions. Tried selfmade callback functions as autocomplete-source and different other things.
But your solution is, what I was looking for.
Thank you.
rall0r
(Rall0r)
October 26, 2012, 8:53am
6
Hi,
…one more question.
What is with the highlight option:
http://www.yiiframework.com/doc/api/1.1/CAutoComplete#highlight-detail
Is this the "build-in" function fore the same issue?
Rall0r