JQuery настроить FancyBox с помощью вызова AJAX - PullRequest
0 голосов
/ 03 октября 2011

Я использую это блестящее решение для отображения fancybox в результате запроса POST.

Проблема в том, что я не знаю, как настроить поведение fancybox.

Как показать вращающуюся анимацию (или аналогичную) во время выполнения Ajax?

Как установить заголовок / показать содержимое fancybox в виде (стилизованного) HTML?

1 Ответ

2 голосов
/ 03 октября 2011
function formatTitle(title, currentArray, currentIndex, currentOpts) {
    return '<div id="tip7-title"><span><a     
    href="javascript:;"onclick="$.fancybox.close();"><img src="/data/closelabel.gif" />      
    </a></span>' + (title && title.length ? '<b>' + title + '</b>' : '' ) + 'Image ' + 
    (currentIndex + 1) + ' of ' +  currentArray.length + '</div>';
} 


function showResponse(responseText){
  //first of all hide the spinning animation div
  //then process the response as you like
  $.fancybox({
            'content'               : responseText,
        'titlePosition'     : 'inside',
        'titleFormat'       : formatTitle
           });
  }

function showspinningAnimation(iddiv_container){
  //this function is called before the ajax call    
  //put your animation spinning or whatever in a div
}

var options = {       
    beforeSubmit:  showRequest,  // pre-submit callback 
    success:       showResponse 
}; 

$(document).ready(function() {
   $("#myForm").ajaxForm(options);        
});    

Объяснение:

formatTitle: эта функция форматирует заголовок для вашего fancybox showspinningAnimation: в эту функцию помещает вращающийся .gif (как пример) в div, показывающий загрузку ...

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...