CODEWITHSUNDEEP
javascriptjqueryjquery-uiautocomplete
Kavinda Rasanjana
Kavinda Rasanjana

Reputation: 143

Get Only Selected item without Submitting?

Im developing simple search for my site and i found this JQuery UI Autocomplete example online and now i need it to get only selected value when its selected but currently its submitting after item is selected how to modify that SELECT function to only select without submitting 

<script>
$(document).ready(function() {
    var myArr = [];

    $.ajax({
        type: "GET",
        url: "doctors.xml", // XML File location
        dataType: "xml",
        success: parseXml,
        complete: setupAC,
        failure: function(data) {
            alert("XML File could not be found");
            }
    });

    function parseXml(xml)
    {
        //find every query value
        $(xml).find("doctor").each(function()
        {
            myArr.push($(this).attr("label"));
        }); 
    }

    function setupAC() {
     var limit = 10;
        $("input#searchBox").autocomplete({
                source: myArr,
                minLength: 2,
                 select: function(event, ui) {
                    $("input#searchBox").val(ui.item.value);
                    $("#searchForm").submit();
                } 
        });
    }
});
</script>

Upvotes: 0

Views: 39

Answers (1)

Ramon Marques
Ramon Marques

Reputation: 3264

Replace this line

$("#searchForm").submit();

with

return false;

If you are selecting with enter key, then you may need to prevent the default event

$("input#searchBox").keydown(function(event){
    if(event.keyCode == 13) {
      if($("input#searchBox").val().length==0) {
          event.preventDefault();
          return false;
      }
    }
 });

Upvotes: 2

Related Questions