两个字段验证

时间:2013-05-15 04:02:37

标签: javascript

<html>
<head>
</head>
<body>
     <form class="form-horizontal cmxform" id="validateForm" method="get" action="../../course_controller" onsubmit="return validate();" autocomplete="off">


                    <input type="text" id="course_name" name="course_name"  placeholder="Enter Course Name..." class="row-fluid" required onkeyup="javaScript:return validate_course_name();">
                 <label id="course_name_info"  style="color:rgba(255,255,255,0.6);font-size:13px">
                      </label>

                    <input type="text" id="course_desc" name="course_desc"  placeholder="Enter Course Name..." class="row-fluid" required onkeyup="javaScript:return validate_course_desc();">
                 <label id="course_desc_info"  style="color:rgba(255,255,255,0.6);font-size:13px">
                      </label>


                    <button type="submit" name="user_action" value="add" class="btn btn-primary"  >Save</button>
                    <button type="reset" class="btn btn-secondary">Cancel</button>



              </form>
<script type="text/javascript">
  /**** Specific JS for this page ****/

  //Validation things




function validate_course_name(){

     var TCode = document.getElementById('course_name').value;
        if( /[^a-zA-Z1-9 _-]/.test( TCode ) ) {

            document.getElementById('course_name_info').innerHTML="Please Enter Only Alphanumeric or _,-,' ' ";
           return false;
        }
        else
            {
             document.getElementById('course_name_info').innerHTML="Please Enter Only Alphanumeric or _,-,' ' ";
            return true; 
            }


    }

function validate_course_desc(){

     var TCode = document.getElementById('course_desc').value;
        if( /[^a-zA-Z1-9 _-]/.test( TCode ) ) {

            document.getElementById('course_desc_info').innerHTML="Please Enter Only Alphanumeric or _,-,' ' ";
           return false;
        }
        else
            {
             document.getElementById('course_desc_info').innerHTML="Please Enter Only Alphanumeric or _,-,' ' ";
            return true; 
            }


    }
function validate(){


    return validate_course_name();

    return validate_course_desc();

}
</script>
</body>
</html>

所以这个代码...我在两个字段上应用字母数字验证,但问题是如果我给第一个输入字段有效输入和第二个无效表单提交我在哪里做错了? ...我对这个网站很新,所以任何帮助将不胜感激:)

6 个答案:

答案 0 :(得分:2)

更新的答案:

精细!只是为了与众不同=)

一行,无论validate_course_name()是否返回false,都应验证这两个字段。

JSFiddle:
http://jsfiddle.net/fVqTY/3/

function validate()
{
    return (validate_course_name() * validate_course_desc()) == true;
}

false = 0,true = 1.现在进行数学运算:)

答案 1 :(得分:1)

function validate(){    

    var value1 = validate_course_name();

    var value2 = validate_course_desc();

   if(value1 == true && value2 == true)
     return true;
   else
     return false
}

或您可以使用

function validate(){

var validate = true;
 var TCode = document.getElementById('course_name').value;
 var TCode1 = document.getElementById('course_desc').value;
    if(! /[^a-zA-Z1-9 _-]/.test( TCode ) ) {
        document.getElementById('course_name_info').innerHTML="Please Enter Only Alphanumeric or _,-,' ' ";
        validate = false;
    }
     if(! /[^a-zA-Z1-9 _-]/.test( TCode1 ) ) {
        document.getElementById('course_name_info').innerHTML="Please Enter Only Alphanumeric or _,-,' ' ";
        validate = false;
    }
    return validate;



}

然后直接调用此函数

答案 2 :(得分:1)

在此功能中,您应该只返回一次。所以这里发生的是当validate_course_name()被执行时,控制已经返回到调用例程。 validate_course_desc()行不会执行。

function validate(){


    return validate_course_name();

    return validate_course_desc();

}

你应该这样做:

function validate(){


        var bol1 = validate_course_name();

        var bol2 = validate_course_desc();

if(bol1 == true && bol2 == true)
return true;
else
return false;

}

答案 3 :(得分:0)

更改函数validate()

function validate()
{


    if(validate_course_name()  && validate_course_desc())
    {
       return true;
    } 

    return false;

}

在函数中执行return语句后,返回语句后面的其他语句不起作用。

因此,每次调用validate_course_name()函数时,都会返回bool值,甚至不会调用/执行函数validate_course_desc()。

因此,如果validate_course_name()为true,则validate函数返回true;如果validate_course_name()返回false,则返回false。当您给第一个字段有效输入而第二个无效时,表单将被提交。

答案 4 :(得分:0)

下面给出的验证方法将在调用第一个验证方法(validate_course_name)后立即返回,因此它不会执行validate_course_desc方法。

function validate(){
    return validate_course_name();
    return validate_course_desc();
}

解决方案是执行validate方法并将它们汇总以创建上述答案中给出的返回值

答案 5 :(得分:0)

两个输入字段的验证是相同的,因此您可以创建一个验证函数,该函数将element-id作为参数:

function validateInputfield(id){

     var TCode = document.getElementById(id).value;
     if( /[^a-zA-Z1-9 _-]/.test( TCode ) ) {
         document.getElementById(id).innerHTML="Please Enter Only Alphanumeric or _,-,' ' ";
         return false;
     } else {
         return true; 
     }
}

然后您可以使用函数validate()来检查两个输入字段是否有效:

function validate() {

    if (validateInputfield('course_desc_info') == true &&
        validateInputfield('course_name_info') == true) {

        return true;
    } else {
        return false;
    }

}