Generate javascript for HTML form fields validation

aartisesha has asked for the wisdom of the Perl Monks concerning the following question:

Hi wise monks...
This is my first posting in perlmonks.com :-). This is not full fledged perl but focus is on javascript.Hope this code will be helpful for some who wants to validate HTML form by generating javascript through perl.
Any optimization/suggestion will be helpful...

The basic idea is to pass the HTML form name followed by $required which accepts the required text fields delimited by commas.(i.e. the texbox names which should not be empty. ex: userid,password)

$password: gets two password fields including the password confirmation textbox delimited by colon.

Similarly select boxes, radio and checkboxes fieldnames are passed by comma delimiters.

$chkforword is used to validate the field value for a single word which accepts only word characters \w... for example:userid field

sub scripts
{
    ($formname,$required,$password,$emailchk,$chkforword,$selection,$r
+adio,$checkbox) = @_;
    @required = split(/,/,$required);
    @selection = split(/,/,$selection);
    @radio = split(/,/,$radio);
    @checkbox  = split(/,/,$checkbox);
         my    $reqfields = "";
            foreach(@required)
            {
            $reqfields.= "if(valid){chk(document.$formname.$_,\"Please
+ specify value for this field\");}";                
            }
            if($password ne "")
            {
                ($pwd1,$pwd2)=split(/:/,$password);
            
                $password="
                    if(valid){chk(document.$formname.$pwd1,\"Please sp
+ecify your Password\");}
                    if(valid){chk(document.$formname.$pwd2,\"Please co
+nfirm your Password\");}
                    if(valid){
                        if(document.$formname.$pwd1.value == document.
+$formname.$pwd2.value)
                            valid=true;
                           else
                           {
                            alert(\"Please Check your password\");
                            var cp=document.$formname.$pwd2;
                            cp.value=\"\";
                            cp.focus();
                            valid=false;
                        }
                              }";
            
            }
        
            
            if($emailchk ne "")
            {
                @emails = split(/,/,$emailchk);
                
                $emailchk="";
                foreach(@emails)
                {            
                $emailchk.="
                var e=document.$formname.$_;
                if(valid){
                var strS=document.$formname.$_.value;
                var blnB=/^\\w+\\@(\\[?)[a-zA-Z0-9\\-\\.]+\\.([a-zA-Z]
+{2,3}|[0-9]{1,3})(\\]?)\$\/.test(strS);
                if(blnB) { valid=true;}
                else { alert(\"Please specify valid Email-Id\");valid=
+false;e.focus();}}";
                }            
            }
            if($chkforword ne "")
            {
                $chkforword="
                if(valid){
                    var thischk = document.$formname.$chkforword;
                    var chkW = /^(\\w+[^\\s+])+\$/.test(thischk.value)
+;
                    if(chkW){valid =true;}
                    else{alert(\"Please specify valid value\");valid=f
+alse;thischk.focus();}
             }    
            ";
        }
        
        if($selection[0] ne "")
        {
            $selectfn="
                function chksel(fieldvalue, msg) 
                {
                    if(fieldvalue==\"\")    
                    {
                            alert(msg); valid = false;
                    }
                }
            
            ";
            foreach(@selection)
            {
            $selectchk.="if(valid){chksel(document.$formname.$_.option
+s[document.$formname.$_.selectedIndex].value,\"Please select an optio
+n from the list\");}";            }
        }

        if($radio[0] ne "")
        {
        $radiofn="
            function rdchk(field,msg)
            {
                var exist=0;
                if(field.checked) exist=1;
                for(var i=0;i<field.length;i++){
                if(field[i].checked)
                {
                    exist=1;
                    break;
                 }
                                                         }
                if(exist==0)
                {
                    alert(msg);
                    valid=false;
                }    
            }
            ";
            foreach(@radio)
            {
                $radiochk.= "if(valid){                        
                rdchk(document.$formname.$_,\"Please check one of the 
+options\");}";
            }
        }
        
        if($checkbox[0] ne "")
        {
            $chkfn="
            function chek(field,msg)
            {
                var exist=0;
                for(var i=0;i<field.length;i++){
                if(field[i].checked)
                {
                    exist=1;
                    break;
                 }
                                                         }
                if(exist==0)
                {
                    alert(msg);
                    valid=false;
                }    
            }
            ";
            foreach(@checkbox)
            {
            $checkchk.="if(valid){chek(document.$formname.$_,\"Please 
+check one of the options\");}";
            }
        }
            #print "Require fields: $reqfields";
        print "
        <script language='javascript'>
        var valid=true;
        function validate(frm)
        {
        valid=true;
        $reqfields
        $chkforword
        $password
        $emailchk
        $selectchk
        $radiochk
        $chekchk
        if(valid)
             return(true);    
        else
            return(false);
        }
                
        function chk(fieldvalue, msg) 
        { 
                var thisfield=fieldvalue;
                fieldvalue=fieldvalue.value;
                 re = /\s+/ig;
                 fieldvalue = fieldvalue.replace(re, \"\");     
            if (fieldvalue == \"\")  
             {
               if (valid)  
              { 
                    alert(msg);
                 thisfield.value=\"\";
                 thisfield.focus();
                 valid = false;
                 return(1);
              }  
             }
             else
              {
                  return(1);
              }
        
        } 
        $selectfn
        $radiofn
        $chekfn
</script>";
}
[download]

Example for calling the above subroutine in perl : &scripts("formname","fname,lname","pwd:cpwd","email");

Janitored by Arunbear - added readmore tags, as per Monastery guidelines

Comment on Generate javascript for HTML form fields validation Download Code

Replies are listed 'Best First'.
Re: Generate javascript for HTML form fields validation by tachyon (Chancellor) on May 04, 2005 at 06:51 UTC
CGI::Ex::Validate will autogenerate the javascript for you, as well as handling the validation server side. cheers tachyon	[reply]
Re: Generate javascript for HTML form fields validation by Anonymous Monk on May 04, 2005 at 07:03 UTC
CGI::FormBuilder creates javascript	[reply]
Re^2: Generate javascript for HTML form fields validation by Hero Zzyzzx (Curate) on May 04, 2005 at 16:09 UTC
++ on CGI::FormBuilder. It creates pretty good javascript, offers a number of basic validation schemes and is trivial to plug custom javascript into. Plus it can use multiple templatting languages or it's own built-in form renderer. -Any sufficiently advanced technology is indistinguishable from doubletalk. My Biz	[reply]