Untitled

#--- this is the html

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="app.js"></script>
  <title>test</title></head>
<body><form id="ajax-contact" method="post" action="http://142.93.116.203:8000/jackknife">
    <div class="field">
        <label for="values">Values</label>
        <input type="values" id="values" name="values" required>
    </div>

    <div class="field">
        <label for="tails">Tails:</label>
        <input type="tails" id="tails" name="tails" required>
    </div>

    <div class="field">
        <button type="submit">Send</button>
    </div>
</form>
  <div id="form-messages"></div>

</body>
</html>


#---

#--- this is app.js

$(function() {
    // Get the form.
    var form = $('#ajax-contact');

    // Get the messages div.
    var formMessages = $('#form-messages');

    // TODO: The rest of the code will go here...
});

.done(function(response) {
    // Make sure that the formMessages div has the 'success' class.
    $(formMessages).removeClass('error');
    $(formMessages).addClass('success');

    // Set the message text.
    $(formMessages).text(response);

})
.fail(function(data) {
    // Make sure that the formMessages div has the 'error' class.
    $(formMessages).removeClass('success');
    $(formMessages).addClass('error');

    // Set the message text.
    if (data.responseText !== '') {
        $(formMessages).text(data.responseText);
    } else {
        $(formMessages).text('Oops! An error occured and your message could not be sent.');
    }
});