Using the library FullAjax can face the fact that other scripts (eg LightBox) refuse to work or its not working correctly. The reason these scripts from which refuse to work is very simple – they are not quite designed to works with AJAX.

How can fix it I try describe in a few lines below …

The main reason (but not only) in which some scripts refuse to work together with AJAX – is that they do not “see” when AJAX page loaded and ready for use. To fix this need to tell them yourself when the page is “ready”.

For this, after when the AJAX page loading finished need tell for scripts that page updated.
For this can use “load” event from FullAJAX (example for mootools fireEvent()):

FLAX.Html.onall('load', function(options){
	window.fireEvent('domready');
});

or use callback function:

function doSomethingAfterFAjxPagLoad (){
	window.fireEvent('domready');
};

To this function is triggered after when the AJAX page loading finished, in the basic configuration the FullAjax library need add option onload:doSomethingAfterFAjxPagLoad .
Example:

FLAX.Filter.add({url:'/', id:fullAjaxId,  onload:doSomethingAfterFAjxPagLoad}); 
.... 
function doSomethingAfterFAjxPagLoad (){
/* fix for mootools 'domready', uncomment if need*/
/*	window.fireEvent('domready'); */
};

When using window.fireEvent(‘domready’); you should be careful.
Firstly it helps only if the script really does not “see” when the page is “ready”.
Second, by joint use with other scripts that work with AJAX good – it can lead to additional undesirable errors such as double execution of the script. Therefore this function in the plugin by default commented out.

In some cases, you should use window.fireEvent(‘load’); – it all depends on the script that “refuses” to work.

If script (eg LightBox) need only on a certain page then the function from above to better execute on only this page, not on each page. This will prevent any additional errors.
Example for the page “Gallery” ( mysite.com/galery ):

1
2
3
if(location.toString().indexOf('/galery') != -1){
	window.fireEvent('domready'); 
}

To be continued, maybe … :)

