MagicSuggest 2.0.5

by knokit

HTML

<link rel="stylesheet" href="http://nicolasbize.com/magicsuggest/lib/bootstrap/css/bootstrap.min.css">
<script src="http://nicolasbize.com/magicsuggest/lib/bootstrap/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="http://nicolasbize.com/magicsuggest/lib/magicsuggest/magicsuggest.css">
<script src="http://nicolasbize.com/magicsuggest/lib/magicsuggest/magicsuggest.js"></script>
<script src="https://code.jquery.com/ui/1.10.4/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css">
<form id="myform" name="myform" action="/echo/json/" method="post">
    <div class="form-group">
        <label>Select your items:</label>
        <div id="ctn">Yea, MagicSuggest!!!</div>
    </div>
</form>

CSS

body {
    padding: 20px;
}
.ms-res-ctn {
    width: 100%;
}

JavaScript

$(function () {
    var ms1 = $('#ctn').magicSuggest({
        maxSelection: 1,
        maxSelectionRenderer: function () {
            return '';
        }
    });

    document.forms.myform.onsubmit = function () {
        alert('ok.');
        return false;
    }

    $('#myform').dialog({
        'autoOpen': true,
        'title': 'Test ...'
    });
});