如何填写表格仅在填写完所有字段时才提交表格

时间:2012-03-18 16:23:55

标签: jquery

我有以下功能来检查字段。我只想在所有这些字段都不为空的情况下提交

function validateAdminInput() {

    $('.mand').each(function() {
        if ($(this).val() == '') {
            $(this).css('border','solid red 1px');
        }else{
             $(this).css('border','');
        }
    });

    $('#addproducts_form').submit();

}

8 个答案:

答案 0 :(得分:3)

function validateAdminInput() {
    var errors = 0;
    $('.mand').each(function() {
        if ($(this).val() == '') {
            $(this).css('border','solid red 1px');
            errors++;
        }else{
             $(this).css('border','');
        }
    });
    if(errors === 0) {
        $('addproducts_form').trigger('submit');
    }

}

答案 1 :(得分:1)

function validateAdminInput() {
    var isValid=true;
    $('.mand').each(function() {
        if ($(this).val() == '') {
            $(this).css('border','solid red 1px');
            isValid=false;
        }else{
             $(this).css('border','');
        }
    });
    if(isValid)
    {
       $('#addproducts_form').submit();
    }

}

答案 2 :(得分:1)

你可以使用一些jquery验证插件。它将允许验证多种方式。here is link for one

答案 3 :(得分:1)

在您的表单标记中,写下

onsubmit="return checkmyform(this);"

并在标记后添加:

function checkmyform(form){
   var $myform = $(form);
   $(".mand",myform).each(function(){
      if($(this).name()=="input"){
          if($.trim($(this).val())=="") return false;
      }else{
          if($.trim($(this).text())=="") return false;
      }
   });
   return true;
}

答案 4 :(得分:1)

function validateAdminInput() {
    var error = false;
    $('.mand').each(function() {
        if ($(this).val() == '') {
            error = true;
            $(this).css('border','solid red 1px');
        }else{
             $(this).css('border','');
        }
    });
    if(!error) $('#addproducts_form').submit();

}

答案 5 :(得分:1)

这样的事会对你有帮助吗?

 function validateAdminInput() {
        var check = false;
        $('.mand').each(function() {
            if ($(this).val() == '') {
                check = true;
                $(this).css('border','solid red 1px');
            }else{
                 $(this).css('border','');
            }
        });

      if(!check)
      {
      // your code
      }

    }

答案 6 :(得分:1)

如果我理解你的功能,应该这样做:

function validateAdminInput() {

    var allValid = true;

    $('.mand').each(function() {
        if ($(this).val() == '') {
            $(this).css('border','solid red 1px');
            allValid = false;
        }else{
             $(this).css('border','');
        }
    });

    if (allValid)
        $('#addproducts_form').submit();

}

答案 7 :(得分:0)

您可以将required属性添加到所有字段,但这仅适用于支持HTML5表单的浏览器。

对于其他人来说,这很简单:

<form action="..." method="..." onSubmit="return validate(this);">
    <!-- input fields here -->
</form>

还要确保将required属性添加到任何必填字段。然后...

<script type="text/javascript">
    function validate(form) {
        var inputs, len, i;
        if( document.querySelectorAll) {
            inputs = form.querySelectorAll('input[required], select[required], textarea[required]');
        }
        else {
            inputs = [];
            var tags = ['input','select','textarea'], tag, elms;
            while( tag = tags.shift()) {
                elms = form.getElementsByTagName(tag);
                len = elms.length;
                for( i=0; i<len; i++) if( elms[i].getAttribute("required")) inputs.push(elms[i]);
            }
        }
        len = inputs.length;
        for( i=0; i<len; i++) {
            if( inputs[i].value == '') {
                alert("Please fill out all fields");
                // customise error stuff here
                return false;
            }
        }
        return true;
    }
</script>

请注意,此解决方案采用原始JS,因此保证比任何jQuery解决方案快许多倍。