Проверка формы HTML - PullRequest
Новая
       1

Проверка формы HTML

2 голосов
/ 30 декабря 2011

Я создал простую HTML-форму, которая принимает ввод от имени пользователя клиента. Он проверяет, действительно ли это действительное имя пользователя или нет. Если да, то он должен перейти на страницу step2.php, если нет, то он должен отобразить ошибку и остаться на исходной странице.

Вот мой HTML-код: 

<form method="post" onsubmit="validateUsername();" id="myform" name="myform" action="step2.php">
      Choose username: <input type="text" id="username" name="username" />
      <input type="submit" value="Submit">
</form>

Я проверяю имя пользователя с помощью функции JavaScript: 

function validateUsername()
{
    var x=document.forms["myform"]["username"].value.length;

    if (x < 5)
    {
        alert('Username too short.');
        return false;
    }
    else
    {
        return true;
    }
}

Моя проблема:

Если пользователь вводит короткое имя пользователя, то отображается предупреждение «Слишком короткое имя пользователя». Когда я нажимаю кнопку «ОК» в сообщении с предупреждением, оно переходит на step2.php. В идеале он должен отправлять данные в step2.php только тогда, когда имя пользователя проверено правильно. Но этого не происходит.

Кто-нибудь может найти ошибку в моем коде?

Ответы [ 5 ]

4 голосов
/ 30 декабря 2011

Изменение: 

<form method="post" onsubmit="validateUsername();" id="myform" name="myform" action="step2.php">
      Choose username: <input type="text" id="username" name="username" />
      <input type="submit" value="Submit">
</form>

Кому: 

<form method="post" onsubmit="return validateUsername();" id="myform" name="myform" action="step2.php">
      Choose username: <input type="text" id="username" name="username" />
      <input type="submit" value="Submit">
</form>

Обратите внимание на добавление ключевого слова return, которое должно отменить отправку формы, если validateUsername возвращает false.

3 голосов
/ 30 декабря 2011

Попробуй это. (Добавьте возврат в onsubmit в форме) 

<form method="post" onsubmit="return validateUsername();" id="myform" name="myform" action="step2.php">
      Choose username: <input type="text" id="username" name="username" />
      <input type="submit" value="Submit">
</form>

Также на другом замечании, убедитесь, что вы также проверили этот корень php на шаге 2, так как проверка на стороне клиента может быть легко обойдена.

2 голосов
/ 30 декабря 2011

Добавьте return перед вызовом функции: 

onsubmit="return validateUsername();"

.. или используйте event.preventDefault(): 

