jquery-ui, autocomplite



  • How to be implemented autocomplite Is that something? We need to make a landing menu where there's a set of towns, if the user has an incorrect name for the city, the "My town is not on the list." As he enters data, this element needs to be shown, too.

    Example: In html, there is input to the editing of input-a, it is filled with clues for entry from jquery through autocomplete.

    html code

    <input type="text" class="city" id="city" list="city-arr" placeholder="Город проживания">
    

    jquery code

    $(function(){
        cityArr = [
            "Киев",
            "Харьков",
            "Моего города нету в списке"
        ];
        $("#city").autocomplete({
            source:cityArr
        });
    });
    


  • In this case, the function should be transferred to the field source

    The function takes two parameters:

    1. Area with field of terms - where the value is stored
    2. a function that needs to be caused and given to it by filtered values. So the main difference from what's right now is to filter manually. But that would add the necessary elements.

    Like this:

    $(function(){
        cityArr = [
            "Киев",
            "Харьков"
        ];
        $("#city").autocomplete({
            source:function(request, response){
    
          response(cityArr.filter(function(el){return el.toLowerCase().indexOf(request.term.toLowerCase()) &gt; -1; }).concat("Моего города нету в списке"));
          }
    });
    

    });

    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
    <input type="text" class="city" id="city" list="city-arr" placeholder="Город проживания">




Suggested Topics

  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2