0

I am trying to load the content of specific element from the page loaded with $.ajax that also contains some javascript functions (like form validations, etc.) that I would like to execute, here is a quick sample:

$.ajax({

                    url : 'sample.html',                    
                    success : function(data) {
                       $('body').append($(data).filter('#data')); //does load the content of an element but javascript wont work.
                       //$('body').append(data); this works but I dont need an entire page


                    }
                    });

sample.html content:

<!DOCTYPE html>
<html>
<head></head>
<body>

trash trash trash

<div id="data">
<script>console.log('javascript works even from ajax called content');</script>
some more sample data to load
</div>

trash trash trash

</body>
</html>

Maybe in your opinion I should not use any javascript inside ajax loaded content... but then I am not sure how to access it.

devjs11
  • 1,898
  • 7
  • 43
  • 73
  • This question has been asked a number of times in different ways. The bottom line is you need to add the script blocks separately from the HTML (or extract it from the HTML and then add it back separately with append or appendTo). See this question for more information: http://stackoverflow.com/questions/16352371/jquery-load-ajax-not-executing-javascript-in-returned-html-after-appende – Pete Oct 09 '13 at 21:25
  • Well, using $.ajax instead of $.get still wont work in my case... – devjs11 Oct 09 '13 at 22:17
  • It has nothing to do with whether you use $.ajax or $.get It has to do with creating a script element and appending it to the DOM as opposed to appending HTML with script tags in it. – Pete Oct 10 '13 at 12:43

0 Answers0