Home onsubmit validate password not working
Reply: 1

onsubmit validate password not working

FllnAngl
1#
FllnAngl Published in 2018-02-08 10:59:43Z

Okay, so lets get it out of the way that I've already referenced several other questions to see if they could help me so please don't bother me with possible duplicates unless you're a 100% certain that the duplicate can help me, thank you.


I have a form which has 2 password input fields and a submit button (and much more). I am trying to fire a validate() function onsubmit but for some reason the script just will not work. am I missing or overlooking something?

The validate() function should simply check if both password fields are identical values, if so: submit form, if not: don't submit and alert("passwords do not match");

@using (Html.BeginForm()){   //begin formulier

@Html.AntiForgeryToken()

<div class="form-horizontal">
    <h2 style="margin:3% 0 0 0;">Nieuwe medewerker Registreren</h2>

    <div style="float:right; margin:-3% 0 0 0;">
        @Html.ActionLink("Back to List", "Index")
        <input type="submit" value="Create" class="btn btn-default createBtn" onsubmit="return validate();" />
    </div>
    <hr />

    @Html.ValidationSummary(true, "", new { @class = "text-danger" })
    <div class="col-md-6">
        <h4>Persoonlijke gegevens</h4><!--Begin Persoonlijke gegevens-->

        <div class="form-group">
            <p class="control-label col-md-5"><i class="fa fa-exclamation-triangle triangle" aria-hidden="true"></i> <b>wachtwoord</b></p>
            <div class="col-md-4">
                <input type="password" id="passphrase" class="form-control" required="required" />
            </div>
        </div>

        <div class="form-group">
            <p class="control-label col-md-5"><i class="fa fa-exclamation-triangle triangle" aria-hidden="true"></i> <b>wachtwoord</b></p>
            <div class="col-md-4">
                @Html.EditorFor(model => model.wachtwoord, new { htmlAttributes = new { id = "passphraseConf", @class = "form-control", required = "required", type = "password" } })
                @Html.ValidationMessageFor(model => model.wachtwoord, "", new { @class = "text-danger" })
            </div>
        </div>
   </div>
</div>
} <!--Einde formulier-->

I removed unnecessary inputs for the sake of keeping this short, if you would like to see the full page; click here. note: I am working in asp.net with a database so if you RUN the jsfiddle, the page will look weird.

I've tried several jquery scripts but these 2 made the most sense to me that they should work;

1:

function validate() {
        alert("validating");
        var password = $("#passphrase").val();
        var confirmPassword = $("#passphraseConf").val();
        return (password === confirmPassword) 
    }

2:

function validate() {
        alert("validating");
        var password = $("#passphrase").val();
        var confirmPassword = $("#passphraseConf").val();
        if (password === confirmPassword) {
            return (true);
            alert("passwords valid");
        } else {
            return (false);
            alert('De wachtwoord velden komen niet overeen.');
        }
    }

but when I press the submit button neither scripts work. the alerts won't even fire and I don't understand why.


additional information:

jQuery version: 3.3.1


Thanks in advance.

Sudhakar
2#
Sudhakar Reply to 2018-02-08 11:05:51Z

Instead of using onsubmit you can use onclick for button

function myFunction() {
    alert("The form was submitted");
}
<form action="/action_page.php">
  Enter name: <input type="text" name="fname">
  <input type="submit" onclick="myFunction()" value="Submit">
</form>

You need to login account before you can post.

About| Privacy statement| Terms of Service| Advertising| Contact us| Help| Sitemap|
Processed in 0.341536 second(s) , Gzip On .

© 2016 Powered by mzan.com design MATCHINFO