Содержимое jQuery изменилось, не инициализируя функцию

Question

Я создаю сайт администратора с боковой панелью. Если щелкнуть боковую панель, она изменит основной контент с помощью ajax-запроса, и если успех будет выполнен $ ('# page-wrapper'). Html (content); Например, содержание имеет идентификатор «#content». Я не могу запустить функции на измененном содержимом, например $ (# content) .dataTable() ;. Пожалуйста помоги.

// Function to CALL Ajax 
rj.ajaxCall = function(options){ 
    // toSend url callbacks() callerror() 
    console.log('ajaxCall'); 
    $.ajax({ 
     type  : 'POST', 
     data  : options.toSend, 
     url   : options.url, 
     encode  : true, 
     replace  : true, 
     success  : function(data){options.callbacks(data);}, 
     error  : function(e){options.callerror(e);} 
    }); 
}; 

// function to change main content on click of side bar 
rj.sidebar = function(){ 
    console.log('sidebar'); 
    $(document).ready(function(){ 
     $('#side-menu li a').on('click',function(event){ 
      console.log('side bar clicked'); 
      event.preventDefault(); 
      var loc = $(this).attr('location'); 
      console.log(loc); 
      if(loc !== undefined && loc !== '#'){ 
       var request = { 
        toSend: {isCont:1}, 
        url:loc, 
        callbacks: function(d){rj.contChange(d,loc);}, 
        callerror: function(er){alert('Network Error. Please try again'); } 
       }; 
       rj.ajaxCall(request); 
      } 
     }); 
    }); 
}; 

//function to change the main content 
rj.contChange = function(cont,location){ 
    $('#page-wrapper').html(cont); 
    history.pushState({},{},location); 
}; 

// function to load DATA TABLE Js if content has id #dataTables-example 
rj.initDataTable = function(){ 
    console.log('LOAD DATA TABLE'); 
    $('#dataTables-example').DataTable({responsive: true}); 
}; 

// execute javascripts 
$(window).ready(function(){ 
    rj.initDataTable(); 
}); 

if ($('#wrapper').length > 0){ 

    rj.initDataTable(); 

    rj.sidebar(); 
} 

Answer 1

Вы не звоните rj.initDataTable после успеха ajax. попробуйте:

rj.contChange = function(cont,location){ 
    $('#page-wrapper').html(cont); 
    history.pushState({},{},location); 
    rj.initDataTable(); 
};