jQuery UI Autocomplete get input element on source function

Question

Is there any way to get input element on Autocomplete source function? $(this) not referring to input of autocomplete instance.

jsFiddle sample here.

<input type="text" data-code="foo" placeholder="type something ..." class="suggest" />
<input type="text" data-code="foo2" placeholder="type something ..." class="suggest" />

JavaScript

$(".suggest").autocomplete({
            delay: 100,
            source: function (request, response) {

                // get foo here,: $(this).data("code"); not working

                // Suggest URL
                var suggestURL = "http://suggestqueries.google.com/complete/search?client=chrome&q=%QUERY";
                suggestURL = suggestURL.replace('%QUERY', request.term);

                // JSONP Request
                $.ajax({
                    method: 'GET',
                    dataType: 'jsonp',
                    jsonpCallback: 'jsonCallback',
                    url: suggestURL
                })
                .success(function(data){
                    response(data[1]);
                });
            }
        });

You mean you wanna access the $("#suggest") within the Autocomplete source function? — Michelle Tan
– Michelle Tan, Commented Jan 5, 2017 at 16:17
Yes, but not with $("#suggest") selector. I need relative one — hkutluay
– hkutluay, Commented Jan 5, 2017 at 16:18
relative one? Sorry I don't quite get it. Can you elaborate a bit? if you need this itself to do something, you can save it tho. — Michelle Tan
– Michelle Tan, Commented Jan 5, 2017 at 16:28
@MichelleTan, I have just edit question. think that i have 2 input, and init autocomplete with class selector. i need input of autocomplete in source function. — hkutluay
– hkutluay, Commented Jan 6, 2017 at 5:41

hkutluay · Accepted Answer · 2017-04-25 05:22:30Z

2

this.element gets the current element on source function.

$(".suggest").autocomplete({
            delay: 100,
            source: function (request, response) {

                this.element.data("code"); 

                // Suggest URL
                var suggestURL = "http://suggestqueries.google.com/complete/search?client=chrome&q=%QUERY";
                suggestURL = suggestURL.replace('%QUERY', request.term);

                // JSONP Request
                $.ajax({
                    method: 'GET',
                    dataType: 'jsonp',
                    jsonpCallback: 'jsonCallback',
                    url: suggestURL
                })
                .success(function(data){
                    response(data[1]);
                });
            }
        });

Working sample here

edited Apr 25, 2017 at 5:22

answered Jan 6, 2017 at 6:35

hkutluay

6,9742 gold badges37 silver badges57 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

jQuery UI Autocomplete get input element on source function

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related