Question

我想在成功提交表单后关闭表单模式，并在所有错误清除后显示另一个模态框

当提交表单并且表单上的html选择列表的值已更改时，将显示弹出条件js确认。用户必须单击js确认弹出窗口上的确定按钮才能继续进行表单提交。

否则，如果html选择列表没有更改，则js确认弹出窗口将不会显示，表单将提交。

这些是我的代码：

＆＃13;

 $('#infoForm').bootstrapValidator({
//        live: 'disabled',
        message: 'This value is not valid',
      
        fields: {
            sName: {
                validators: {
                    notEmpty: {
                        message: 'The name is required and cannot be empty'
                    },
					stringLength: {
                        min: 6,
                        max: 30,
                        message: 'The username must be more than 6 and less than 30 characters long'
                    },
                    regexp: {
                        regexp: /^[a-zA-Z0-9_\.]+$/,
                        message: 'The username can only consist of alphabetical, number, dot and underscore'
                    }
                }
            },
            sfName: {
                validators: {
                    notEmpty: {
                        message: 'The Father name is required and cannot be empty'
                    },
					stringLength: {
                        min: 6,
                        max: 30,
                        message: 'The Father name must be more than 6 and less than 30 characters long'
                    },
                    regexp: {
                        regexp: /^[a-zA-Z0-9_\.]+$/,
                        message: 'The Father name can only consist of alphabetical, number, dot and underscore'
                    }
                }
            }
          
        }
    });

＆＃13;

<!--First modal Box-->
<div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
 <div class="modal-dialog modal-sm">
      <div class="modal-content">

        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
          <h4 class="modal-title" id="mySmallModalLabel">Modal Box</h4>
        </div>
        <div class="modal-body">
		
     <form role="form" name="infoForm" id="infoForm" method="POST" action=""> 
    <div class="form-group">   	
    <input type="name" class="form-control" placeholder="Your Name" name="sName" id="sName" />
	</div>
    <div class="form-group">
    <input type="name" class="form-control" placeholder="Father Name" name="sfName" /></div>  
             <div class="form-group">
    <button type="submit"  name="Submit1" value="Submit"  class="btn btn-default" data-toggle="modal" data-target="#basicModal" >Submit</button></div>
    </form>

	</div>
	 <div class="modal-footer"></div>
	</div>
    </div>	
  </div><!--end First modal Box-->
      <!-- second modal box -->
    <div class="modal fade" id="basicModal" tabindex="-1" role="dialog" aria-labelledby="basicModal" aria-hidden="true">
      <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>
            <h4 class="modal-title" id="myModalLabel">second modal box</h4>
          </div>
          <div class="modal-body">
			<p>Your Information successfully submit</p>
          </div>
          <div class="modal-footer"> </div>
        </div>
      </div>
    </div>
   <!--  end second modal box-->

＆＃13;

Answer 1

使用模态框的Closing事件检查它是否成功并打开新模态

如何在成功提交后关闭模态框并在表单提交上有条件地打开第二模态

1 个答案: