Form Checking: Field must have minimum length

I have virtually no JS experience (I am a PHP programmer), so pardon my ignorance.

I just want some JS to check one field has at least 3 (non-whitespace) characters, if not, show an Alert Box with an error message.

Here is an extract of my JS:

<script language="javascript" type="text/javascript">
      
      function MinLengthEntry(val, len, str)
      {
            if(val.length < len)
            {
                  alert(str);
                  return false;
            }
            return true;
      }
      
      function ValidateData()
      {
            val = document.form_search.part_number.value;
            val = val.replace(/(^\s*)|(\s*$)/g);
            return MinLengthEntry(val, 3, "You must enter at least 3 characters in the Part Number field!");
      }
      
</script>

The Submit button code is:

<INPUT TYPE="SUBMIT" NAME="search" VALUE="Search" ID="Forms Button2"  onSubmit="return ValidateData();">

Where is my error?
Calvin ClosePresidentAsked:
Who is Participating?
 
radarshCommented:
Also, onsubmit is done on form... Not on the submit button.

<form name="form_search" onSubmit="return ValidateData();">

________
radarsh
0
 
radarshCommented:
>> val = val.replace(/(^\s*)|(\s*$)/g);

Should be

   val = val.replace(/(^\s*)|(\s*$)/g, '');


________
radarsh
0
 
KudzullcCommented:
calvinclose,
I see one error right off the bat.  You can not have spaces here < ID="Forms Button2> needs to be "Forms_Button2".
And, this is a big AND.  Please be sure that all your javascript is in the same case.  This is one of the first things JS coders learn.  If you call this val = document.form_search.part_number.value;   you must make sure that these form_search.part_number match case everywhere.

I hope this helps!

gl,
Lucas
0
Cloud Class® Course: Microsoft Exchange Server

The MCTS: Microsoft Exchange Server 2010 certification validates your skills in supporting the maintenance and administration of the Exchange servers in an enterprise environment. Learn everything you need to know with this course.

 
Pravin AsarPrincipal Systems EngineerCommented:
How about this solution.. this one does not permit user to submit unless valid part number is entered ..

<html>
<head>
<title>Validate Part Number</title>
</head>

<body>
<script language="javascript" type="text/javascript">
function ValidatePartNumber(fld) {
      var str = fld.value;
      var value = str.replace(/^(\s{1,})|(\s{1,})$|(\s{1,})/g, '');
      fld.value = value;
      var subBtn = fld.form.Forms_Button2;
      subBtn.disabled = true;
      if (value.length >= 3) {
            subBtn.disabled = false;
      }

}
</script>

<form>
Part Number : <input type="text" value="" onKeyUp="ValidatePartNumber(this);" title="At least 3 character long">
<INPUT TYPE="SUBMIT" NAME="search" VALUE="Search" name="Forms_Button2" ID="Forms_Button2" disabled="disabled">
</form>

</body>
</html>
0
 
KudzullcCommented:
Great Idea PR!

calvinclose,

Do you want to remove whitespace?

fld.value = value; ?

Lucas
0
 
trailblazzyr55Commented:
here's a script that will validate that there is at least 3 non space chars in the field, and show an alert if the criteria is not met...

On this as well, the form will not submit until that field has the required minimum three non space chars.
You can actually click the submit, but it will not submit until requirements are met in the text field.

<html>
<head>
<title>Validate Part Number</title>
</head>

<body>
<script language="javascript" type="text/javascript">
function ValidatePartNumber(){
      var obj=document.getElementById("partNumber").value.replace(/\s/g,"");
      if(obj.length<3){
            alert("You must enter at least 3 characters in the Part Number field!");
            return false;
      }return true;
}
</script>

<form name="testingForm" action="" method="post" onSubmit="return ValidatePartNumber();">
Part Number :
<input type="text" id="partNumber" name="partNumber" title="At least 3 character long">
<INPUT TYPE="SUBMIT" NAME="search" VALUE="Search" NAME="Forms_Button2" ID="Forms_Button2">
</form>

</body>
</html>
0
 
Calvin ClosePresidentAuthor Commented:
Great!  It is now working.  One last question:

I have a global_constants.php file that is included.  I want to be able to declare a constant in that file that will determine the minimum length (instead of just using '3').

1. How do I declare the constant?
2. How do I change this line so that it works?
  return MinLengthEntry(val, 3, "You must enter at least 3 characters in the Part Number field!");


Thanks,
0
 
trailblazzyr55Commented:
in your PHP file being included you could set a "var" within <script> tags, then the javascript on your page would pick it up..

<included PHP file>
------------------------
<script>
var MyConstant = " [php value or any value you want] ";
</script>
-----------------------

<On your Page>
--------------------------
<script language="javascript" type="text/javascript">
function ValidatePartNumber(){
     var obj=document.getElementById("partNumber").value.replace(/\s/g,"");
     if(obj.length < MyConstant ){
          alert("You must enter at least "+MyConstant+" characters in the Part Number field!");
          return false;
     }return true;
}
</script>
--------------------------
0
 
Calvin ClosePresidentAuthor Commented:
Thanks everyone for your help!
0
 
KudzullcCommented:
np,
Lucas
0
 
trailblazzyr55Commented:
Glad we could help, good luck ;o)

~trail
0
 
radarshCommented:
:)

________
radarsh
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.