91 Comments to “ Problems using LightBox and some other scripts ”

  1. Aleksej says:

    I have problems with fullajax working with joomgallery, I fix this in that way:

    com_joomgallery\views\category\tmpl\default_images.php

    add onClick event

    ...
    <img onClick="fireDieSRAX()" src="thumb_src; ?>" class="jg_photo" imgwh; ?> alt="imgtitle; ?>" />
    ....

    plugins\system\addfullajax\js\fullajax.js

    add new parameter and switch it with function onClick that you added.


    var SRAX_mode = true;

    function fireDieSRAX(){
    SRAX_mode = false;
    }

    ...........
    //find that part of cpde

    if (!o.sharp){
    try{
    if (o.handler){

    o.handler(this, o);
    } else {
    if (SRAX_mode){
    //check your flag state
    var url = this.getAttribute('action') || this.href;
    if (!url) url = location.href;
    //IE not understand not latin chars :)
    url = ($.browser.msie) ? encodeURI(url) : url;
    if (this.nodeName == 'FORM' && (!o.method || o.method.toLowerCase() != 'post')){
    var uri = $.parseUri(url);
    url = url.replace('?' + uri.query, '').replace('#' + uri.anchor, '');
    }
    url = $.delHost(url);
    var changer = o.changer || o.urlChanger;
    url = changer ? changer(url, this) : url;

    var ind = url.indexOf('#');
    if (ind > -1) url = url.substring(0,ind);

    window[o.type == 'data' ? 'dax' : 'hax'](url, o);
    }else{

    SRAX_mode = true; //switch flag to default state
    return true; //if onClick lightbox image then return true
    }
    }
    } catch (ex){
    error(ex);
    }
    }

    To repair joomgallery pagination swap with javascript link url char ‘#’ to ‘&’

    • Fedik says:

      and it works?
      looks to difficult :)
      but thanks for info

      • Aleksej says:

        For me it works.

        – ” looks to difficult :) ”

        in plugins\system\addfullajax\js\ directory placed two four files (…, fullajax.js, fullajax_uncompressed.js ,….)

        Use ‘fullajax_uncompressed.js’ for test, but only enable it addfullajax.php file.

    • Aleksej says:

      Simple way, – update lightbox image url in joomgalery file, example:

      .....
      <a href="/joomla/gallery/gcat1.php?id=125&amp;#ignore" rel="nofollow"></a>
      ....

      (#) character in url perform to ignore this link.

      This two methods dont fix all bags.

  2. Dan says:

    Hi Fedik,

    window.fireEvent(‘load’);

    did it! Awesome – many, many thanks!
    You rock! I am so grateful for your fast help.
    Keep it up!

    Thanks,
    Dan

  3. Мария says:

    Добрый день) спасибо за чудесный плагин) все прекрасно работает, но есть вопрос: как настроить обновление суффикса страницы (того, который задается в настройках пунктов меню)?

    • Fedik says:

      простите не очень понял вопрос …
      там, вроде, ничего настраивать не нужно :)

  4. Nikita says:

    Доброй ночи, спасибо за плагин все работает. Я использую его для joomla 1.5 + virtuemart очень ускоряет загрузку. Но есть одна проблема которую я решить так и не смог. При добавлении в корзину возникает проблема. Модуль корзины не обновляется,(количество товаров) вписывал его как в инструкции про breadcrumbs. Обновление происходит при перезагрузке страницы. Така я же история в самой корзине уже в облости componentбез перезагрузки страницы она не пересчитывает количество товаров и не может их удалять. Я добавил страничку корзина в меню и добавил id в список игнорировагия ajax. Но почему то никаких изменений я не вижу.

    • Fedik says:

      там похоже какой то дополнительный скрипт который обновляет корзину через AJAX…
      сейчас, к сожалению, у меня нет решения

  5. Psycho says:

    Hi
    I would like the FullAJAX to change only the categories (using menu), but I have to open articles in lightbox. Can I modify FullAJAX to change only categories, but open articles without ajax ?
    When I add

    <a href="item id=8 code" rel="nofollow">

    it loads the item using ajax AND modal lightbox. I neet it to load ONLY modal.

  6. Psycho says:

    argh, sorry again. hope this works now.

    <a href="index.php?tmpl=component&amp;option=com_k2&amp;view=item&amp;id=8" rel="nofollow">ITEM1</a>

    it opens lightbox AND article with ajax.

    • Psycho says:

      update:

      the #ignore and fireEvent(‘domready’) did the trick ! it works almost perfect now !

      now the only complain is: when I click an article with class=”modal” it gets opened OK. But when I change category with ajax, and go back to the category and CLICK IT AGAIN it gets loaded twice in the lightbox, and when I close it, change category, go back again to the first category and click it again – it gets loaded FOUR TIMES one below another. Do you happen to know why?

      Sorry for the spam !

    • Fedik says:

      try add ax:wrap="0":

      < a href="/some-link" ax:wrap="0" >Some text</ a >
      • Psycho says:

        Thanks but doesn’t do anything :( looks like it works like #ignore but the problem is still present.

      • Psycho says:

        I have changed the joomla modal to fancybox 2.1.3 modal script and implemented it with class=”various” + ax:wrap=”0″ method to launch links from category_item.php and it works now ! No more problems !! Thank you hey !

  7. panca says:

    HOw to disable ajax for single article??
    i have one article that use slider or tabber not working with addfullajax. plese help me..??

  8. Alexey says:

    Привет, благодарю за отличный компонент!

    Я столкнулся с такой проблемой – решил поставить себе стилизованный скроллбар “JScrollPane2″, но, как говорилось здесь ранее, после перезагрузки позиции данный скрипт требует повторной инициализации. Вкратце принцип его работы: это обычный виджет, который в див с определленным классом вставляет свою надстройку.

    Разобравшись с логикой его работы я пришел к выводу, что его проще всего сначала “убрать” при помощи его же встроенной функции destroy(), а потом опять запустить, когда позиция уже будет подгружена аяксом.

    Так вот, как его запустить тут вопросов нет просто добавляю соответствующую команду в админке компонента или в самом скрипте, а вот, как “удалить” виджет перед началом загрузки аякс – это вопрос (удалять нужно именно до загрузки новой страницы, вешать событие на меню – это не красивое решение, пунктов слишком много, да и айди выборочно каждому меню итем не присвоишь).

    Пробовал реализовать через $.ajax():
    $(document).ajaxSend(function() {
    alert(‘Событие поймано’);
    //Функция виджета
    $(‘.scroll-pane’).data(‘jsp’).destroy();
    });

    Но событие не ловится, и не выполняется даже алерт… Пробовал и с .ajaxStart() – аналогично.

    Теперь вопрос :): Как повесить функцию на это или схожее событие?

    • Fedik says:

      спробуй наступні події:

      FLAX.Html.onall('unload', function(o){
        //перед зміною
        //before changes
      });
       
      FLAX.Html.onall('load', function(o){ 
        //після зміни контенту
        //after changes
      });
      • Alexey says:

        не помогло, анлоад не “очищает” контент див… думаю нужно перехватывать событие запуска аякс запроса через саму саму библиотеку fullajax – буду капать в этом направлении.

      • Alexey says:

        Извини, что-то я очень сильно протупил, твое решение идеально подходит!

        для того, чтобы подружить AddFullAjax с JScrollPane надо в настройках advanced написать такой код:

        FLAX.Html.onall('unload', function(o){
          $('.scroll-pane').data('jsp').destroy();
        });
         
        FLAX.Html.onall('load', function(o){
         $('.scroll-pane').jScrollPane();
        });

        После этого все будет ок.

        п.с. Пишу специально еще и на английском, чтобы этот плагин имел более широкое распространение. Думаю разумно было бы сделать форум или топик, в котором бы постепенно накапливались такие решения для разных компонентов.
        _____________________________________
        Thank you very much, your proposition is absolutely useful! All what you have to do is just type the following code in in the first code-textbox:

        FLAX.Html.onall('unload', function(o){
          $('.scroll-pane').data('jsp').destroy();
        });
         
        FLAX.Html.onall('load', function(o){
         $('.scroll-pane').jScrollPane();
        });

        After that your JScrollBar will work correctly and you can fully enjoy this awesome Joomla plugin!
        _______________________________
        По поводу Community Builder, подскажешь как сделать повторную иницаилизацию? Для этого нужно искать, какую-то его собственную функцию?
        Проблема, как упоминалось ранее именно в отображении табов.

      • Fedik says:

        на рахунок Community Builder, то так, там потрібно шукати

Leave a Reply to Nikita Cancel reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>