JavaScript validation malfunctioning

Whenever I click on the submit button, nothing happens. An error is displayed as follows: Form.js:102 Uncaught TypeError: Cannot set property 'onsubmit' of null. I am having trouble understanding why this error occurs...

// JavaScript Document function validate() { var x = document.forms["myForm"]["ide"].value; var regex = /^[1-9]{1}[0-9]{9}$/; if (x == null || x == "") { alert("Enter Your ID Number"); return false; } else if (!regex.test(x)) { alert("ID Contain Numbers Only"); return false; } var x = document.forms["myForm"]["EName"].value; var regex = /^[A-Za-z]+$/; if (x == null || x == "") { alert("Enter Your Employee Name"); return false; } else if (!regex.test(x)) { alert("Employee Name Contain Alphabets Only"); return false; } ...

Click here to view Form.html.

Answer №1

Running your script before the page fully loads can result in

document.getElementById("myForm")
returning undefined

A simple solution is to reposition your

<script type="text/javascript" src="PHP_Form.js"></script>

right before </body>

For a more robust approach, consider using the DOMContentLoaded event instead

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Conceal a section if the array is not defined

Hey there, I've got this piece of code for checking the status of a Twitch streamer. $(document).ready(function () { // some initializations here var login = ''; var twitchStatusLinks = $('.twitch-status'); var twitchStatus ...

What are the best methods for preventing scss styles from leaking between pages?

I'm currently working on a project that includes the following files: /* styles/1.scss */ body { /* Some other styles not related to background-color */ } /* styles/2.scss */ body { background-color: blue; } // pages/one.js import "../styles/ ...

What is the best way to present the new segment?

Having trouble with creating new sections or content after the homepage? The issue is that the new content doesn't appear on a new page but rather on the homepage itself. An example of this problem can be seen on this CodePen project, where an h1 sect ...

Sending all form input data to Ajax for GET request

Today, my goal is to iterate through each textbox with an ID of setting_value, set its name and value to a key-value array, and then send that data in an Ajax request. The problem I'm facing is that it only seems to be inspecting the first instance o ...

Shapes in Three.js with multiple colors

As a newcomer to Three.js and webGL programming, I have successfully created a cone and a cylinder in my scene using the script provided below: var scene; var camera; var renderer; var createACone = function() { // Cone creation code here } var creat ...

Javascript function for downloading files compatible with multiple browsers

When working with a json response on the client side to build content for an html table, I encountered an issue with saving the file to the local disk upon clicking a download button. The csvContent is generated dynamically from the json response. Here&ap ...

What is the method for obtaining the total number of steps taken in a day (pedometer) exclusively for the current day on the

Is there a way to retrieve the total steps count for the current day only? The tizen.humanactivitymonitor.setAccumulativePedometerListener function allows me to access the accumulativeTotalStepCount, which represents the cumulative walking and running ste ...

Retrieve the Nodejs callback outcomes

I am facing an issue with my code involving express and sql queries. The problem lies in obtaining the value of results from the sql query mentioned below, even though it works when logging the results. I have already attempted to return the results here. ...

Is there a problem with undefined values for dynamic inputs?

When I execute console.log($('#mat_code_' + counter - 1).val());, I receive an undefined value even though the inputs are empty. This is the code snippet : $('#m_table').on('click', '.check', function() { ...

I'm using Bootstrap (version 5.3) and when I tried to replicate the features from the examples, I noticed that the background isn't being copied over

I encountered an issue today while working on a website using bootstrap. I was copying features from examples in the bootstrap section, but when I pasted the code into my coding platform, the background appeared transparent and did not display as expected. ...

AngularJS Unleashed: The Art of Displaying Dynamic AJAX

Hey there, I have a concern about the best practice to show or hide an ajax loading animation while input/output operations are being performed. At present, I am managing the animation using this code: Javascript app.controller('MyController', ...

Modifying data-iconpos Dynamically with jQuery Mobile

Currently, I am developing a jQuery Mobile app and I am facing an issue. I want to have the ability to change the attributes of navbars across multiple HTML files using a single function in a separate .js file. I attempted to modify the class during page c ...

A guide on dynamically filling a dropdown menu based on the selection made in another dropdown using PHP and JSON data

Looking to create a dynamic select box based on another select box <select> <option value="x">x</option> <option value="y">y</option> </select> <select> <option value="1">1</option> ...

Leveraging .tsx components within nested .tsx components in React Native

Currently, I am delving into the world of building apps using TypeScript in React Native. Coming from a background as a Swift developer, adjusting to JavaScript and TypeScript has been an interesting journey. An observation that stood out to me is the cha ...

What is the best way to navigate to a specific ID on the homepage using a navigation button on another page?

When a navigation button is clicked on any page other than the home page, I want the home page to load first and then scroll to the corresponding id mentioned in the navlink. Below is the code snippet: <Col sm={5}> <Nav className=& ...

Problems arising from the usage of setInterval within the useEffect hook

I have encountered an issue while trying to use setInterval within useEffect. To ensure functionality, I moved the logic to a separate function and it works perfectly; alternating between two images every 3 seconds as intended. const rotateImages = (img) ...

Displaying JSON as a table using React JS

I can't seem to display JSON data in a table using the useState hook in React, and I'm not sure why. Here's a snippet from my React file: {` import React, { useState } from 'react' import "../styling/Classes.css"; import data ...

Tag - A guide on setting the required attribute for a tag

Currently, I am utilizing Jquery Tag it in order to manage tags and save the values in a database. My challenge lies in using jQuery to make the myTags field required, ensuring that at least one tag is added before proceeding with the save operation. This ...

Incorrect scope value detected in Angular controller

I recently started learning Angular 1, and I've encountered an issue with my code: var app = angular.module("Football", []); app.factory("competitions", ['$http', function($http) { return $http.get("json/competitions.json") .success(fu ...

The v-model for a particular field is not reflecting real-time updates like the other fields with the same datatype. I'm trying to figure out what could be causing this issue

In my specific model, there are various values that can be updated through a form on the webpage. These values include "Quantity", "Rate", "Amount", "Net rate", and more. The problem I am facing is with binding these values with my inputs using v-model. E ...