Question

我正在构建基于联系表单7 的自定义逐步表单，我需要在进入下一部分之前验证字段。如何在点击时调用验证功能？我在文档中找不到它。

$( "#next-section" ).click(function() {

  //call validate function (how to do this)??

  if('validate function no errors') {
    //call my scripts 
  }
});

Answer 1

你可以这样做：

$( "#next-section" ).click(function() {
  $('your-form').submit();
});

Answer 2

您可以调用.validate插件进行表单验证。

$( "#next-section" ).click(function() {
   $("#form").validate({
      rules: {
         name: "required",
      },
      messages: {
         name: "name is required",
      },
      submitHandler: function(form) {
         form.submit();
      }
    });
});

Answer 3

我遇到了同样的问题并得到了解决方案。

我有2个步骤的表单，我有一个想法要提交该表单，然后检查第1步中的输入字段是否经过验证（显然，该表单无法发送，因为第2步中的字段很少，因此只是使用CF7验证）。

$('.go_to_step_2').on('click', function () {

    var input = $('input[name="your-name"]'),
        form = $(this).parents('.wpcf7-form');

    form.submit();

    // trigger just one time! so validation works correctly in the 2nd step
    form.parent().one('wpcf7:invalid', function() {

        if( !input.hasClass('wpcf7-not-valid') ) {

            // this will hide valid-tips from step 2
            $('.step_2').find('.wpcf7-not-valid-tip').fadeOut(0);

            // do stuff to show step 2
        }
    });
});

点击联系表格验证7

3 个答案: