How can I pass a dynamic source into jQuery UI combobox?

Question

I am successfully using the jQuery autocomplete combobox example. However, in the example, the source of the drop-down is created using a hard-coded value.

Of course I would like to use multiple combo boxes in my application. Unfortunately I don't see a way to accomplish this.

The operative snippet of code in "combobox.js" is:

lastXhr = $.getJSON( "the_hardcoded_json_request_string", request, function( data, status, xhr ) {
...
}

I tried adding some lines above that that used "hasClass" to check for the existence of the class. Again unfortunately, I can't even tell what object is calling this code. It has an undefined id, and my calls to hasClass are false. What in the hell?

My calls to combobox in my main javascript code look like this:

$("#myselect").combobox();

I am certain that () is used to pass some parameters if I want, but the declaration in combobox.js looks like this:

var cache = {}, lastXhr;
$.widget( "ui.combobox", {
    _create: function() {
...

Huh? I'm clearly no Javascript whiz, but I have no earthly idea whatsoever about $.widget, or how a call to "combobox()" just magically knows to call code from combobox.js. Please help if you can!

Could you provide a link to combobox.js? Is it simply the JS that jQueryUI has provided for the combobox widget? — Andrew Whitaker
– Andrew Whitaker, Commented Nov 27, 2011 at 3:32

Benny Johansson · Accepted Answer · 2011-12-14 15:35:48Z

1

I would try something along the lines of the following.

(function( $ ) {
    $.widget( "ui.combobox", {
        _create: function(options) {

            // Some code

            var input = this.input = $( "<input>" )
            .insertAfter( select )
            .val( value )
            .autocomplete({
                delay: 0,
                minLength: 0,
                source: options.source,

                // More options...

            })

            // More code...

        });
    })( jQuery );

$("#myselect").combobox({source: 'http://yoursite.com/your/sourceurl'});

Observe the added options parameter in the _create function and the 'option.source' value for the source attribute of the wrapper autocomplete widget.

answered Dec 14, 2011 at 15:35

Benny Johansson

7716 silver badges18 bronze badges

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

Collectives™ on Stack Overflow

How can I pass a dynamic source into jQuery UI combobox?

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