Menu icon Foundation
Turn off form validation

Hi,

I am using a html form without abide so validation should not be happening. I have a textfield setup with:

<input type="email" id="email" name="email" placeholder="Email"  />



         

When i try to submit the form if i have an invalid email address entered e.g. 'test', i get a tooltip popup over the email textfield saying "Please enter an email address".

I am doing my own validation with jQuery so dont want any validation coming from Foundation. Why is this happening if i am not using abide and is their any way of turning off this behaviour?

Thanks!

formvalidation

Hi,

I am using a html form without abide so validation should not be happening. I have a textfield setup with:

<input type="email" id="email" name="email" placeholder="Email"  />



         

When i try to submit the form if i have an invalid email address entered e.g. 'test', i get a tooltip popup over the email textfield saying "Please enter an email address".

I am doing my own validation with jQuery so dont want any validation coming from Foundation. Why is this happening if i am not using abide and is their any way of turning off this behaviour?

Thanks!

ayezee over 5 years ago

Can you submit your code? Are you using the label and input tags? Are those within columns?

Rafi Benkual over 5 years ago

You do not have to use abide validation, but can you provide more information about what you are using and how it is loaded in the document?

Ronan over 5 years ago

Here is a sample piece from my script:

<form accept-charset="UTF-8" id="registerForm" name="registerForm" action="<?php echo $this->_data['baseUrl']; ?>/auth/register-submit" method="post">
<fieldset>
<div class="row">
            <div class="small-12 columns">
              <input type="email" id="email" name="email" placeholder="Email"  />
              <small class="error emailError"></small>
            </div>

          </div>
</fieldset>
<div class="row">
      <div class="small-12 columns paddingAll10">
        <button class="greenButtonClass right" id="registerButton" type="submit">Register</button>
      </div>
    </div>
</form>

Ronan over 5 years ago

Found out what the issue was. Apparently a html5 document has some automatic form validation built in. On supporting browsers when you set the type of a textfield to type='email' it will do some email validation by default. To turn off this behaviour add novalidate="novalidate" to the form tag.

Rafi Benkual over 5 years ago

@Ronan, thanks for posting your solution!

You're right some browsers detect validation. This is helpful to know.