JSFiddle - React, Tailwind, and code Playground

by vijayram_a

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://jamesallardice.github.io/Placeholders.js/assets/js/Placeholders.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<header>
     <h1>NMV Lite</h1> 
</header>
<section id="form">
    <form>
        <input id="orig" name="orig" placeholder="Origin" itemscope="" itemprop="Origin" itemtype="http://schema.org/Airport" />
        <br/>
        <input id="dest" name="dest" placeholder="Destination" itemscope itemprop="Destination" itemtype="http://schema.org/Airport" />
        <br/>
        <input type="text" id="datepicker" placeholder="Date" itemscope itemprop="effectiveDate" itemtype="http://schema.org/Date" />
        <br/>
        <input id="search" type="button" name="Search" value="Search" />
    </form>
    <article id="response"></article>
</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 () {

        console.log("clicked");
        $(this).css({
            'background-color': 'blue',
                'color': 'pink'
        });
        console.log("clicked2");
        $.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);
        });
    });
});