Using ajax to process slickquiz shortcodes

  • Resolved mirgcire

    (@mirgcire)


    10 years, 1 month ago

    Because I am trying to cram 30 quizzes on a page, I expect that my page will start to load slowly. I haven’t actually written 30 quizzes yet so I am not certain it will be a problem, but I like to be proactive.

    My plan is to use ajax to process the shortcode and generate the HTML. I have coded the ajax and it is working fine, but I am running into the same problem that I did with this previous issue. Ie, I am getting the HTML shell, but not the quiz. For the previous issue I had to install a hidden quiz so that the jscript would preload into the page. But that did not work in this case. I have a feeling the problem has something to do with ajax processing that is different from generic page processing.

    Do you have any ideas/suggestions?

    Come to think of it, with regards to the previous issue, I don’t understand why having jscript loaded on the page makes any difference when the sever is executing PHP to build the page. Is there some sort of jscript/PHP interaction that happens when the HTML is being assembled?

    https://www.ads-software.com/plugins/slickquiz/

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Author jewlofthelotus

    (@jewlofthelotus)

    @mirgcire – I’d bet the issue is that the quiz is not getting initialized after it’s loaded into the page.

    I responded briefly to your post over here about the initialization method and how it works. You’ll need to figure out a way to execute that code after the AJAX request returns the content.

    Thread Starter mirgcire

    (@mirgcire)

    @jewlofthelotus – After inspecting the code a little more closely, it seems obvious why the quiz is not being loaded. The shortcode calls “show_slickquiz_handler()”, but that does not load the quiz. The quiz is loaded by “load_quiz_script()”, which is called from the “wp_footer” filter.

    Can you confirm this observation?

    If so, I am thinking, my ajax handler can just call apply_filters(), in addition to do_shortcode(), and return the concatenated results.

    Sound reasonable?
    Thanks!

    Thread Starter mirgcire

    (@mirgcire)

    Oh, this is more complicated than I realized. The output of the filter is a jQuery script. I am not sure if it is even possible use ajax to load javascript. –groan: it hurts my head just to think about it.

    Plugin Author jewlofthelotus

    (@jewlofthelotus)

    @mirgcire If you’re making AJAX requests then it is likely that jQuery is already loaded on the page. You just need to find a way to call the $().slickQuiz({}) initialization method and load the quiz when your AJAX request completes.

    Thread Starter mirgcire

    (@mirgcire)

    I finally managed to get it to work.

    On the server it took two steps:

    • $output =　do_shortcode(‘[slickquiz id=”‘.$id.'”]’);
    • echo ‘<div>’.$output.'</div>’;
    • apply_filters(‘wp_footer’); // output automatically echoed

      • On the client side

    1. Pull the shortcode html out of div tags.
    2. Pull the jquery script from the wp_footer output and wrap the script in a hidden div

    Once the client side code completes, the quiz is ready to be taken.

    To be honest, I not sure if I understand you suggestion. Is there an alternative t my method of structuring the ajax that could produce the same result?

    BTW, I found this link on StackExchange, which explained how to get the incoming javascript to exectute. I think this is what you mean by “find a way to call the $().slickQuiz({}) initialization method”.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Using ajax to process slickquiz shortcodes’ is closed to new replies.