» » » All js won’t work after Pjax reloads

All js won’t work after Pjax reloads

Facebook
Google+
https://applerinquest.com/js-wont-work-pjax-reloads">
LinkedIn
Follow by Email
1 min read

Yii version 2.0.13.1

When you work with Pjax either Pjax jquery or Pjax module, you may face the same issue as me. I am working on Pjax widget in Yii2.0. The widget uses Pjax jquery.

 

Problem
Every time the Pjax reloads, all js that attached to DOM in Pjax container won’t work.

 

Cause

After Pjax finishes reloading, the js that sets to DOM in Pjax container will not pick up on these changes.

 

Solution
You must reinitialize the js to DOM after Pjax reloads.

 

Example

jQuery(document).ready(function ($) {
    function init(){
        initialize plugin1; 
        initialize plugin2;
    }
    init();
    
    $(document).on('ready pjax:end', function (event) {
        init();
    });
    
});

 

More detail

The instruction can be found in Pjax jquery link.

Facebook
Google+
https://applerinquest.com/js-wont-work-pjax-reloads">
LinkedIn
Follow by Email