JSFiddle - React, Tailwind, and code Playground

by ramyaaviji

HTML

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script src="http://jamesallardice.github.io/Placeholders.js/assets/js/Placeholders.min.js"></script>
<header>
     <h1>NMV Lite</h1> 
</header>
<section id="message"></section>
<section id="form">
    <form>
        <input id="orig" name="orig" placeholder="Origin" itemscope itemprop="Origin" itemtype="http://schema.org/Airport" autofocus required/>
        <input id="dest" name="dest" placeholder="Destination" itemscope itemprop="Destination" itemtype="http://schema.org/Airport" required/>
        <p>Effective Date:
            <input type="text" id="datepicker" itemscope itemprop="effectiveDate" itemtype="http://schema.org/Date"  />
        </p>
        <input id="search" type="button" name="Search" value="Search" />
             <article id="response"></article>
    </form>
</section>

JavaScript

$(function () {
    var data = ["WAS", "LON", "NYC", "PAR", "IAD", "SFO", "LAX"];

    $("#orig").autocomplete({
        source: data
    });

    $("#dest").autocomplete({
        source: data
    });

    $("#datepicker").datepicker();
    
    $("#search").click(function () {
        $(this).css({
            'background-color': 'blue',
                'color': 'pink'
        });    
         $.ajax({
                url: '/echo/json/',
                dataType: 'json',
                type: 'POST',
                //data: '45'
                data: {
                    json: JSON.stringify({
                        o: $("#orig").val(),
                        d: $("#dest").val(),
                        e: $("#datepicker").val()
                    })
                }
            }).done(function (data) {
                console.log("clicked3");
                console.log(data.o);
                $("#response").text("You entered: " + data.o.toUpperCase() + " " + data.d.toUpperCase() + " " + data.e);
            });  

    });
});