Autocomplete

selection of autocomplete value, and on text change event

by Pankaj Sapkal

HTML

<div class="ui-widget">
    <label for="tags">Tags:</label>
    <input id="tags" />
    <input id="tagsname">
</div>
</div>

JavaScript

$(function () {
    var availableTags = [
        "ActionScript",
        "AppleScript",
        "Asp",
        "BASIC",
        "C",
        "C++",
        "Clojure",
        "COBOL",
        "ColdFusion",
        "Erlang",
        "Fortran",
        "Groovy",
        "Haskell",
        "Java",
        "JavaScript",
        "Lisp",
        "Perl",
        "PHP",
        "Python",
        "Ruby",
        "Scala",
        "Scheme"];
    $("#tags").autocomplete({
        source: availableTags
    });
});
$('#tags').on('change', function () {
    $('#tagsname').val(this.value);
}).change();

$('#tags').on('autocompleteselect', function (e, ui) {
    $('#tagsname').val(ui.item.value);
});

var n = document.getElementById("tags");
n.addEventListener("input", function (e) {
    if ($('#tags').val() === null || $('#tags').val() === "") {
        alert("Inside");
    }
}, false);