Mandatory autocomplete

by Irvin Dominin

HTML

<script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.14/jquery-ui.min.js"></script>
<link rel="stylesheet" href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.14/themes/black-tie/jquery-ui.css">
<input type="text" id="artist" />
<a href="#" id="changeArtist">Change me</a>

JavaScript

$(document).ready(function () {
    
    $("#artist").autocomplete({
        source: function (request, response) {
            $.ajax({
                url: "http://en.wikipedia.org/w/api.php",
                dataType: "jsonp",
                data: {
                    'action': "opensearch",
                        'format': "json",
                        'search': request.term
                },
                success: function (data) {
                    response(data[1]);
                }
            });
        },
        change: function (event, ui) {
            if (ui.item == null || ui.item == undefined) {
                $("#artist").val("");
                $("#artist").attr("disabled", false);
            } else {
                $("#artist").attr("disabled", true);
            }
        }
    });

    $('#changeArtist').click(function (e) {
        e.preventDefault();
        $("#artist").attr("disabled", false);
    });
});