开发者

JSON to array and search & replace inside the array

开发者 https://www.devze.com 2023-03-04 03:58 出处:网络
I have an small callback-function for an jQuery autocompleation input field. The function has 2 parameters: term=the string, typed into the input field and url=the url to the php script which generate

I have an small callback-function for an jQuery autocompleation input field. The function has 2 parameters: term=the string, typed into the input field and url=the url to the php script which generates suggestions.

The script looked like t开发者_StackOverflowhat:

function m(term,url) {
   var y = '';
   jQuery.get(url, { term:term }, function(data){ });
   return y;
}

Everything you type into the text-field is send to the php script, which returns a list of suggestions.

Inside the function(data){} block, two things should be happened:

  1. encode the JSON string into an Array (which is needed by the JQuery autocomplete as return value). I tried this: y=eval("(" + data + ")");. Is this right? The JSON string which is generates from the PHP side looks like that (example for term="nur")

    ["nuri al maliki","nursultan nasarbajew","n\u00fcrnberger prozess"] n\u00fcrnberger is the encoded version of "nürnberger"

  2. Highlight the term inside suggested word. Example: input value is "ris" so an suggestion example should be something like sun<b>ris</b>e.

Is there a way to use something like .replace for array?

The application run's under the Yii framework - so I would like to find an solution for that.


its been said that eval is evil you don't need to parse the sting into json just use json_encode

please also look at remote example

for formatting see this thread provided by @DarthJDG


You can define that the string you receive comes in JSON by:

jQuery.get(url, { term:term }, function(data){ }, "json");

Then in the callback function go through the received items and replace your found string with the wrapped version:

for (i=0, iLen=data.length; i<iLen; i++) {
    data[i] = data[i].replace(new RegExp(term), "<b>$1</b>");
}


I tried the link from DarthJDG and followed to this SO question: jQueryUI: how can I custom-format the Autocomplete plug-in results?

I think because of insufficient knowledge in Javascript/Jquery/... I was unable to apply that solution to my application. All the time I got the error "$.ui is undefined". The challenge (for me) was: where to place that code in combination with the Yii framework, which one I use.

So I got help from the Yii forum and I like to post the explicit solution here.

You simply have to register that following script. It's importent to register that at POS_LOAD:

Yii::app()->clientScript->registerScript('highlightAC','$.ui.autocomplete.prototype._renderItem = function (ul, item) {
            item.label = item.label.replace(new RegExp("(?![^&;]+;)(?!<[^<>]*)(" + $.ui.autocomplete.escapeRegex(this.term) + ")(?![^<>]*>)(?![^&;]+;)", "gi"), "<strong>$1</strong>");
            return $("<li></li>")
                    .data("item.autocomplete", item)
                    .append("<a>" + item.label + "</a>")
                    .appendTo(ul);
        };',CClientScript::POS_LOAD); 

That's it. (Thanks to Antonio from the Yii forum)

0

精彩评论

暂无评论...
验证码 换一张
取 消