Home/ Questions/Q 8814985
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-14T04:15:49+00:00

I’ve been trying to get this to work for 2 days now without success,

  • 0

I’ve been trying to get this to work for 2 days now without success, tried all tutorials on it and going through pieces of codes that actually work, but without any avail.

Most likely it will be something rather easy to find, but my jquery knowledge is very limited.

The problem is that i can not get the validation to work properly, earlier on it worked only for one field (Email field) with using the “Class = required email” attribute. However also that one stopped working. 

  $(document).ready(function(){
$("#forumulier").validate({
    rules: {
            telephone: {
                required: true,
                digits: true,
                        },

            name: {
                required: true,
                    },

            surname: {
                required: true,
                    },

            email: {
                required: true,
                email: true,
                }
            },
    messages: {
            telephone: {
                digits: "* voer een geldig telefoon nummer in"
                },
            name: {
                required: "* dit veld is verplicht"
                },
            surname: {
                required: "* dit veld is verplicht"
                },
            email: { 
                required: "* voer een geldig email adres in"
                }
            }
        submitHandler: function(form){
            return false;
            }
});
})

——

<form id="formulier" method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>">
            <div class="group">
            <label for="name" class="label">Naam*:</label>
            <input type="text" name="name"/>
            </div>

            <div class="group">
            <label for="surname" class="label">Achternaam*:</label>
            <input type="text" name="surname"/>
            </div>

            <div class="group">
            <label for="email" class="label">Email*:</label>
            <input type="text" name="email" />
            </div>

            <div class="group">
            <label for="telephone" class="label">Telefoon*:</label>
            <input type="text" id="telephone" name="telephone" />
            </div>

            <label for="extra" class="label">Opmerkingen:</label>
            <textarea class="small-area"></textarea>


            <div class="clear"></div>

            <button type="submit" class="send">Verzenden</button>
        </form>

Thanks for any

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    When you are setting the messages for the validation you need to set a message for each validation you are using: required, date, email, etc.

    like this.

    messages: {
    telephone: {
        required: " your message here",
        digits: "* voer een geldig telefoon nummer in"

    },
    name: {
        required: "* dit veld is verplicht"
    },
    surname: {
        required: "* dit veld is verplicht"
    },
    email: { 
        required: "* voer een geldig email adres in",
        email: " your message here"
    }
},
submitHandler: function(form){
   form.submit();
}

    This should work for your example.

    Update..
    this is a full example.
    i’ve used your code + mine.

    <html>
<head>
    <title></title>
</head>
<body>
<form id="form" method="post" action="">
<div class="group">
<label for="name" class="label">Naam*:</label>
<input type="text" name="name"/>
</div>

<div class="group">
<label for="surname" class="label">Achternaam*:</label>
<input type="text" name="surname"/>
</div>

div class="group">
<label for="email" class="label">Email*:</label>
<input type="text" name="email" />
</div>

<div class="group">
<label for="telephone" class="label">Telefoon*:</label>
<input type="text" id="telephone" name="telephone" />
</div>

<label for="extra" class="label">Opmerkingen:</label>
<textarea class="small-area"></textarea>


<div class="clear"></div>

<input type="submit" class="send">
</form>​
<script type="text/javascript" src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js'></script>
    <script src='http://ajax.aspnetcdn.com/ajax/jquery.validate/1.10.0/jquery.validate.min.js'></script>
<script>
$(document).ready(function(){
$("#form").validate({
rules: {
telephone: {
required: true,
digits: true,
},
name: {
required: true,
},
surname: {
required: true,
},
email: {
required: true,
email: true,
}
},
messages: {
telephone: {
required: " your message here",
digits: "* voer een geldig telefoon nummer in"
},
name: {
required: "* dit veld is verplicht"
},
surname: {
required: "* dit veld is verplicht"
},
email: { 
required: "* voer een geldig email adres in",
email: " your message here"
}
},
submitHandler: function(form){
form.submit();
}
});
});          
</script>​​​​​​​​​​​​​​
</body>
</html>

    check out your submit button. you got button type=’submit’. when i use it, it didn’t work. change it to input type=’submit’

    • 0