如何在表单提交上关闭Modal Popup?

时间:2015-09-22 12:04:21

标签: javascript jquery forms twitter-bootstrap-3

我有一个模态弹出窗口来更改密码,我需要在提交按钮上关闭它。

<div class="modal-body"> 
    <?php if(isset($message))echo '<span class="text-success txt-upper" style="margin-left:2rem;">'. $message .'</span>';?>

    <?php echo form_open('',array('class'=>'ajaxForm')); ?>
      <fieldset class="table "> 
        <div class="form-group">
        <?php $class = form_error('newpassword')?"input-error":"" ?>
          <div  class="col-md-12" style="margin: 10px 0"><?php echo form_password('newpassword','','class="form-control margin-both-0 '. $class.'" id="newpassword"  placeholder="New Password" autocomplete="off"'); ?><?php echo form_error('newpassword'); ?></div>            
        </div>
        <div class="form-group">
        <?php $class = form_error('conpassword')?"input-error":"" ?>
          <div class="col-md-12 " style="margin: 10px 0"><?php echo form_password('conpassword','','class="form-control  margin-both-0 '. $class.'" id="conpassword"  placeholder="Confirm Password" autocomplete="off"'); ?><?php echo form_error('conpassword'); ?></div>           
        </div>  

</div>
<div class="modal-footer">
        <?php echo form_submit('submit_btn', 'Change Password', 'class="submit btn btn-success margin-left-4p pad-1-rem margin-bottom-10"'); ?>
     </fieldset>
    <?php echo form_close();?>  
  </div>

上面的代码是表单提交按钮。

$(function() {
        $(".submit").click(function(e){
            var sdata = $('.ajaxForm').serialize();
            $.ajax({
                type: "POST",
                data:sdata,
                url: "<?php echo site_url('home/change_password'); ?>",
                success: function(data){
                    $('#baseModal-xs .modal-content').html(data);  
                }
            });
            return false;
        });
    });

<script type="text/javascript">
    $(".submit").ajaxForm(function() { 
        window.close();
    });

这是我添加了windows.close函数的javascript工作

2 个答案:

答案 0 :(得分:6)

从您的代码中看起来您正在使用twitter-bootstrap-3。然后,我会坚持他们在此处建议的API:Bootstrap JavaScript Modals  并调用模态方法来关闭/隐藏可见模态:

$('.modal').modal('hide');

答案 1 :(得分:0)

只需拨打以下代码

即可
$.modal.close();