Validating a File Name with JS

hoangvu

New member
Joined
Jun 6, 2012
Messages
1,889
Points
0
There are many things that can be done with regular expressions, but one of the most useful is validating entry fields in forms on your Web pages

This script asks for an image location and, if it passes the validation, displays the image on the page.

Code:
window.onload = initForms;

function initForms() {
     for (var i=0; i< document.forms.length; i++) {
        document.forms[i].onsubmit = function() {return validForm();}
     }
}

function validForm() {
     var allGood = true;
     var allTags = document.getElementsByTagName ("*");

     for (var i=0; i<allTags.length; i++) {
        if (!validTag(allTags[i])) {
           allGood = false;
        }
     }
     return false;

     function validTag(thisTag) {
        var outClass = "";
        var allClasses = thisTag.className.split (" ");

        for (var j=0; j<allClasses.length; j++) {
           outClass += validBasedOnClass(allClasses[j]) + " ";
        }

        thisTag.className = outClass;

        if (outClass.indexOf("invalid") > -1) {
           invalidLabel(thisTag.parentNode);
           thisTag.focus();
           if (thisTag.nodeName == "INPUT") {
              thisTag.select();
           }
           return false;
           }
           return true;

           function validBasedOnClass(thisClass) {
              var classBack = "";
              switch(thisClass) {
                 case "":
                 case "invalid":
                    break;
                 case "imgURL":
                    if (allGood && !imgURL (thisTag.value)) classBack = "invalid ";
                 default:
                    classBack += thisClass;
              }
              return classBack;
           }

           function imgURL(newURL) {
              var re = /^(file|http):\/\/\S+  \/\S+\.(gif|jpg)$/i;

              if (re.test(newURL)) {
                 document.getElementById ("chgImg").src = newURL;
                 return true;
              }
              return false;
           }

           function invalidLabel(parentTag) {
              if (parentTag.nodeName == "LABEL") {
                 parentTag.className += " invalid";
              }
          }
      }
}
If the user enters something that isn't a valid image file name, the page shows an error, thanks to regular expressions.

When the image name is entered correctly, the image is displayed on the page.
 
Older threads
Newer threads
Replies
4
Views
3,239
Replies
12
Views
5,258
Replies
17
Views
7,780
Replies
18
Views
5,866
Latest threads
Replies
2
Views
16
Replies
1
Views
89
Recommended threads
Replies
4
Views
739
Replies
2
Views
2,664
Replies
5
Views
4,362
Replies
6
Views
2,837

Latest postsNew threads

Referral contests

Referral link for :

Sponsors

Latest Blog ArticlesMost Viewed Threads

Popular tags

You are using an out of date browser. It may not display this or other websites correctly.
You should upgrade or use an alternative browser.

Top