Solved

Extract javascript block from ajax content and execute it

Posted on 2008-10-28
6
2,614 Views
Last Modified: 2012-05-05
HI,

I would like to extract a specific javascript block, which has an ID, from the content I received by making an ajax call and then execute that javascript block. Is it possible to do it using JQuery? Here's how I started out:
$(document).ready(function(){
           
   $.ajax({
            url: "Page2.aspx",
            type: "GET",
            success: function(content){
                    
                var scriptBlock = $(content).find('script#myscript');
                
                // Now execute the script block
            }
          });
});

Open in new window

0
Comment
Question by:wtor
  • 3
  • 2
6 Comments
 
LVL 9

Expert Comment

by:Shahzad Fateh Ali
ID: 22828857
What is in your response, a javascript code or html?
If it is only javascript then put your code in a function and then after ajax call you will be able to call that function.

see the example

/* response */
<script>
function fnOne(){
 alert("Function one called");
}
function fnTwo(){
 alert("Function two called");
}
</script>
/* end response */
 
/* after ajax call */
 
success: function(content){
                    
        eval(content);      // make the script executable
        fnTwo();            // call to the function
            
         // Now execute the script block
   }

Open in new window

0
 

Author Comment

by:wtor
ID: 22828916
Sorry I forgot to mention that my response was the entire HTML of Page.aspx.
0
 
LVL 9

Expert Comment

by:Shahzad Fateh Ali
ID: 22828931
Can you place your response html here?
0
Networking for the Cloud Era

Join Microsoft and Riverbed for a discussion and demonstration of enhancements to SteelConnect:
-One-click orchestration and cloud connectivity in Azure environments
-Tight integration of SD-WAN and WAN optimization capabilities
-Scalability and resiliency equal to a data center

 

Author Comment

by:wtor
ID: 22828945
Here's the HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Untitled Page</title>
</head>
<body>
    <form id="form1" action="Page.aspx">
 
        <script id="myscript" type="text/javascript">
            
            function demoClass()
            {
                var myval;
            }
            
            var obj = new demoClass();
            obj.myval = 10;
            
            alert( "This is a script in page 2. Value: " + obj.myval );
        </script>
 
    </form>
</body>
</html>

Open in new window

0
 
LVL 16

Accepted Solution

by:
sh0e earned 250 total points
ID: 22828964

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script>
$(document).ready(function(){
   $.ajax({
            url: "Page2.aspx",
            type: "GET",
            cache: false,
            dataType: 'xml',
            success: function(xml){
                    
                eval($('script#myscript',xml).text())
            }
          });
});
</script>

Open in new window

0
 

Author Comment

by:wtor
ID: 22829168
Thanks sh0e for pointing me to the right direction. I just had to change the dataType to html and it worked!
I dont like using eval. If you google, you'll know why. Here's the final code:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script>
$(document).ready(function(){
   $.ajax({
            url: "Page2.aspx",
            type: "GET",
            cache: false,
            dataType: 'html',
            success: function(html){
                    
            var myScript = new Function($('script#myscript',html).text());
 
myScript();
            }
          });
});
</script>

Open in new window

0

Featured Post

Announcing the Most Valuable Experts of 2016

MVEs are more concerned with the satisfaction of those they help than with the considerable points they can earn. They are the types of people you feel privileged to call colleagues. Join us in honoring this amazing group of Experts.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

837 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question