Twitter Bootstrap Модальная дистанционная функция не работает должным образом

Question

Я использую twitter boostrap, и я хочу получить html с другой страницы и загрузить его в модальную версию моей текущей страницы. поэтому я создал функцию javascript для обработки этого для меня.

В моей «index.php» у меня есть это:

<button onclick="popIt('create_event.php', 'Create Event');" data-toggle="tooltip" data-placement="top" data-original-title="Edit" class="btn ttp"><i class="icon-pencil"></i></button> 
<button onclick="popIt('tester.php', 'Test Head');" data-toggle="tooltip" data-placement="top" data-original-title="Delete" class="btn btn-danger ttp"><i class="icon-remove icon-white"></i></button> 

Javascript функция следующим образом:

<script> 

function popIt(url, header) { 

     $('#myModal').modal({ 
      remote: url 
     }); 
     $('#myModalLabel').html(header); 
    } 

Это загружает соответствующую страницу при нажатии на кнопку, но, когда я закройте модальную и нажмите другую кнопку, которая все еще загружает предыдущую страницу.

Пожалуйста, что я делаю неправильно? Thanks

Answer 1

попробуйте $('#myModal').empty() в первой строке вашего popIt функции. это может быть причиной задержки в получении ответа от сервера

, если вы не можете попробовать сплавления запрос GET и модальный например,

$.get(url,function(data){ 
    $('#myModal').html(data) 
} 

Answer 2

уничтожить объект после того, как он закончит скрываться

$('body').on('hidden', '.modal', function() { 
    $(this).removeData('modal'); 
}); 

Answer 3

У меня было много проблем с модальным виджетами Bootstrap. 2 основными проблемами являются кэширование в IE и модальная функция, не дожидающаяся завершения вызова ajax до запуска событий при использовании удаленного свойства. Я исправил эти проблемы, создав оболочку для создания модального диалога. Чтобы исправить проблему кэширования, выполните $ .get и добавьте параметр временной метки в URL-адрес и установите ответ как свойство содержимого перед инициализацией модального виджета. См. Код ниже. Надеюсь это поможет!

var $queue = $({}); 
if (settings.remote) { 
    $queue.queue('modal_open', function(next) { 
    $.when($.get(settings.remote + '&timestamp=' + new Date().getTime())).done(function(content) { 
     settings.content = content; 
     settings.remote = undefined; 
     next(); 
    }); 
    }); 
} 

$queue.queue('modal_open', function(next) { 
    ... 
    $modal.modal(settings); 
    next(); 
} 

$queue.dequeue('modal_open'); 
return $modal;