onsubmit="if(!validateUsername()) event.preventDefault();"
0 голосов
/ 12 июня 2015 
function validation(){

    var eid=$.trim($('#email').val());
   var password=$.trim($('#password').val());
    var emailval =/^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z])+/;
   var con=/^\(?([0-9]{3})\)?[-. ]?([0-9]{3})[-. ]?([0-9]{4})$/;

   var errmsg='';
   var c=0;
   var cur_el='';
   if(eid=='' || eid==null)
   {
       errmsg="enter your email";
       cur_el=$('#email');
       c=1;
   }
   else if (!emailval.test(eid)) {
        errmsg="Please provide a valid email address (hints : daskoushik9@gmail.com)";
        cur_el=$('#email');
        c=1;
    }

    else if(password=='')
    {
        errmsg="enter password";
        cur_el=$('#password');
        c=1;
      }
      else if(password.length<4)
    {
        errmsg="password is too short";
        cur_el=$('#password');
        c=1;
      }
       if(c==1 && errmsg!=''){
         alert(errmsg);
         cur_el.focus();
         return false;
     }   
     else 
         {return true;}
}
function adminprofilevalidation(){
    var ad_uname=$.trim($('#admin_username').val());
    var ad_oldpass=$.trim($('#admin_passo').val());
   var ad_newpass=$.trim($('#admin_pass').val());
   var ad_repass=$.trim($('#admin_passc').val());
   var ad_email=$.trim($('#admin_email').val());
//    var eid=$.trim($('#email').val());
//   var password=$.trim($('#password').val());
  //  var cpassword=$.trim($('#cpassword').val());
//   var file=$('#file').val();

   var errmsg='';
   var c=0;
   var cur_el='';
   //var em=/^([a-zA-Z0-9_.-])+@([a-zA-Z0-9_.-])+\.([a-zA-Z])+([a-zA-Z])+/;
   var alphaExp = /^[a-zA-Z]+$/;
//   var alphaNum = /^[0-9a-zA-Z]+$/;
//   var digit = /^[0-9]+$/;
//   var fdigit=/^[0]+$/;
   var emailval = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z])+/;
   var con=/^\(?([0-9]{2})\)?[-. ]?([0-9]{3})[-. ]?([0-9]{4})$/;

   if(ad_uname=='' || ad_uname==null)
    {   
        errmsg="Enter User name";
        cur_el=$('#admin_username');
        c=1;
    }
    else if(!ad_uname.match(alphaExp)){
        errmsg="Please enter only letters for your name";
        cur_el=$('#firstname');
        c=1;
    }
    else if(ad_oldpass=='' || ad_oldpass==null)
    {
        errmsg="enter Old password";
        cur_el=$('#admin_passo');
        c=1;
    } else if(ad_oldpass.length<4)
    {
        errmsg="password is too short";
        cur_el=$('#admin_passo');
        c=1;
      }

      else if(ad_newpass=='' || ad_newpass==null)
    {
        errmsg="please enter new password";
        cur_el=$('#admin_pass');
        c=1;
    }
    else if(ad_newpass.length<4)
    {
        errmsg="password is too short";
        cur_el=$('#admin_pass');
        c=1;
      }
     else if(ad_repass=='' || ad_repass==null)
    {
        errmsg="please re enter the password";
        cur_el=$('#admin_passc');
        c=1;
    } 
    else if(ad_repass.length<4)
    {
        errmsg="password is too short";
        cur_el=$('#admin_passc');
        c=1;
      }




    else if(ad_email=='' || ad_email==null)
   {
       errmsg="Enter your email";
       cur_el=$('#admin_email');
       c=1;
   }
   else if (!emailval.test(ad_email)) {
        errmsg='Please provide a valid email address (hints : daskoushik9@gmail.com)';
        cur_el=$('#admin_email');
        c=1;
    }




     if(c==1 && errmsg!=''){
         alert(errmsg);
         cur_el.focus();
         return false;
     }   
     else 
         {return true;}


}


function companyprofilevalidation(){
    var co_name=$.trim($('#company_name').val());
    var co_pcntact=$.trim($('#company_contact_person').val());
   var co_add=$.trim($('#company_address').val());
   var co_phn=$.trim($('#company_phone').val());
   var co_email=$.trim($('#company_email').val());


   var errmsg='';
   var c=0;
   var cur_el='';
   //var em=/^([a-zA-Z0-9_.-])+@([a-zA-Z0-9_.-])+\.([a-zA-Z])+([a-zA-Z])+/;
   var alphaExp = /^[a-zA-Z]+$/;
//   var alphaNum = /^[0-9a-zA-Z]+$/;
          var digit = /^[0-9]+$/;
         var fdigit=/^[0]+$/;
   var emailval = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z])+/;
   var con=/^\(?([0-9]{2})\)?[-. ]?([0-9]{3})[-. ]?([0-9]{4})$/;

   if(co_name=='' || co_name==null)
    {   
        errmsg="Enter Company name";
        cur_el=$('#company_name');
        c=1;
    }

    else if(co_pcntact=='' || co_pcntact==null)
    {
        errmsg="enter Person Contact name";
        cur_el=$('#company_contact_person');
        c=1;
    } 

      else if(co_add=='' || co_add==null)
    {
        errmsg="please enter company address";
        cur_el=$('#company_address');
        c=1;
    }

     else if(co_phn=='' || co_phn==null)
    {
        errmsg="please enter company phone no";
        cur_el=$('#company_phone');
        c=1;
    } 
      else if(fdigit.test(co_phn)){
         errmsg="first digit must be non zero";
         cur_el=$('#company_phone');      
         c=1;
      }
        else if(co_phn.length<10)
    {
        errmsg="please give 10 digit no";
        cur_el=$('#company_phone');
        c=1;
      }




    else if(co_email=='' || co_email==null)
   {
       errmsg="Enter your email";
       cur_el=$('#company_email');
       c=1;
   }
   else if (!emailval.test(co_email)) {
        errmsg='Please provide a valid email address (hints : daskoushik9@gmail.com)';
        cur_el=$('#company_email');
        c=1;
    }



     if(c==1 && errmsg!=''){
         alert(errmsg);
         cur_el.focus();
         return false;
     }   
     else 
         {return true;}

//    else if(file=='')
//        {
//            errmsg="upload your photo";
//            cur_el=$('#uploadfile');
//            c=1;
//        }
//        else if(fdigit.test(phone)){
//         errmsg="first digit must be non zero";
//         cur_el=$('#phone');
//          c=1;
//        }
}


