JavaScript Events
JavaScript Events are actions or occurrences that happen in the
browser. They can be triggered by various user interactions or by the
browser itself.
Common events include mouse clicks, keyboard presses, page
loads, and form submissions. Event handlers are JavaScript functions that
respond to these events, allowing developers to create interactive web
applications.
When javascript code is included in HTML, js react over these
events and allow the execution. This process of reacting over the events is
called Event Handling. Thus, js handles the HTML events via Event
Handlers.
For example
When a user clicks over the browser, add js code, which will execute
the task to be performed on the event.
JavaScript Form Validation
It ensures data integrity by verifying user input before submission.
It validates fields like passwords, emails, and selections, providing alerts for
invalid data, and enhancing user experience and data accuracy.
Approach for Form Validation in JavaScript
In this approach, we are following these steps
Data Retrieval:
It retrieves the values of various form fields like name, email,
course selection, password, and address using document.forms.RegForm.
Data Validation:
Name Validation: Checks if the name field is empty or contains
any digits.
Address Validation: Ensures the address field is not empty.
Email Validation: Verifies if the email field is not empty and
contains the ‘@’ symbol.
Password Validation: Validates that the password field is not
empty and has a minimum length of 6 characters.
Course Selection Validation: Ensures that a course is selected
from the dropdown.
Error Handling:
If any of the validation criteria fail, it displays an alert message using
window.alert.
Sets focus back to the respective field that failed validation, ensuring
the user’s attention is drawn to the problematic field.
Submission Control:
Returns true if all validation checks pass, indicating that the form can
be submitted. Otherwise, it returns false, preventing form submission.
Focus Adjustment:
Sets focus to the first field that failed validation, ensuring the user’s
attention is drawn to the problematic field.
JavaScript Debugging
Sometimes a code may contain certain mistakes. Being a scripting
language, JavaScript didn't show any error message in a browser. But these
mistakes can affect the output.
The best practice to find out the error is to debug the code. The
code can be debugged easily by using web browsers like Google Chrome,
Mozilla Firebox.
Find out errors using built-in web browser debugger. To perform
debugging, we can use any of the following approaches,
1. Using console.log() method
2. Using debugger keyword
The console.log() method displays the result in the console of the
browser. If there is any mistake in the code, it generates the error message.
Using debugger keyword
In debugging, generally we set breakpoints to examine each line of
code step by step. There is no requirement to perform this task manually in
JavaScript.
JavaScript provides debugger keyword to set the breakpoint
through the code itself.
The debugger stops the execution of the program at the position
it is applied. Now, we can start the flow of execution manually. If an
exception occurs, the execution will stop again on that particular line.
