Question

我想知道是否有办法使用Bootstrap Validator将所有输入字段值发送到远程PHP文件。

为了解释，我在登录表单中有两个输入字段。我在两个输入字段上使用Bootstrap Validator的远程验证。每个验证仅发送请求的输入字段的值，并且在PHP后端无法通过$_POST访问其他输入字段。

我知道我可以使用data选项将数据发送到PHP后端，但是如果我要在该部分中发送不同输入字段的值，我不确定如何格式化。

这是一个编码示例。

$(document).ready(function() {
    $('#login_form').bootstrapValidator({
        fields: {
            username: {
                message: 'Invalid',
                validators: {
                    remote: {
                        message: 'Invalid',
                        url: '/path/to/backend/',
                        data: {
                            password: // What do I put here?
                        }
                    }
                }
            },
            password: {
                message: 'Invalid',
                validators: {
                    remote: {
                        message: 'Invalid',
                        url: '/path/to/backend/',
                        data: {
                            username: // What do I put here?
                        }
                    }
                }
            }
        }
    });
});

该编码示例是解决我的问题并将两个输入字段值提交到后端的一种方法。如果有人使用此方法解决了我的问题，或者我可以将所有输入字段值提供给后端，请告诉我。

提前感谢您提供任何帮助。

Answer 1

要将表单中的任何输入字段发送到后端，只需调用验证器函数，该函数可以调用表单中输入字段的值，并将它们分配给带有描述性名称的参数。然后可以在/ path / to / backend中从POST（或从配置它的GET）访问此参数。

您可以在下面看到修改后的代码。我希望它对你有用。它是经过全面测试的代码。

请发送反馈。

$(document).ready(function() {
$('#login_form').bootstrapValidator({
    fields: {
        username: {
            message: 'Invalid',
            validators: {
                remote: {
                    url: '/path/to/backend/',
                    data: function(validator) {
                       return {
                           password: $('[name="passwordNameAttributeInYourForm"]').val(),
                           whatever: $('[name="whateverNameAttributeInYourForm"]').val()
                       };
                    },
                   message: 'Invalid'
                }
            }
        },
        password: {
            message: 'Invalid',
            validators: {
                remote: {
                    url: '/path/to/backend/',
                    data: function(validator) {
                       return {
                           username: $('[name="usernameNameAttributeInYourForm"]').val(),
                           whatever: $('[name="whateverNameAttributeInYourForm"]').val()
                       };
                    },
                   message: 'Invalid'
                }
            }
        }
    }
});

}）;

Answer 2

要使用引导程序验证程序将数据发送到后端，请使用此代码。

$(document).ready(function() {
          $('#student_view').bootstrapValidator({
              // To use feedback icons, ensure that you use Bootstrap v3.1.0 or later
              container: 'tooltip',
              feedbackIcons: {
                  valid: 'glyphicon glyphicon-ok',
                  invalid: 'glyphicon glyphicon-remove',
                  validating: 'glyphicon glyphicon-refresh'
              },
              fields: {
                  coursename: {
                      validators: {
                          notEmpty: {
                              message: 'Please select course name'
                          },
                          remote: {
                            url: 'abc.php', //path to backend
                            data: function(validator) {
                               return {
                                   course: $('#course').val(), //sending dynamic data value
                                   password: $('#password').val()
                               };
                            },
                           message: 'Invalid'
                        }
                      }
                  },


                 }
              })
              .on('success.form.bv', function(e) {
                      $('#student_view').data('bootstrapValidator').resetForm();

                  // Prevent form submission
                  e.preventDefault();

                  // Get the form instance
                  var $form = $(e.target);

                  // Get the BootstrapValidator instance
                  var bv = $form.data('bootstrapValidator');

                  // Use Ajax to submit form data
                  $.post($form.attr('action'), $form.serialize(), function(result) {
                      console.log(result);
                  }, 'json');
              });
      });

后端必须以以下格式返回输出

{ "valid": true } or { "valid": false }

Bootstrap Validator - 将所有输入字段值发送到远程PHP文件

2 个答案: