CODEWITHSUNDEEP
javascriptjqueryhtmlformsautocomplete
StayCool
StayCool

Reputation: 552

Jquery UI, autocomplete, trying to submit selected answer in form

When the user selects an autocomplete item from an input element, I can't seem to get the form to submit the selected value. Instead, it submits the partially typed text. I'm using the select: feature of autocomplete to no avail. #scustnm is my input element and #a_comp is the form surrounding it. Thanks!

    if(vsvcus != "")
    {
       $( "#scustnm" ).autocomplete(
        {
        source: "S205ai.pgm?task=autoacustfil&WCODE=" + vscmpy + "&vcustnm=" + vsvcus,
        minLength: 1,
        select: function() {$("#a_comp").submit();}
        });
    }

Upvotes: 0

Views: 141

Answers (2)

Reed McDonnell
Reed McDonnell

Reputation: 461

I would suggest using a $.post() request instead of a form submit. So instead of having: select: function(){$("a_comp").submit();} you would write something like: select: function() { $.post("urlToPostDataTo"), {dataID1: $("#dataID1"), dataID2: $("#dataID2")}, function(data, callback){ //do stuff with the output of the page}} I believe when you submit the form, the form most likely uses just the input text field instead of the autocomplete suggestion. By using a $.post() request you have total control of exactly what data is posted when the user clicks on the select option of autocomplete. Hope this helps.

Upvotes: 1

Mark
Mark

Reputation: 861

You would need to assign the value back to the input that has the autocomplete on it in order for the form to read it in.

Inside of your select function, you would need something like this:

$( "#scustnm" ).val( /*Return Value Here*/ );

The form doesn't know what you've selected, it's selecting the value from the input box which never gets updated by your AJAX call. Because it only knows what you've typed in the box, that is the value that gets submitted with the form.

Upvotes: 0

Related Questions