AJAX to load Javascript?

MadTechie · March 24, 2007

any help would help

I have a form that starts with 1 drop down box, after the user selects a value from the first drop down ajax loads up the next drop down box etc etc

now the question

i have a javascript function that builds the url for

http_request.open('POST', url, true);

see below

   function get(obj) {
      var poststr = 'Data1=' + encodeURI( document.getElementById('Data1').value );
      makePOSTRequest('test2.php', poststr);
   }

this seams to work fine except i have to add a few functions to the page (each including the var's i wish to send) i wanted to use ajax to return the form objects and the javascript to use with it, but it fails.

OK i have probably confused everyone (including myself) so a simple question, can ajax return a javascript function that can then be used ?

MadTechie · March 25, 2007

a kinda bump

can ajax return a javascript function that can then be used ?

mainewoods · March 25, 2007

Check the posts here and it should tell you all you need:

http://www.phpfreaks.com/forums/index.php/topic,131773.0.html

MadTechie · March 25, 2007

Ohh my...

That looks great (hard for me, but great)

right i am not using document.write (don't plan to but you never know)

but i am outputting html+javascript

now i'm not great at javascript (or ajax) so if i am reading the post correctly

and i got a little lost at 4

4) If the javascript code uses document.write then you must redirect the output of that to your own function before the last step because of the context in which the the eval() is executed. If you do not, then you will get weird results like the output of the document.write overwriting the entire page.

i hate to ask but i don't surpose you have an example i can up apart ? :-\

mainewoods · March 25, 2007

On the 6th post of the topic I listed above, there are these statements in the code:

var savewrite = document.write;
document.write = mywrite; // mywrite is a function defined below

In those statements I have redirected the output of the document.write to my custom function:

var writtenstring = ''; // initialize
function mywrite(writevalue) {
    writtenstring += writevalue; //add to end of string 
}

That custom function will recieve as it's parameter that which is actually specified as the parameter of the document.write(). The function builds the global var up by concatentation each time it is called.

In case the document.write is needed later in the page, I restore it to it's original vector:

document.write = savewrite;

To show the weird results, try this:

<html><head><title>Document.write TEST</title></head>
<body>
<span style="color:red;font-size:150%;">Test document.write</span><br><a href="#" onclick="eval('document.write(\'The entire page is replaced with this text!\');');">Try this test</a>
</body>
</html>

On ie that code will cause the text in the document.write to replace the entire web page and stay with that. On ff that code will cause the same as ie but then it will switch back to the original page with a hash mark on the end of the url. The reason for this problem is that the document.write is being used in an invalid place, it is inside a link so there no valid context to output it to. Any time you have a script returned by ajax with a document.write in it you would have the same problem.

MadTechie · March 26, 2007

OK well have played with it a little but have a few problems (main due to being usless at javascript)

for some reason the scripts are not working

i added a alert box for debugging it returns

Script Found;

    alert("Script Found" + curscript[1]);
eval(curscript[1]);

	echo "<script>alert('test');</script>"; //<-- returns "Script Found;"
/*echo "alert('test');";*/ //<--- returns nothing

Any ideas?

mainewoods · March 26, 2007

what is the value of curscript[1]?

alert(curscript[1]);

curscript[1] should contain javascript statements only, no actual script tag:

eval("alert('hello world')"); // works
eval("<script>alert('hello world')</script>"); //will not work!

MadTechie · March 26, 2007

OK here the javascript code

    alert("Script Found = {" + curscript[1] + "}");
eval(curscript[1]);

and the php returning

echo "alert('hello world');";

alert box doesn't display (nothing happend)

So..

php changed to:

echo "<script>alert('hello world');</script>";

alert box displays

Script Found = {;}

so i know i have messed up badly

heres a snip of code

            result = http_request.responseText;

scriptregexp = /(?:<script.*?>)(?\n|\r|.)*?)(?:<\/script>)/im;
ajaxreturnvalue = result;

var curscript = ajaxreturnvalue.match(scriptregexp);

if (curscript)
{ // script tag found!
    // the 2 statements below are necessary if the code uses
    // document.write - I redirect to a function which will write it to a var
    var savewrite = document.write;
    document.write = mywrite; // mywrite is a function defined below
    writtenstring = ''; // reset document.write var

    // the curscript[1] var below is only the part between the script tags
    // not including the script tags, do not use the actual script tags in eval()
    alert("Script Found = {" + curscript[1] + "}");
eval(curscript[1]);

I'll like so also add

i really do appreciate all your help mainewoods, (sorry i am a javatwat)

MadTechie · March 27, 2007

splitting the script from the text seams to be the problem but i have no idea how to do that as the below doesn't seam to work for me

scriptregexp = /(?:<script.*?>)(?\n|\r|.)*?)(?:<\/script>)/im;
var curscript = ajaxreturnvalue.match(scriptregexp);

mainewoods · March 27, 2007

The regular expression I gave you is slightly incorrect. Use this one:

scriptregexp = /(?:<script.*?>)((\n|\r|.)*?)(?:<\/script>)/i;
var curscript = ajaxreturnvalue.match(scriptregexp);
if (curscript) {
    alert(curscript[1]); //should show your js code minus the script /script tags
    eval(curscript[1]); //execute the code!
}

MadTechie · March 27, 2007

Well i have played with it a little and returned

echo "alert('hello world');";

and it failed but.....

<script>alert('hello world');</script>

WORKED

Thank you soooo very much.

[move]Thank You, for all your time i own you big time, just don't ask for help with javascript, heehee Thank you again[/move]

Erm.. Solved button has gone..!

MadTechie · March 27, 2007

Erm... ???

is it possible for return a function for use with a form item ?

ie

AJAX returns

a text box with a javascript attached to the onchange.

but the javascript in question also of been returned via ajax??

what i have working now is great but if i could do the above then..

mainewoods · March 28, 2007

http://ajaxpatterns.org/On-Demand_Javascript

MadTechie · March 28, 2007

ooow, research time, thanx for all your time mainewoods, i knew i was pushing it a little with, my questions but you have been a great help, thank you

Still looking for the Solved button!!

mainewoods · March 28, 2007

Good luck MadTechie

Sign In

AJAX to load Javascript?

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation

Important Information