Question

我在复选框ajax验证方面遇到了问题？

我的所有其他表单显示ajax验证除了复选框可能已输入表格已有值但我无法找出解决方案。

我的阿贾克斯......

    $(function() {


          (function() {

            $('.load').addClass('hide');

            $(document).on('submit', '.add_restaurant', function() {

              // remove prior message which might have accumulated during earlier update
              $('.error-message').each(function() {
                $(this).removeClass('make-visible');
                $(this).html('');
              });


              $('input').each(function() {
                $(this).removeClass('errors');
              });



              // current form under process
              var current_form = $(this);

              // === Dynamically get all the values of input data
              var request_data = {};

              request_data['_token'] = $(this).find('input[name=_token]').val();


              current_form.find('[name]').each(function() {
                request_data[$(this).attr("name")] = $(this).val();
              });

              $('.load').addClass('make-visible');
              // == Dynamic value retrieval ends here

              $.post(
                $(this).attr('action'),
                request_data,
                function(data) {

                  console.log(data);

                  if (data.status == 'success') {

                    $('.load').removeClass('hide');

                    console.log('success');


                    if (window.location.href.indexOf("reservation") > -1) {
                      window.location.href = data.url;
                    } else {
                      location.reload();
                    }

                    //location.reload();

                  } else if (data.status == 'fails') {

                    for (var key in data.errors) {

                      // skip loop if the property is from prototype
                      if (!data.errors.hasOwnProperty(key)) continue;

                      var error_message = data.errors[key];

                      current_form.find("[name=" + key + "]").addClass('errors');

                      var parent = current_form.find("[name=" + key + "]").parent();
                      parent.find('.error-message').addClass('make-visible').html(error_message);

                    }

                  }

                }
              );

          return false;

        });

      })();

});

这是刀片模板，但我只显示复选框表单，因为它很长。

<label>Gender</label>
<div class="gender radiobtn">
  <input type="radio" name="gender" value="M" id="male">
  <label for="male">Male</label>
  <input type="radio" name="gender" value="F" id="female">
  <label for="female">Female</label>
  <span class="error-message"></span>

</div>

我错了？先谢谢

Answer 1

因为您在两个复选框上都分配了一个值，所以当您的验证代码运行时，它是有效的。 value =“M”和value =“F”

您可以做的是验证是否选中了其中一个复选框。

current_form.find('[name]').each(function(){
        request_data[$(this).attr("name")] = $(this).val();
    });

if (!$("#male").is(":checked") && !$("#female").is(":checked"))
            {
               //gender has no check
               $(".gender").addClass("errors")
            }

如果.is（“已选中”）无效，请尝试在.attr中更改它（“已检查”）==“false”

Answer 2

实际上我得到了答案。发生了什么事情，它已经取得了价值所以错误对象没有附加。

我们需要的是清空值并检查表单是否被检查，只需插入数据库。

这里我是如何通过大量研究来解决的

        current_form.find('[name]').each(function(){
            request_data[$(this).attr("name")] = $(this).val();


            if($('#male').is(":checked"))
            {
                 request_data['gender']='M';
            }
            if($('#female').is(":checked"))
            {
                request_data['gender']='F';
            }

谢谢你@ Jeric Cruz的宝贵建议

如何使用ajax验证复选框表单？

2 个答案: