Member Avatar for lewashby

http://www.w3resource.com/javascript/form/string-length.php

In the above link I see two different JS areas, Javascript function to restrict length of user input, & Javascript code. All I'm trying to do is validate that the users password of choice is at least x characters in length. Which one of these examples is what I'm looking for? Thanks.

  • 2 Contributors
  • 5 Replies
  • 111 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by JorgeM

Dani AI

Generated

A few concrete points to resolve what's happening in this thread and to make the password-length check reliable.

correctly flagged the immediate issues: a function-name mismatch and a JavaScript syntax error will stop the validator from running. Beyond that, the form output shown by exposes two other common problems that prevent client-side checks from working as expected: using plain text inputs for passwords and attaching validation only to the submit button click. An inline button onclick can be bypassed (for example when the Enter key is pressed), and script load failures or syntax errors will silently block the handler — both are why nothing appears to happen.

Recommended approach (practical, low-friction):

  • Use type="password" for password fields and give them stable name or id attributes so they can be selected reliably.
  • Attach validation to the form submit event (preferably with addEventListener('submit', ...)) so all submission paths are intercepted. Prevent submission by calling event.preventDefault() when validation fails. The HTML5 attributes required and minlength are helpful progressive enhancements; see the MDN guide on form validation for details.
  • Target inputs by name (or with querySelector) rather than by numeric index in form.elements to avoid fragile code when fields are reordered.

Quick troubleshooting checklist:

  • Open the browser console for syntax errors and use the Network panel to confirm check.js is loading (HTTP 200).
  • Confirm the function name in the loaded script matches the one called from the form.
  • Insert a temporary console.log at the top of the handler to verify it runs.
  • Ensure the handler blocks submission (either return false from an inline handler or event.preventDefault() in an event listener).

Finally, remember client-side checks are convenience only. Enforce the same length/match rules server-side and store passwords properly (see the OWASP Password Storage Cheat Sheet).

References: MDN — Form validation, OWASP — Password Storage Cheat Sheet.

Recommended Answers

All 5 Replies

Member Avatar for JorgeM

The first example is fine. If you want at least say 8 characters then...

if(userInput.length >= 8 {

On that site, they show you two different approaches with regard to checking...

The first is basically whether the length is greater than min AND less than the max number. If the result is true then that's good. Else, take some action.

The second example is whether the length is less than the min or greater than the max. If the result is good, then that's bad. Take the appropriate action for non compliance.

Member Avatar for lewashby

echo "<tr><td><input type='submit' value='submit' onclick='stringlength(document.form1.text1,6,8)'></td></tr>";

& the file

function lengthRange(inputtxt, minlength, maxlength)  
{     
   var userInput = inputtxt.value;    
   if(userInput.length >= minlength && userInput.length <= maxlength)  
      {       
        return true;      
      }  
   else  
      {       
    alert("Please input between " +minlength+ " and " +maxlength+ " characters");         
        return false;     
      }    
}

Are not having any affect on my password input. Any idea?

Member Avatar for JorgeM

Well, I've made some changes to your example, but you should note that the function you are calling and the name of the function in your script is different, so that's why nothing good or bad is happening in your case.

Try this..

<!DOCTYPE html>
<html>
<head>
 <title>Demo</title>
 <script>
 function validate(form, minlength, maxlength) {     
      var userInput = form.elements[0].value
      if(userInput.length >= minlength && userInput.length <= maxlength)  {       
        return true;      
      }  else  {       
         alert("Please input between " + minlength + " and " + maxlength + " characters");         
        return false;     
      }    
 }
 </script>

</head>
<body>
 <form id="form1" action="#" >
   <input type='text' /><br />
   <input type='submit' value='submit' onClick='return validate(this.form,6,8)'>
 </form>
</body>
</html>
Member Avatar for lewashby 
if($row['password'] == $passwd)
        {
        echo "<html>";
        echo "<body>";
        echo "<script src='check.js'></script>";
        echo "<form id='form1' action='changepassword.php' method='post'>";
        echo "<table>";
        echo "<tr><td>";
        echo "New Password<center><input type='text' name='newpassword1'></td></tr></center>";
        echo "<tr><td>";
        echo "Re-Enter Password<center><input type='text' name='newpassword2'></td></tr></center>";
        echo "<tr><td><input type='submit' value='submit' onclick='return validate(this.form,6,8)'></td></tr>";
        echo "</table>";
        echo "</form>";
        echo "</body>";
        echo "</html>";
        }

What am I doing wrong?

function validate(form, minlength, maxlength) 
{
var userInput = form.elements[0].value

if(userInput.length >= minlength && userInput.length <= maxlength)
{
    return true;
}
else
{
    alert("Please input between " + minlength + " and " + maxlength + " characters");
return false;
}

}
Member Avatar for JorgeM

You are missing a closing brace at the end of your javascript. If you use a web browser's dev tools, you can look at the errors generated in the console log.

I see that you started a new thread. Please try to complete one thread before you start another. I already replied in the other thread, otherwise it would have been deleted and we could have continued working with you here...

Here is the link for anyone else that if following this discussion..

http://www.daniweb.com/web-development/javascript-dhtml-ajax/threads/465310/java-script-password-length

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.