Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Contact form validation

Featured Replies

I suck at javascript so I would continue using the plugin that you started with. You can set up a rule for phone numbers

mobile: {
			required: true,
                               number: true,
                               maxlength: 11,
			minlength: 11
                               },

 

or if you want to use javascript - put all the functions in a js file e.g. script.js, include the js file in your head section and in your form tag add onsubmit="return Validate()". Then in the js file you create one Validate function which calls all the other functions.

  • Author

I suck at javascript so I would continue using the plugin that you started with. You can set up a rule for phone numbers

mobile: {
			required: true,
                               number: true,
                               maxlength: 11,
			minlength: 11
                               },

 

or if you want to use javascript - put all the functions in a js file e.g. script.js, include the js file in your head section and in your form tag add onsubmit="return Validate()". Then in the js file you create one Validate function which calls all the other functions.

 

Thanks for your reply. Actually, length of the field works as I expected, but now I don't know how to specify that only characters can be typed in.

I would like to show you my current code with validation to 11 characters and I have got another code with validation for characters, but I don't know how I could insert it into my current so one field has two functions assigned or something.. no idea. I know jquery is soooo simple, but I just want to know how to add another validation rule to my current function :-)

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>

<script type='text/javascript'>
function lengthRestriction(elem, min, max){
       var uInput = elem.value;
       if(uInput.length >= min && uInput.length <= max){
               return true;
       }else{
               alert("Please enter " +max+ " characters");
               elem.focus();
               return false;

       }
}
</script>

</head>

<body>
<form>
Username(11 characters): <input type='text' id='restrict' maxlength="11"/>
<input type='button' 
       onclick="lengthRestriction(document.getElementById('restrict'), 11, 11)"
       value='Check Field' />
</form>
</body>
</html>

 

This is the one I told you (validating numbers only):

 

<script type='text/javascript'>
function isNumeric(elem, helperMsg){
       var numericExpression = /^[0-9]+$/;
       if(elem.value.match(numericExpression)){
               return true;
       }else{
               alert(helperMsg);
               elem.focus();
               return false;
       }
}
</script>
<form>
Numbers Only: <input type='text' id='numbers'/>
<input type='button' 
       onclick="isNumeric(document.getElementById('numbers'), 'Numbers Only Please')"
       value='Check Field' />
</form>

Edited by design92

Dude.

 

Just use the plugin.

 

SO much easier. It's pointless writing your own JavaScript to validate when there is a plugin that already does it, and does it much better.

 

All you do, is stick the plugin in your header, and create rules like the one above.

 

It really isn't difficult. You're making this so much harder for yourself then it needs to be.

Edited by brightonmike

Create an account or sign in to comment

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.