Even though the onSubmit attribute is set to false in the HTML form, it still submits

I've been struggling with a form that just won't stop submitting, no matter what I do. I have checked similar questions on SO, but none of the solutions seem to work for me. It's frustrating because it's such a simple task. The reason why I want it to stop submitting is so that I can add some validation if a field is left empty.

HTML

<form class="application-form" id="application-form" name="application-form" 
autocomplete="off" enctype="multipart/form-data" method="post" onsubmit="return validateForm()" action="AppProcessRequest.cshtml">
...
...
...
<!-- Verify/Submit --> 
<input type="submit" value="Submit" id="btnSubmit" name="submitButton"/>
</form>

JavaScript

function validateForm() {
    alert('False');
    return false;
};

My Ideal Pseudo-Script

function validateForm() {
    var emp1label = $('label[class=emp1label]')
    if(emp1label.length > 0){
        alert('Empty Field.');
        return false;
    }else{
        return true;
    }
};

Note: Even though the alert message pops up when clicking submit, the form still submits after closing the message.

Answer â„–1

To stop the default action, make sure to utilize preventDefault().

function validateForm(evt) {
    evt.preventDefault();
    alert('Incorrect');
    return false;
};

Answer â„–2

It's possible that the issue lies in the line break between return and validateForm():

function validateForm() {
    alert('False');
    return false;
};
<form class="application-form" id="application-form" name="application-form" 
autocomplete="off" enctype="multipart/form-data" method="post" onsubmit="return validateForm()" action="AppProcessRequest.cshtml">
  ...
  ...
  ...
  <!-- Verify/Submit --> 
  <input type="submit" value="Submit" id="btnSubmit" name="submitButton"/>
</form>

Answer â„–3

The form continued to submit due to the interference of jquery-validation's custom submission function, which was overriding my attempts to prevent it.

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

NgModel in Angular Datapicker does not successfully transmit value

My page features a form that functions as a filter search, with one of the fields being a date field. I have configured the Angular UI datepicker plugin (https://github.com/angular-ui/ui-date) and the calendar pops up when I focus on the date field. Howe ...

Exploring the process of transforming a dynamic PDF into a static PDF using PHP or NodeJS

Issue I am looking for a PHP/NodeJS API that can convert editable PDF files to non-editable PDFs online. Our client application requires the user to download PDF files that cannot be modified using software like Foxit Reader or Adobe. We are currently us ...

Mistake made by the author while using the Google Structured Data Test

While reviewing my website, I encountered an error message stating: "Missing required hCard "author"" http://www.google.com/webmasters/tools/richsnippets?q=http%3A%2F%2Fwww.gamempire.it%2Fcastlestorm-ps-vita%2Frecensione%2F131419 Why is this happening? I ...

Angular's minimum date validation is not accurate for dates prior to the year 1901

Any assistance or clarification on this matter would be greatly appreciated. It appears that there may be an issue with my implementation, as otherwise it seems like a significant bug within Angular. Setup Create a form with a minimum date of 0001-01-01 ...

Inserting lines into the text, creating a visually appealing layout

Can a notepad design be created using CSS only? Is it feasible to include lines between text lines without using underscores? I want it to look like this example but with minimal spacing between lines and no manual insertion of span tags since the text wi ...

Using Symfony2 to make an Ajax request in order to show a message based on a particular condition

As a novice in the realm of JavaScript and Ajax, I am struggling to find a way to display a message based on certain conditions. Let's consider a scenario where a user can adjust the quantity of a product they wish to purchase. While implementing thi ...

The concept of setting a value is not defined in JavaScript when compared to

Within my primary python script, the following code snippet is present. @app.route('/accounts/test/learn/medium') def medium(): word = random.choice(os.listdir("characters/")) return render_template('accounts/test/medium.html', word=w ...

How come my CheerpJ web page displays the loading screen but fails to function properly?

I have recently started using CheerpJ and went through the getting started tutorial. Despite following all the steps, I encountered an issue where my webpage only displayed the CheerpJ loading screen (the rotating circle) without running my app. Can anyo ...

Banner Placement

Is there a way to arrange 3 banners without using absolute positioning? I prefer to use relative positioning so that the footer doesn't overlap with the page. How can I achieve this layout? .bms { height: 810px; left: 0; position: absolute; ...

Challenge involving CSS and Javascript for solving puzzles

In my attempt to create a puzzle with 2 rows and 3 columns using CSS and JavaScript, I envision the pieces of the puzzle being black and cut into various shapes. The objective is for users to drag these pieces onto the board in order to complete it. I have ...

What is the best way to position the top line next to the border?

I've been attempting to create a falling line effect on the left side of the box's border, but I can't seem to figure out what's causing the issue. Below is the code snippet: @import url('https://fonts.googleapis.com/css ...

What makes AJAX take so much time to load?

Hey everyone, I’ve been working on compiling and sending some forms to a PHP file but I've been noticing that the process is quite slow. Even when I use var_dump in PHP to only display the POST values, it still takes a considerable amount of time co ...

When zooming out, Leaflet displays both tile layers

I'm currently working on integrating two tile layers along with a control for toggling between them. Below is the code snippet I am using: const layer1: L.TileLayer = L.tileLayer('http://{s}.tile.opencyclemap.org/cycle/{z}/{x}/{y}.png', { ...

Trouble with closing windows in the in-app browser on Android devices

Is there a method to successfully close the in-app browser? Despite window.close working on iOS devices, it is not effective on Android. I have experimented with alternatives like window.top.close and window.open("", "_self") window.close, but none have ...

How can I retrieve the height of a dynamically generated div in Angular and pass it to a sibling component?

My setup consists of a single parent component and 2 child components structured as follows: Parent-component.html <child-component-1 [id]="id"></child-component-1> <child-component-2></child-component-2> The child-compo ...

Tips for updating multiple fields in Prisma ORM

Is there a way to upsert multiple fields in Prisma ORM using just one query? I'm looking for a solution that allows me to upsert all fields at once, without having to do it individually. Is this possible? ...

Using jsPlumb to Access an Element After a "Mouseup" Event has Completed

$(document).on('mouseup', '.agent-wrapper', function(info){ console.log(info); // Everything is working fine console.log(this); }); .agent-wrapper represents an element-wrapper for all jsPlumb objects. $(document).on(' ...

AngularJS and JQuery: smoothly navigate from current position to specified element

This particular directive I am currently implementing was discovered as the second solution to the inquiry found here - ScrollTo function in AngularJS: .directive('scrollToItem', function($timeout) { ...

Updating the node startup file with Visual Studio 2015 using NodeJS/Typescript

Encountering a persistent error: Error Code: TS5055 Cannot write file C:/project/dir/server.js' because it would overwrite the input file. Project: TypeScript/JavaScript Virtual Projects Even after renaming my entry filename to nodeserver.js, the ...

"Sending a POST request from the smartphone application client developed using the Meteor

I'm currently working on a simple mobile app with Meteor that aims to send user location data to a geospatial database or server. However, I'm facing some challenges and uncertainties about the feasibility of this task using Meteor. The issue ari ...