Question

我这里有表格验证。我需要为多个编辑记录创建动态表单验证。如何在for循环中进行此操作？

这是我的剧本

<script>
jQuery(function($) {
    var validation_holder;

    $("form#register_form input[name='submit']").click(function() {

    var validation_holder = 0;

        var project         = $("form#register_form input[id='n_app_cn']").val();
        var project_regex   = /^[a-zA-Z0-9]+$/; // reg ex cost check    

        var counter         = $("form#register_form input[id='n_counter']").val();
        var counter_regex   = /^[0-9]+$/; // reg ex qty check

        /* validation start */  

        if(project == "") {
            $("span.val_project").html("This field is Required.").addClass('validate');
            validation_holder = 1;
        } else {
            if(!project_regex.test(project)){ // if invalid phone
                $("span.val_project").html("Invalid Special Characters!").addClass('validate');
                validation_holder = 1;

            } else {
                $("span.val_project").html("");
            }
        }

        if(counter == "") {
            $("span.val_counter").html("");
        } else {
            if(!counter_regex.test(counter)){ // if invalid phone
                $("span.val_counter").html("Refresh to avoid Database Error!").addClass('validate');
                validation_holder = 1;

            } else {
                $("span.val_counter").html("");
            }
        }

        if(validation_holder == 1) { // if have a field is blank, return false
            $("p.validate_msg").slideDown("fast");
            return false;
        }  validation_holder = 0; // else return true
        /* validation end */    
    }); // click end 

}); // jQuery End
</script>

我看到了这个脚本但是如何将它与我当前的脚本混在一起？请帮忙

function validate() {
for(i = 0; i < document.form.rowcount.value; i++){
if (document.getElementById("client_id" + i).value=="") {
alert("empty");
document.getElementById("client_id" + i).focus();
return false;
}
}
}

Answer 1

它非常简单，只需将你的函数调用jQuery调用就可以了。

<script>
jQuery(function($) {
    var validation_holder;

    $("form#register_form input[name='submit']").click(function() {
//Put start up test thats it.
for(i = 0; i < document.form.rowcount.value; i++){
if (document.getElementById("client_id" + i).value=="") {
alert("empty");
document.getElementById("client_id" + i).focus();
return false;
}
}
    var validation_holder = 0;

        var project         = $("form#register_form input[id='n_app_cn']").val();
        var project_regex   = /^[a-zA-Z0-9]+$/; // reg ex cost check    

        var counter         = $("form#register_form input[id='n_counter']").val();
        var counter_regex   = /^[0-9]+$/; // reg ex qty check

        /* validation start */  

        if(project == "") {
            $("span.val_project").html("This field is Required.").addClass('validate');
            validation_holder = 1;
        } else {
            if(!project_regex.test(project)){ // if invalid phone
                $("span.val_project").html("Invalid Special Characters!").addClass('validate');
                validation_holder = 1;

            } else {
                $("span.val_project").html("");
            }
        }

        if(counter == "") {
            $("span.val_counter").html("");
        } else {
            if(!counter_regex.test(counter)){ // if invalid phone
                $("span.val_counter").html("Refresh to avoid Database Error!").addClass('validate');
                validation_holder = 1;

            } else {
                $("span.val_counter").html("");
            }
        }

        if(validation_holder == 1) { // if have a field is blank, return false
            $("p.validate_msg").slideDown("fast");
            return false;
        }  validation_holder = 0; // else return true
        /* validation end */    
    }); // click end 

}); // jQuery End
</script>

Answer 2

尝试使用$.each()之类的，

function validate() {
    var flag=true;
    $("form#register_form input[type='text']").each(function(i){
        if (!this.value) {
           alert("empty");
           this.focus();
           flag=false;
           return false;
        }
    });
    return flag;
}

将onclick称为submit button，例如

jQuery(function ($) {
    var validation_holder;
    $("form#register_form input[name='submit']").click(function () {        
        var emptyFlag=validate();
        if(emptyFlag){
            // your remaining code for validation   
        }
    }); // click end 
}); // jQuery End

已更新，您可以添加class required, project, counter来检查这些字段，并在js更改内容，

function validate() {
    var flag=true;
    $("form#register_form input.required").each(function(i){// use required class
        // same as above for all required fields
    });
    return flag;
}

对project class进行测试，

$('.project').each(function(){ // use $.each for all project class
    project = this.value;
    if (project == "") {
        // use $(this).next to show error in front of text box
        $(this).next("span.val_project")
               .html("This field is Required.").addClass('validate');
        validation_holder = 1;
    } else {
        if (!project_regex.test(project)) { // if invalid phone
            $(this).next("span.val_project").html("Invalid Special Characters!").addClass('validate');
            validation_holder = 1;
        } else {
            $(this).next("span.val_project").html("");
        }
    }
});
// Similarily you can add checks for item, counter, etc.

Answer 3

我已在其他帖子上发布了类似的代码..请相应修改代码，链接为 -

How to do validation in JQuery dialog box?

如果这个答案是正确的，那么请将其标记为答案，以便其他人可以在将来将其作为参考

多个记录的动态表单验证

3 个答案: