Form handling is a fundamental aspect of web development. A Submit button sends the form data for processing, while a Clear button allows users to reset or empty the form inputs. This functionality enhances user experience and ensures proper data entry.In this tutorial, we'll learn how to create a form with a Submit button for handling submissions and a Clear button for resetting inputs using JavaScript. We'll also handle the actions triggered by these buttons effectively. Creating a submit button for form submission Below is an example of creating a submit button for form submission and another button to ... Read More

Let’s say the following is our button −Sum We are calling the function addTheValue(10) with parameter 10 on button click. On clicking the button, we are adding the value 10 as in the below code −Example Live Demo Document Adding 10 each time whenever you click the Sum Button...... 10 Sum    function addTheValue(secondValue) {       var fValue = document.getElementById("firstValue");       firstValue.innerHTML = parseInt(fValue.innerHTML) +       parseInt(secondValue);    } To run the above program, save the file ... Read More

Let’s say the following is our dropdown (select) −    John    Mike    Sam    David    Carol Following is the code to get the length of list options in JavaScript −Example Live Demo Document John Mike Sam David Carol    var lengthOfListOptions = $("#lengthListOfOptionDemo option").length;    console.log("The length is=" + lengthOfListOptions); To run the above program, save the file name “anyName.html(index.html)” and right click on the file. Select the option “Open with Live Server” in VS Code editor.OutputThis will produce the following output −

Let’s say the following is our array −var details = [    {subjectId:110, subjectName: 'Java' },    {subjectId:111, subjectName: 'Javascript' },    {subjectId:112, subjectName: 'MySQL' },    {subjectId:113, subjectName: 'MongoDB' } ];Now, use the concept of map(). The code is as follows −Examplevar details = [    {subjectId:110, subjectName: 'Java' },    {subjectId:111, subjectName: 'JavaScript' },    {subjectId:112, subjectName: 'MySQL' },    {subjectId:113, subjectName: 'MongoDB' } ]; var output = details.map((detailsObject, index) => {    var tempObject = {};    tempObject.subjectId= detailsObject.subjectId;    tempObject.subjectName = detailsObject.subjectName;    const getThePreviousObject = index != 0 ? details[index-1] : null;    tempObject.previousSubjectName = ... Read More

The requirements here are simple, we are required to write a JavaScript function that takes in a number and returns the number of digits in it.For example −The number of digits in 4567 is 4 The number of digits in 423467 is 6 The number of digits in 457 is 3Let's write the code for this function −Exampleconst num = 2353454; const digits = (num, count = 0) => {    if(num){       return digits(Math.floor(num / 10), ++count);    };    return count; }; console.log(digits(num)); console.log(digits(123456)); console.log(digits(53453)); console.log(digits(5334534534));OutputThe output in the console will be −7 6 5 10

We are required to write a JavaScript function that takes in an array of Numbers and returns a new array with elements as the sum of two consecutive elements from the original array.For example, if the input array is −const arrayOne = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];Then the output should be −const newArrayOne = [1, 5, 9, 13, 17]Let's write the code for this function −Exampleconst arrayOne = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]; const doubleSum = arr => {    const res = [];    for(let i = 0; i < arr.length; i += 2){       res.push(arr[i] + (arr[i+1] || 0));    };    return res; }; console.log(doubleSum(arrayOne));OutputThe output in the console will be −[ 1, 5, 9, 13, 17 ]

We are required to write a JavaScript function that takes in two arrays of Numbers and checks whether all the elements of the first array exist in the second or not.Following are our arrays −const arr1 = [34, 78, 89]; const arr2 = [78, 67, 34, 99, 56, 89];Let's write the code and check for multiple values −Exampleconst arr1 = [34, 78, 89]; const arr2 = [78, 67, 34, 99, 56, 89]; const contains = (first, second) => {    const indexArray = first.map(el => {       return second.indexOf(el);    });    return indexArray.indexOf(-1) === -1; } console.log(contains(arr1, arr2));OutputThe output in the console will be −true

We have an array of objects like this −let data = [    {id:1, Name: "Abe", RowNumber: 1 },    {id:2, Name: "Bob", RowNumber: 2 },    {id:3, Name: "Clair", RowNumber: 3 },    {id:4, Name: "Don", RowNumber: 3.0 },    {id:5, Name: "Edna", RowNumber: 3.1 },    {id:6, Name: "Frank", RowNumber: 3.2 },    {id:7, Name: "Gabe", RowNumber: 4 },    {id:8, Name: "Helen", RowNumber: 5 },    {id:9, Name: "Isabelle", RowNumber: 6 },    {id:10, Name: "Jane", RowNumber: 7 },    {id:11, Name: "Ken", RowNumber: 8 }, ];We are required to write a JavaScript function that takes in ... Read More

We have two arrays like these −let arr1 = [{"LEVEL":4, "POSITION":"RGM"}, {"LEVEL":5, "POSITION":"GM"}, {"LEVEL":5, "POSITION":"GMH"}] let arr2 = [{"EMAIL":"test1@stc.com", "POSITION":"GM"}, {"EMAIL":"test2@stc.com", "POSITION":"GMH"}, {"EMAIL":"test3@stc.com", "POSITION":"RGM"}, {"EMAIL":"test3@CSR.COM.AU", "POSITION":"GM"} ]We are required to write a function that adds the property level to each object of arr2, picking it up from the object from arr1 that have the same value for property "POSITION"Let's write the code for this function −Examplelet arr1 = [{"LEVEL":4, "POSITION":"RGM"}, {"LEVEL":5, "POSITION":"GM"}, {"LEVEL":5, "POSI TION":"GMH"}]    let arr2 = [{"EMAIL":"test1@stc.com", "POSITION":"GM"},    {"EMAIL":"test2@stc.com", "POSITION":"GMH"},    {"EMAIL":"test3@stc.com", "POSITION":"RGM"},    {"EMAIL":"test3@CSR.COM.AU", "POSITION":"GM"} ] const formatArray = (first, second) => {    second.forEach((el, ... Read More

We have an array of literals like this −const arr = ["", 20191219, 20191220, 20191221, 20191222, 20191223, 20191224, 20191225];We are required to write a JavaScript function that takes in this array and a number n and if the corresponding element contains more than or equal to n characters, then the new element should contain only the last n characters otherwise the element should be left as it is.Let's write the code for this function −Exampleconst arr = ["", 20191219, 20191220, 20191221, 20191222, 20191223, 20191224, 20191225]; const splitElement = (arr, num) => {    return arr.map(el => {       if(String(el).length