Modal在提交後沒有關閉，location.replace仍然處於模態？

Question

我在嘗試關閉表單提交後的模式時遇到困難，無論如何，我正在使用https://github.com/Serhioromano/bootstrap-calendar我已經使用了location.replace，但它仍然以模式打開，無論如何這是我在app.js上的代碼：

(function($) { 

"use strict"; 

var options = { 
    events_source: 'events.json.php', 
    view: 'month', 
    tmpl_path: 'tmpls/', 
    tmpl_cache: false, 
    modal: '#events-modal', 
    onAfterEventsLoad: function(events) { 
     if(!events) { 
      return; 
     } 
     var list = $('#eventlist'); 
     list.html(''); 

     $.each(events, function(key, val) { 
      $(document.createElement('li')) 
       .html('<a href="' + val.url + '">' + val.title + '</a>') 
       .appendTo(list); 
     }); 
    }, 
    onAfterViewLoad: function(view) { 
     $('.page-header h3').text(this.getTitle()); 
     $('.btn-group button').removeClass('active'); 
     $('button[data-calendar-view="' + view + '"]').addClass('active'); 
    }, 
    classes: { 
     months: { 
      general: 'label' 
     } 
    } 
}; 

var calendar = $('#calendar').calendar(options); 

$('.btn-group button[data-calendar-nav]').each(function() { 
    var $this = $(this); 
    $this.click(function() { 
     calendar.navigate($this.data('calendar-nav')); 
    }); 
}); 

$('.btn-group button[data-calendar-view]').each(function() { 
    var $this = $(this); 
    $this.click(function() { 
     calendar.view($this.data('calendar-view')); 
    }); 
}); 

$('#first_day').change(function(){ 
    var value = $(this).val(); 
    value = value.length ? parseInt(value) : null; 
    calendar.setOptions({first_day: value}); 
    calendar.view(); 
}); 

$('#language').change(function(){ 
    calendar.setLanguage($(this).val()); 
    calendar.view(); 
}); 

$('#events-in-modal').change(function(){ 
    var val = $(this).is(':checked') ? $(this).val() : null; 
    calendar.setOptions({modal: val}); 
}); 
$('#format-12-hours').change(function(){ 
    var val = $(this).is(':checked') ? true : false; 
    calendar.setOptions({format12: val}); 
    calendar.view(); 
}); 
$('#show_wbn').change(function(){ 
    var val = $(this).is(':checked') ? true : false; 
    calendar.setOptions({display_week_numbers: val}); 
    calendar.view(); 
}); 
$('#show_wb').change(function(){ 
    var val = $(this).is(':checked') ? true : false; 
    calendar.setOptions({weekbox: val}); 
    calendar.view(); 
}); 
$('#events-modal .modal-header, #events-modal .modal- footer').click(function(e){ 
    //e.preventDefault(); 
    //e.stopPropagation(); 
}); 
}(jQuery)); 

在我events.json.php

是從哪裏獲得的所有數據，並傳遞給模態：

<?php include('connect.php'); ?> 
{ 
"success": 1, 
"result": [ 
     <?php 
     $event_query = mysql_query("SELECT * FROM appointment,user,service where user.user_id = appointment.user_id and service.service_id = appointment.service_id and appointment.appointment_id != (SELECT MAX(appointment.appointment_id) FROM appointment) and appointment.appoint_status='Pending'")or die(mysql_error()); 
      while($event_row = mysql_fetch_array($event_query)){ 
      $date = $event_row['appoint_date']; 
      $date2 = $event_row['end']; 
      $appid = $event_row['appointment_id']; 
      ?> 
    { 
     "id": "<?php echo $appid; ?>", 
     "title": "<?php echo $event_row['firstname'].' '.$event_row['lastname']; ?>", 
     "url": "approve_appointment_modal.php?id=<?php echo $appid; ?>", 
     "class": "event-success", 
     "start": "<?php echo $date; ?>", 
     "end": "<?php echo $date2; ?>" 
    }, 
    <?php }; ?> 

和模態：

<div class="modal fade" id="events-modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" 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> 
       <h3 class="modal-title">Approve Appointment</h3> 
      </div> 

      <div class="modal-body" style="height: 400px"> 

      </div> 
      <div class="modal-footer"> 
      <a href="pending_appointments.php" class="btn btn-primary pull-left"><i class="fa fa-eye"> </i> View All Transactions</a> 
       <button type="button" class="btn btn-default" data- dismiss="modal">Close</button> 
      </div> 

     </div> 
    </div> 
</div> 

已經試過這個，但沒有運氣：

 echo "<script> alert('Success') </script>"; 
    echo " <script>location.replace('approved_appointments.php')</script>"; 

} 
?> 
    <script> 
     $(modal).on("click", 'input[type="submit"]', (z) -> 
         modal.modal('hide') 
    </script> 

Answer 1

我在這裏看到的一些東西。

1 - 你在你的HTML錯誤，你可能要改變data- dismiss="modal"到data-dismiss="modal"（data-和dismiss之間沒有空間

2 - 還你試圖抓住click事件上input[type="submit"]，你沒有任何屈服了，你有type="button"

一個可能的解決方案是提交按鈕，單擊窗體，並辦理形式分別提交。

請參閱引導modal docs和這answer，他們可能會有所幫助。

祝你好運。