ASP.Nev MVC 3 jQuery Autocomplete Textbox Value Always Blank

Question

I have a view with a button that opens a jquery dialog via partial view. Within the dialog I have a jquery autocomplete call that works fine for listing my values. The problem is that once a value is selected and I submit the form, there's no value in the form field.

<fieldset>
            @Html.LabelFor(m => m.Airline)
            @Html.TextBoxFor(m => m.Airline)
            @Html.ValidationMessageFor(m => m.Airline)
        </fieldset>

$(function () {

    $("#Airline").autocomplete({
        source: function (request, response) {
            $.ajax({
                url: '/app/FlightLeg/AirlineSearch', type: "GET", dataType: "json",
                data: { term: request.term },
                success: function (data) {
                    response($.map(data, function (item) {
                        return { label: item.Name + ' (' + item.Code + ')', value: item.Name, id: item.Id };
                    }))
                }
            })
        },
        minLength: 2,
        select: function (event, ui) {
            console.debug(ui.item.id); **//has the expected value**
            $("#Airline").val(ui.item.id)); /**/ never gets set**
        }

    });

Using firebug, I can see that no value is attributed to the textbox once a value is selected either. I've tried using the "select" option in the autocomplete call to set the value in textbox via .val(ui.item.id) but it will not set the value of the textbox. If i put an alert in the "select" option, it will show the value of ui.item.id.

Any idea why I can't set the textbox value from the value of my autocomplete?

Eran Betzalel · Accepted Answer · 2011-08-06 23:45:56Z

1

You should use .text() instead of .val().

val() changes the value attribute of an element, while text() changes its inner text. Textbox's text is represented by an inner text of the element thus only by using text() you can control its text.

answered Aug 6, 2011 at 23:45

Eran Betzalel

4,2033 gold badges40 silver badges69 bronze badges

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

1 Comment

Don Fitz Over a year ago

OMG. I can't believe I've been struggling so long for such a small problem that I should have found. Thanks a lot.

ShankarSangoli · Accepted Answer · 2011-08-06 23:50:40Z

1

There is an error on this line please correct and try it

//Extra bracket at the end
$("#Airline").val(ui.item.id)); /**/ never gets set**

//Corrected 
$("#Airline").val(ui.item.id); /**/ never gets set**

answered Aug 6, 2011 at 23:50

ShankarSangoli

69.9k13 gold badges96 silver badges124 bronze badges

1 Comment

Don Fitz Over a year ago

Yeah, I pasted it wrong. The syntax error was not in the actual code.

Collectives™ on Stack Overflow

ASP.Nev MVC 3 jQuery Autocomplete Textbox Value Always Blank

2 Answers 2

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related