JSFiddle - React, Tailwind, and code Playground

by alfabravoteam

HTML

<script src="http://code.jquery.com/ui/1.9.0/jquery-ui.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.0/themes/base/jquery-ui.css">
<input />
<p id="empty-message"></p>

CSS

#empty-message { float: left; }
input { float: left }

JavaScript

$(function() {
    $("input").autocomplete({
        source: [
          {label: "ActionScript_z", value: "ActionScript"},
          {label: "JavaScript_x", value: "JavaScript"},
          {label: "Scheme_y", value: "Scheme"}
            ],
        response: function(event, ui) {
          
          if (ui.content.length === 0) {
                $("#empty-message").text("No results found");
            } else {
                $("#empty-message").empty();
            }
          console.log("long: " + ui.content.length);
          
          ui.content.splice(0, ui.content.length, { 'label': 'test3', 'value': 'test3' });
        }
    });
});