jquery help needed

Question

hi all, In my form, i have an autocomplete textbox field which sits in a div which is dynamically populated by ajax and the autocomplete functionality is working fine..after the user selecting the autocompleted value from the list in textbox, i need to do some operation on the same and get printed the resulted value on another textbox, how will i achieve this?

pls see code below

if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("waitimg").innerHTML="";
    document.getElementById("ajxform").innerHTML=xmlhttp.responseText;
    $(function(){ 
    $("#item_no").autocomplete("auto/finditem.cfm");

    })
       }

I have already created function to do this operation, so i need to call this function after the user selects the autocompleted value.

thanks in advance.

Answer 1

If you are using the jquery-ui autocomplete you do it like this...

$(function() {
    $("#item_no").autocomplete({
      source: "auto/finditem.cfm",
      select: function(even, ui) {
        $("#another_textbox").val(ui.item.value);
        alert( ui.item.value.substring(0, 10) );
      }
    });
});

The response that you get from the url defined in source can be in json format or have a format like this...

["ActionScript", "AppleScript", "Asp"] 

(more over here).

Try checking if the autocomplete is working as desired by using this test code....

$(function() {
        var availableTags = ["ActionScript", "AppleScript", "Asp"];
        $("#item_no").autocomplete({
          source: availableTags,
          select: function(even, ui) {
            $("#another_textbox").val(ui.item.value);
            alert( ui.item.value.substring(0, 10) );
          }
        });
    });