function jobaddvalidation(){


   var errmsg='';
   var c=0;
   var cur_el='';
   //var em=/^([a-zA-Z0-9_.-])+@([a-zA-Z0-9_.-])+\.([a-zA-Z])+([a-zA-Z])+/;
   var alphaExp = /^[a-zA-Z]+$/;
//   var alphaNum = /^[0-9a-zA-Z]+$/;
          var digit = /^[0-9]+$/;
         var fdigit=/^[0]+$/;
   var emailval = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z])+/;
   var con=/^\(?([0-9]{2})\)?[-. ]?([0-9]{3})[-. ]?([0-9]{4})$/;

   var jtitle=$.trim($('#job_title').val());
    var jsummery=$.trim($('#job_summery').val());
   // var jdescription=$.trim($('#job_description').val());
    var cid=$.trim($('#category_id').val());
    var jreq=$.trim($('#job_requirements').val());
    var jcdetails=$.trim($('#job_contact_details').val());
    var jcpname=$.trim($('#job_contact_person_name').val());
    var jcpemail=$.trim($('#job_contact_person_email').val());
    var jacdetails=$.trim($('#job_additional_contact_details').val());
     var jscopy='';
        if(document.form1.job_scan_copy.checked){
        jscopy=$.trim($('#job_scan_copy').val());
    }

    var jnscopy='';
    jnscopy=$.trim($('#job_no_scan_copy').val());
    var jloc=$.trim($('#job_location').val());
    var jctc=$.trim($('#job_ctc').val());
    var jureq=$.trim($('#job_upload_requirement').val());

    if(jtitle==null || jtitle=='')
    {
        errmsg="please give job title";
        cur_el=$('#job_title');
        c=1;
    }else if(jsummery==null || jsummery=='')
    {
        errmsg="please give job summery ";
        cur_el=$('#job_summery');
        c=1;
    }
//    else if(jdescription==null || jdescription=='')
//    {
//        errmsg="please mention job description";
//        cur_el=$('#job_description');
//        c=1;
//   }
   else if(cid==null || cid=='')
    {
        errmsg="please give category name";
        cur_el=$('#category_id');
        c=1;
    }else if(jreq==null || jreq=='')
    {
        errmsg="please give job requirement";
        cur_el=$('#job_requirements');
        c=1;
    }

    else if(jcdetails==null || jcdetails=='')
    {
        errmsg="please give job contact details";
        cur_el=$('#job_contact_details');
        c=1;
    }else if(jcpname==null || jcpname=='')
    {
        errmsg="please give job contact person name";
        cur_el=$('#job_contact_person_name');
        c=1;
    }else if(jcpemail==null || jcpemail=='')
    {
        errmsg="please give job contact person email";
        cur_el=$('#job_contact_person_email');
        c=1;
    }else if(!emailval.test(jcpemail))
    {
        errmsg="please give valid job contact person email";
        cur_el=$('#job_contact_person_email');
        c=1;
    }else if(jacdetails==null || jacdetails=='')
    {
        errmsg="please give job additional contact details";
        cur_el=$('#job_additional_contact_details');
        c=1;
    }else if((jscopy!='' && jnscopy=='') || (jscopy=='' && jnscopy!=''))
    {
        errmsg="please give both scan copy and no scan copy OR both un select";
        cur_el=$('#job_scan_copy');
        c=1;
    }else if(jloc==null || jloc=='')
    {
        errmsg="please mention job location";
        cur_el=$('#job_location');
        c=1;
    }else if(jctc==null || jctc=='')
    {
        errmsg="please mention job C T C";
        cur_el=$('#job_ctc');
        c=1;
    } 



     if(c==1 && errmsg!=''){
         alert(errmsg);
         cur_el.focus();
         return false;
     }   
     else 
         {return true;}

}
0 голосов
/ 01 января 2013

Сначала создайте html-форму, не используйте return перед функцией javascript в событии onsubmit формы 

<form method="post" onsubmit="validateUsername();" id="myform" name="myform"      action="step2.php">
  Choose username: <input type="text" id="username" name="username" />
  <input type="submit" value="Submit">

Теперь функция javascript, вы должны задать только одно условие, если имя пользователя меньше 5 символов, она не будет отправлять форму, иначе она отправит форму и отправит данные на step2.php 

function validateUsername()

{ var x = document.myform.username.value.length; 

if (x < 5)
{
    alert('Username too short.');
    return false;
}

}

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...