jQuery为什么不将我的选择设置为所选值

Question

I have standard select which is turned into a combobox using jQuery.

<select name="Searchby" id="Searchby">
    <option value="all" >All Departments</option>
    <option value="music" >Music</option>
    <option value="dvd" >DVD</option>
    <option value="bluray" >Bluray</option>
    <option value="Artist" >Artist</option>
</select>

Then I have an input which has jQuery's autocomplete on it with categories. When a person types into the input, it returns options to choose from in different categories. If they click on a option I want it to change what is selected in the select above. Here is my code that I tried.

$("#Search").catcomplete({
    delay: 1000,
    source: "Drop_Down_Search.php",
    select: function(event, ui) {
        if (ui.item.category = 'Artist') {
            $('#Searchby').val('Artist');
            console.log(ui.item.category);
        }
    }
});

The console is logging that it is working and it posts correctly to the search results page but doesn't change before you move off the page. It just stays as 'all departments'. I need it to change so a person who is searching can see they will only search for 'Artist' or 'Blu-Rays' before they move to the search results page.

EDIT:

Ok so as it turns out without the jquery combobox set on the select it does change the value, but when you use jquery's combobox it doesn't change.

What should I be using to change the value once a select has been changed into a combobox?

Here is the combobox code:

(function( $ ) {
    $.widget( "ui.combobox", {
        _create: function() {
            var input,
                that = this,
                wasOpen = false,
                select = this.element.hide(),
                selected = select.children( ":selected" ),
                value = selected.val() ? selected.text() : "",
                wrapper = this.wrapper = $( "<span>" )
                    .addClass( "ui-combobox" )
                    .insertAfter( select );

            function removeIfInvalid( element ) {
                var value = $( element ).val(),
                    matcher = new RegExp( "^" + $.ui.autocomplete.escapeRegex( value ) + "$", "i" ),
                    valid = false;
                select.children( "option" ).each(function() {
                    if ( $( this ).text().match( matcher ) ) {
                        this.selected = valid = true;
                        return false;
                    }
                });

                if ( !valid ) {
                    // remove invalid value, as it didn't match anything
                    $( element )
                        .val( "" )
                        .attr( "title", value + " didn't match any item" )
                        .tooltip( "open" );
                    select.val( "" );
                    setTimeout(function() {
                        input.tooltip( "close" ).attr( "title", "" );
                    }, 2500 );
                    input.data( "ui-autocomplete" ).term = "";
                }
            }

            input = $( "<input>" )
                .appendTo( wrapper )
                .val( value )
                .attr( "title", "" )
                .addClass( "ui-state-default ui-combobox-input" )
                .autocomplete({
                    delay: 0,
                    minLength: 0,
                    source: function( request, response ) {
                        var matcher = new RegExp( $.ui.autocomplete.escapeRegex(request.term), "i" );
                        response( select.children( "option" ).map(function() {
                            var text = $( this ).text();
                            if ( this.value && ( !request.term || matcher.test(text) ) )
                                return {
                                    label: text.replace(
                                        new RegExp(
                                            "(?![^&;]+;)(?!<[^<>]*)(" +
                                            $.ui.autocomplete.escapeRegex(request.term) +
                                            ")(?![^<>]*>)(?![^&;]+;)", "gi"
                                        ), "<strong>$1</strong>" ),
                                    value: text,
                                    option: this
                                };
                        }) );
                    },
                    select: function( event, ui ) {
                        ui.item.option.selected = true;
                        that._trigger( "selected", event, {
                            item: ui.item.option
                        });
                    },
                    change: function( event, ui ) {
                        if ( !ui.item ) {
                            removeIfInvalid( this );
                        }
                    }
                })
                .addClass( "ui-widget ui-widget-content ui-corner-left" );

            input.data( "ui-autocomplete" )._renderItem = function( ul, item ) {
                return $( "<li>" )
                    .append( "<a>" + item.label + "</a>" )
                    .appendTo( ul );
            };

            $( "<a>" )
                .attr( "tabIndex", -1 )
                .attr( "title", "Select A Critera to Search In " )
                .appendTo( wrapper )
                .button({
                    icons: {
                        primary: "ui-icon-triangle-1-s"
                    },
                    text: false
                })
                .removeClass( "ui-corner-all" )
                .addClass( "ui-corner-right ui-combobox-toggle" )
                .mousedown(function() {
                    wasOpen = input.autocomplete( "widget" ).is( ":visible" );
                })
                .click(function() {
                    input.focus();

                    // close if already visible
                    if ( wasOpen ) {
                        return;
                    }

                    // pass empty string as value to search for, displaying all results
                    input.autocomplete( "search", "" );
                });

        },

        _destroy: function() {
            this.wrapper.remove();
            this.element.show();
        }
    });

    })( jQuery );
                $(function() {
        $( "#Searchby" ).combobox();
        $( "#toggle" ).click(function() {
            $( "#Searchby" ).toggle();
        }); });

Answer 1

mistake i found..

$( "#Search" ).catcomplete({
    delay: 1000,
    source: "Drop_Down_Search.php",
    select: function( event, ui ) {
        if (ui.item.category == 'Artist') {
                        -----^^-- missing `=` in if since your are comparing this
            $('#Searchby').val('Artist');
            console.log(ui.item.category);
        }
    }
});

//}); extra brakets.. 

Answer 2

I found what I was looking for in this answer

How to define selected value for jQuery UI combobox?

After some editing I came to this which worked.

$('.ui-autocomplete-input').val($("#Searchby").val("Artist").val());

The value you select is 'Artist' and Searchby is the select id