Type something to search...

JavaScript Forms

JavaScript Forms

Forms are used to collect user input. JavaScript can validate and process form data.

Accessing Form Elements

You can access form elements using their id or name:

let username = document.getElementById("username").value;

Validating Input

You can validate user input before submitting the form:

let form = document.getElementById("myForm");
form.addEventListener("submit", function(event) {
    let username = document.getElementById("username").value;
    if (username === "") {
        alert("Username is required!");
        event.preventDefault(); // Prevent form submission
    }
});

Example

<!DOCTYPE html>
<html>
<body>
    <form id="myForm">
        <label for="username">Username:</label>
        <input type="text" id="username" name="username">
        <button type="submit">Submit</button>
    </form>
    <script>
        document.getElementById("myForm").addEventListener("submit", function(event) {
            let username = document.getElementById("username").value;
            if (username === "") {
                alert("Username is required!");
                event.preventDefault();
            }
        });
    </script>
</body>
</html>

Next: Error Handling →