CODEWITHSUNDEEP
javascripthtmlvalidation
sg552
sg552

Reputation: 1543

Javascript validate two textbox

The code below validate two nameserver textbox. As you can see there is redundancy in the javascript code. // validate textbox 1 and // validate textbox 2. Is there anyway I could just use one script.. you know I just want to use 1 validation function to validate two textbox. I'm sorry for my English I hope you all can understand me. Thank you.

    <script type="text/javascript">

// validate textbox 1
     function validate_domain(){
       var nameserver1 = document.getElementById('nameserver1').value;
       var domain_array = nameserver1.split('.');

      var domain = domain_array[0];
    //This is reguler expresion for domain validation
      var reg = /^([A-Za-z0-9])+[A-Za-z0-9-]+([A-Za-z0-9])$/;

    if(domain == ''){
         alert("Please enter the domain name"); 
         document.getElementsById('nameserver1').focus();
         return false; 
    } 

    if(reg.test(domain) == false){
       alert("Invalid character in domain. Only letters, numbers or hyphens are allowed.");
      document.getElementsById('nameserver1').focus();
       return false;
    }

    }



    // validate textbox 2
     function validate_domain(){
       var nameserver1 = document.getElementById('nameserver1').value;
       var domain_array = nameserver2.split('.');

      var domain = domain_array[0];
    //This is reguler expresion for domain validation
      var reg = /^([A-Za-z0-9])+[A-Za-z0-9-]+([A-Za-z0-9])$/;

    if(domain == ''){
         alert("Please enter the domain name"); 
         document.getElementsById('nameserver2').focus();
         return false; 
    } 

    if(reg.test(domain) == false){
       alert("Invalid character in domain. Only letters, numbers or hyphens are allowed.");
      document.getElementsById('nameserver2').focus();
       return false;
    }

    }
    </script>

 <fieldset class="inlineLabels">

            <label for="name">Nameserver 1</label>
            <input type="text" class="textInput" maxlength="255" size="30" value="" id="nameserver1" name="nameserver1">

            <label for="data">Nameserver 2</label>
            <input type="text" class="textInput" maxlength="255" size="30" value="" id="data" name="nameserver2">

        </fieldset>

          <button onclick="validate_domain(); submitForm('page1','directpage.php');" value="Validate" name="btn_validate" type="button" class="positive iconstxt icoPositive"><span>Save</span></button>

Upvotes: 1

Views: 5894

Answers (5)

pete
pete

Reputation: 25081

Saw this one at work. Played with it at home. Here's a working jsFiddle. Yes, it's overly complex, but I detest alert('annoying pop-up');.

I commented the source, so you would better understand why I wrote it like that.

sg522: It may not copy/paste into your code and work, but I don't know what the rest of your code is. Neither are we here to write your code for you. We are here to help you learn and become a more experienced programmer.

Please let us know if you have questions.

Happy coding!

UPDATE: Modified jsFiddle to work with Opera and Firefox 10. Neither Opera or Firefox apparently allow cloneNode to be called without parameters now. Opera also apparently does not allow chained variable declarations.

Upvotes: 1

arb
arb

Reputation: 7863

Well here is another approach:

function ValidateDomain(){
    function CheckForBlank(domain, textBox){
        if(domain == ''){
             alert("Please enter the domain name"); 
             document.getElementsById('nameserver1').focus();
             return false; 
        } 
    }
    function CheckForFormat(domain, textBox){
        if(reg.test(domain) == false){
            alert("Invalid character in domain. Only letters, numbers or hyphens are allowed.");
            document.getElementsById('nameserver1').focus();
            return false;
        }
    }
    function GetDomainName(inputId){
        var serverName = document.getElementById(inputId).value,
            domain_array = serverName.split('.');

        return domain_array[0];
    }
    var nameserver1 = GetDomainName('nameserver1'),
        nameserver2 = GetDomainName('nameserver2'),
        nameServerInput1 = document.getElementsById('nameserver1');
        nameServerInput2 = document.getElementsById('nameserver2');

    if (CheckForFormat(nameserver1,nameServerInput1) && CheckForBlank(nameserver1,nameServerInput1) 
        && CheckForFormat(nameserver2,nameServerInput2) && CheckForBlank(nameserver2,nameServerInput2)){
        //This means you are valid
        return {
            name1:nameserver1,
            name2:nameserver2 
        }
    }
    return false;
}

Upvotes: 1

Mikey G
Mikey G

Reputation: 3491

Maybe like this: 

    <script type="text/javascript">

function validate_domain(){

           validateTextBox('nameserver1');
            validateTextBox('nameserver2');
}

        function validateTextBox(tbName){

               var nameserver1 = document.getElementById(tbName).value;
               var domain_array = nameserver1.split('.');

              var domain = domain_array[0];
            //This is reguler expresion for domain validation
              var reg = /^([A-Za-z0-9])+[A-Za-z0-9-]+([A-Za-z0-9])$/;

            if(domain == ''){
                 alert("Please enter the domain name"); 
                 document.getElementsById(tbName).focus();
                 return false; 
            } 

            if(reg.test(domain) == false){
               alert("Invalid character in domain. Only letters, numbers or hyphens are allowed.");
              document.getElementsById(tbName).focus();
               return false;
            }

            }

        }
            </script>

Upvotes: 1

Nabab
Nabab

Reputation: 2644

    <script type="text/javascript">

// validate textbox
     function validate_domain(ele){
       var nameserver = ele.value;
       var domain_array = nameserver.split('.');

      var domain = domain_array[0];
    //This is reguler expresion for domain validation
      var reg = /^([A-Za-z0-9])+[A-Za-z0-9-]+([A-Za-z0-9])$/;

    if(domain == ''){
         alert("Please enter the domain name"); 
         ele.focus();
         return false; 
    } 

    if(reg.test(domain) == false){
       alert("Invalid character in domain. Only letters, numbers or hyphens are allowed.");
      ele.focus();
       return false;
    }

    }
    </script>

 <fieldset class="inlineLabels">

            <label for="name">Nameserver 1</label>
            <input type="text" class="textInput" maxlength="255" size="30" value="" id="nameserver1" name="nameserver1">

            <label for="data">Nameserver 2</label>
            <input type="text" class="textInput" maxlength="255" size="30" value="" id="data" name="nameserver2">

        </fieldset>

          <button onclick="validate_domain(document.getElementById('nameserver1')); validate_domain(document.getElementById('nameserver2')); submitForm('page1','directpage.php');" value="Validate" name="btn_validate" type="button" class="positive iconstxt icoPositive"><span>Save</span></button>

Upvotes: 0

Justin Rhyne
Justin Rhyne

Reputation: 217

Take the id of the element you want to validate as a parameter of your function.

// validate textbox
 function validate_domain(serverName){
   var server = document.getElementById(serverName).value;
   var domain_array = server.split('.');

  var domain = domain_array[0];
//This is reguler expresion for domain validation
  var reg = /^([A-Za-z0-9])+[A-Za-z0-9-]+([A-Za-z0-9])$/;

if(domain == ''){
     alert("Please enter the domain name"); 
     document.getElementsById(serverName).focus();
     return false; 
} 

if(reg.test(domain) == false){
   alert("Invalid character in domain. Only letters, numbers or hyphens are allowed.");
  document.getElementsById(serverName).focus();
   return false;
}

}

Upvotes: 0

Related Questions