0

I'm using some css files and js libraries (bootstrap, packry, etc.) in my master page. There's a button on page that when you click on it, it sends an ajax request and prints the response on a div in current page:

jQuery.post("index.php", "some_post_data", function (data)
{
 jQuery('#mydiv').html(data);
});

The page I'm calling needs those libraries I've already included on my master page, but when I print the response inside the div, it still shows js errors and style-less objects. If I add those resources to the second page, it will work but I don't want to do this.

Do I have to do some kind of refreshing thing on the newly printed html codes, or something like that? What am I doing wrong in here?

2
  • need more info, please show what's returned by the ajax request Commented Oct 28, 2014 at 12:23
  • Is you AJAX posting to your main index.php page? As I think this will return the HTML of the main page. Seeing your index.php file will be helpful Commented Oct 28, 2014 at 13:00

1 Answer 1

0

When you add html content to a page dynamically like you are doing. Any script files loaded in the header section (or anywhere else for that matter) will not be loaded and registered in your dom. I presume the same will apply to any style sheets you include on the dynamic page.

To add any script files or stylesheets you need to register them separately into the head section of your document.

You could load the js/css files into your head like so:

 var jsLink = $("<script type='text/javascript' src='"+src+"'>");
     $("head").append(jsLink); 

or check out this link: Ways to add javascript files dynamically in a page

Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.