Jquery Ui Autocomplete - How to remove the html from the selected value

Question

I am using the jquery ui autocomplete plugin in my page.

$( "#birds" ).autocomplete({
            //source: sampleData(),
              source: function(request, response) {
              response(data(request.term));

        },


    enter code here
            minLength: 3,
            select: function( event, ui ) {
                //alert(ui.item.label);

                log( ui.item ?
                    "Selected: " + ui.item + " aka " + ui.item.id :
                    "Nothing selected, input was " + this.value );
            }
        });

The response call back gets a string array as its return value. the string is of this sample format ..Akola,India-Akola(AKD) The suggestion list comes up fine with the actual rendered from the string. But when I select the value the value gets defaulted to the actual html string. How do I make the selected value to have only the string and not the html ?

Item.label and Item.value remain the same..label shows up fine in suggestion.. but I need to make the item.value contain only the string.

Thanks Yogesh

Answer 1

try using this.value.text() or else refer to this question. you may have to play around a little to parse the HTML but these options should work

Answer 2

In order to make this work you should also pass item.value

On select it looks for item.value first and then for item.label

That way you can leave your select: like that

select: function( event, ui ) {

    }