JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<div class="navbar navbar-default navbar-static-top">
    <div class="container">
        <div class="navbar-header"> <a class="navbar-brand" href="#">Title</a>

        </div>
        <div class="navbar-collapse collapse">
            <div class="navbar-form navbar-right">
                <div class="form-group">
                    <input type="text" placeholder="Search..." id="search" class="form-control" />
                </div> <a href="#" class="btn btn-success">Contact</a>

            </div>
        </div>
    </div>
</div>

JavaScript

$(function() {
    $("#search").focus();
    $(document).keypress(function(e){
        if (e.which == '13') e.preventDefault();
    });
    var csrf = $("input[name=csrfmiddlewaretoken]").val();
    $("#search").keyup(function(e) {
        var search_text = $("#search").val();
        if (e.which!='13' && search_text.length>=3) {
            $.ajax({
                type: "POST",
                url: "/search/",
                data: {
                    'csrfmiddlewaretoken': csrf,
                    'search_text': $("#search").val()
                },
                success: searchSuccess,
                dataType: 'html'
            });
        }
    });
});

function searchSuccess(data, textStatus, jqXHR) {
    $('#search-results').html(data);
}