Question

当我尝试提交使用bootstrapValidator（）验证字段的表单时，我遇到了问题 - ＆gt;它没有提交，php文件没有被执行（我知道因为我尝试过没有booststrapValidator而且它有效）。有什么想法吗？

表格如下：

<form id="contactForm"  class="form-horizontal" role="form" action="contact_form.php" method="post">
      <div class="form-group">
        <label class="control-label col-sm-2" for="name">Name</label>
        <div class="col-sm-10">
          <input type="text" class="form-control" id="name" name="name" placeholder="Name">
        </div>
      </div>
      <div class="form-group">
        <label class="control-label col-sm-2" for="email">Email</label>
        <div class="col-sm-10"> 
          <input type="email" class="form-control" id="email" name="email" placeholder="example@domain.com">
        </div>
      </div>
      <div class="form-group"> 
        <label class="control-label col-sm-2" for="msg">Mesage</label>
        <div class="col-sm-10"> 
            <textarea class="form-control col-sm-10" id="msg" name="msg" placeholder=""></textarea>
        </div>
      </div>
      <div class="form-group">
        <label id="captchaOperation" class="control-label col-sm-2" for="captcha"></label>
        <div class="col-sm-10"> 
          <input type="text" class="form-control" id="captcha" name="captcha" placeholder="Answer">
        </div>
      </div>
      <div class="form-group"> 
        <div class="col-sm-offset-2 col-sm-10">
          <input type="submit" class="btn btn-primary" id="submit" name="submit" value="Send"></button>
        </div>
      </div>
</form>

Answer 1

从id="submit" name="submit"和</button>中删除

<input type="submit" class="btn btn-primary" id="submit" name="submit" value="Send"></button>

在data-toggle="validator"

中添加<form>

<form id="contactForm" class="form-horizontal" role="form" action="contact_form.php" method="POST" data-toggle="validator">

如此完整的表格

<form id="contactForm" class="form-horizontal" role="form" action="contact_form.php" method="POST" data-toggle="validator">
    <div class="form-group">
        <label class="control-label col-sm-2" for="name">Name</label>
        <div class="col-sm-10">
            <input type="text" class="form-control" id="name" name="name" placeholder="Name">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-sm-2" for="email">Email</label>
        <div class="col-sm-10">
            <input type="email" class="form-control" id="email" name="email" placeholder="example@domain.com">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-sm-2" for="msg">Mesage</label>
        <div class="col-sm-10">
            <textarea class="form-control col-sm-10" id="msg" name="msg" placeholder=""></textarea>
        </div>
    </div>
    <div class="form-group">
        <label id="captchaOperation" class="control-label col-sm-2" for="captcha"></label>
        <div class="col-sm-10">
            <input type="text" class="form-control" id="captcha" name="captcha" placeholder="Answer">
        </div>
    </div>
    <div class="form-group">
        <div class="col-sm-offset-2 col-sm-10">
            <input type="submit" class="btn btn-primary" value="Send">
            </button>
        </div>
    </div>
</form>

和bootstrap验证器代码示例

$(document).ready(function(){
    $('#contactForm').bootstrapValidator({
        icon: {
            valid: 'glyphicon glyphicon-ok',
            invalid: 'glyphicon glyphicon-remove',
            validating: 'glyphicon glyphicon-refresh'
        },
        excluded: [':disabled'],
        fields: {
            name: {
                validators: {
                    notEmpty: {
                        message: 'The Full Name field is required'
                    }
                }
            },
            email: {
                validators: {
                    notEmpty: {
                        message: 'The Email field is required'
                    }
                }
            },
            msg: {
                validators: {
                    notEmpty: {
                        message: 'The Message field is required'
                    }
                }
            },
            captcha: {
                validators: {
                    notEmpty: {
                        message: 'The Captcha field is required'
                    }
                }
            }
        }
    });
});

它将在验证后提交表单，验证后未提交的实际原因表格id="submit" name="submit"位于submit按钮内，其中类型也是type="submit"（Fiddle with name & id = submit）原因未知为什么bootstrapvalidator没有提交表单，可能是一个错误，可能是因为type="submit" id="submit" name="submit"的输入被混淆了所以要么删除id="submit" name="submit"（Fiddle without name & id = submit）或者更改为不同的{{1}像} type="submit"（Fiddle with name & id = sub）

Answer 2

id和name＆＃34;提交＆＃34;是其中一个问题，另一个是这个：

for (var i = sorted.length - 1; i >= 0; i--) {
            pickerData[i] = Ti.UI.createPickerRow({
                title : sorted[i],

        });
            Ti.API.info('From sorted ' + i + sorted[i]);
        }
$.picker.add(pickerData);
$.picker.addEventListener('change', function(e) {
            countRow = 0;
            data.length = 0;
            showfilterData(e.row.title, jsonResponse);
        });

我试图捕获验证器的返回状态，并阻止表单提交。 PS：我已经尝试了没有preventDefault（），但没有成功，所以我删除了所有这些代码，现在它可以正常工作。

表单提交被bootstrapValidator阻止

2 个答案: