JSFiddle - React, Tailwind, and code Playground

by Shaun Luttin

HTML

<label>Username:
    <input id="user" />
</label>
<button id="submit">Submit</button>
<button id="submit-fail">Submit Fail</button>
<div id="product">Information goes here</div>

JavaScript

$("#submit").click(function () {

    var uri = 'https://cors-webapi.azurewebsites.net/api/titleEstimate/GetTitleEstimate';

    var query = {
        "username": $("#user").val(),
        // other fields
    };

    $.getJSON(uri, query)
        .done(function (data) {
        $('#product').text(data);
    })
        .fail(function (jqXHR, textStatus, err) {
        $('#product').text('Error: ' + err);
    });
});

$("#submit-fail").click(function () {

    var uri = 'https://cors-webapi.azurewebsites.net/api/titleEstimate/TitleEstimate';

    var query = {
        "username": $("#user").val(),
        // other fields
    };

    $.getJSON(uri, query)
        .done(function (data) {
        $('#product').text(data);
    })
        .fail(function (jqXHR, textStatus, err) {
        $('#product').text('Error: ' + err);
    });
});