使用 Parsley 和 Modal 窗口进行验证

Question

我有一个问题，无法解决。我有一个按钮，当您单击它时会向用户显示一条确认消息，碰巧在打开此模式之前，我想验证所有字段是否已填写。

为了验证，我正在使用 lib Parsley

如果我只使用下面的简单按钮验证成功。

<button class="btn btn-primary" type="submit">Submit</button>

但是如果使用之前调用modal的按钮就不能使用validator了。

<button data-toggle="modal" data-target="#md-default" type="button" id="postar" class="btn btn-info btn-lg"><i class="fa fa-check"></i> <b>Enviar</b></button>


 <!-- Modal -->
                          <div class="modal fade" id="md-default" tabindex="-1" role="dialog">
                             <div class="modal-dialog">
                                <div class="modal-content">
                                   <div class="modal-header">
                                      <button type="button " class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                                   </div>
                                   <div class="modal-body">
                                      <div class="text-center">
                                         <div class="i-circle primary"><i class="fa fa-check"></i></div>
                                         <div class="confirmacao" id="confirmacao">
                                            <h4>Confirma o envio do Push?</h4>
                                         </div>
                                         <div class="resp"></div>
                                         <p></p>
                                      </div>
                                   </div>
                                   <div class="modal-footer">
                                      <button type="button" class="btn btn-default btn-flat" data-dismiss="modal" id="cancelButton" >Cancelar</button>
                                      <button type="submit" class="btn btn-primary btn-flat enviar" id="submitButton" >Sim</button>
                                      <button type="button" style="display: none" class="btn btn-default btn-flat" data-dismiss="modal" id = "closeButton">Fechar</button>
                                   </div>
                                </div>
                                <!-- /.modal-content -->
                             </div>
                             <!-- /.modal-dialog -->
                          </div>


<!-- /.modal -->

Answer 1

您可以像下面这样手动打开模态：

.on('form:submit', function() {
    $('#md-default').modal('show');
    return false;
});

Codepen link