Question

146

Jquery UI autocomplete; minLength:0 issue

rated 0 times [ 151] [ 5] / answers: 1 / hits: 46127 / 14 Years ago, wed, january 5, 2011, 12:00:00

I am using a JQuery UI auto-complete. I am specifying the min length. If I specify minLength:2 I need to type 2 characters before the service fires. If I specify minLength:1 then I only need to type one character before the source service fires.

However, when I specify minLength:0 I still need to type one character. So whats the point of 0? how is it any different than 1? The expected, and desired, behavior would be for it to fire as soon as the input has focus...?

Ideas?

Update: For the most part karim's solution below works, however when clicking on the input the options come up and when one is clicked the source is resubmitted the empty string rather than the new option that was just selected, so the auto-complete options that come up after selecting an option are than same as if the box had been empty.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

tatumm

Add To Favorites

Follow

Total Points: 47

Total Questions: 92

Total Answers: 89

Location: Palau

Member since Tue, May 30, 2023

1 Year ago

answered 14 Years ago dominics · Accepted Answer

Check out the search method documentation:

Triggers a search event, which, when
data is available, then will display
the suggestions; can be used by a
selectbox-like button to open the
suggestions when clicked. If no value
argument is specified, the current
input's value is used. Can be called
with an empty string and minLength: 0
to display all items.

var source = ['One', 'Two', 'Three', 'Four'];



var firstVal = source[0];



$(input#autocomplete).autocomplete({

    minLength: 0,

    source: source,

}).focus(function() {

    $(this).autocomplete(search, $(this).val());

});

.ui-menu-item{

  background : rgb(215, 215, 215);;  

  border : 1px solid white;

  list-style-type: none;

  cursor : pointer;

}



.ui-menu-item:hover{

  background : rgb(200, 200, 200);

}





.ui-autocomplete{

   padding-left:0;

   margin-top  : 5px;

}

<script src=https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js></script>

<script src=http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.js></script>

<input id=autocomplete/>&nbsp;<input id=submit type=submit/>