JSFiddle - React, Tailwind, and code Playground

by FERMIS

HTML

<form>
    <ul>
        <li>Username:
            <input name="username" type="text" />
        </li>
        <li>Password:
            <input name="password" type="password" />
        </li>
        <li>
            <button type="submit">Login</button>
        </li>
    </ul>
</form>

CSS

ul {
    list-style-type: none;
}

JavaScript

$(document).on('submit', function (e) {
    // get the name from the username input field
    var name = $("form").find("input[name=username]").val();

    // get the password from the password input field
    var pass = $("form").find("input[name=password]").val();

    if (name.length > 0 && pass.length > 0) {
        alert("You have entered in a username and a password.");
        // You will get an error on this site saying {"error": "Please use POST request"} but  
        // I promise this works.
        return true;
    } else {
        alert("Please enter both a username and a password.");
        return false;
    }
});