unable to evaluate javascript in Ajax.Request response

[jonathon]

Hello,

I'm having difficulty getting something to work. Perhaps someone will
know the solution?

The function:

new Ajax.Request('test.php', {
evalScripts: true,
onSuccess: function(transport) {
$('canvas').innerHTML = transport.responseText;
},
onFailure: function() {
err = '<h1>Unable to connect to server, operation cancelled</h1>';
$('canvas').innerHTML = err + $('canvas').innerHTML;
showWait(false);
}
}

I read in the api that you need to set the contentType to 'text/
javascript', so I did that in my php:

<? header("Content-type: text/javascript"); ?>
<script type='text/javascript'>alert('hi');</script>

I am never alerted though... Any ideas? Thanks!!!

[Alex Mcauley]

Hi Jonathon ..

You are giving the request the wrong parameter ...

You dont need to set a header of text/javascript either

evalJS : true,

making your script

new Ajax.Request('test.php', {
evalJS: true, // <----- notice evalJS not evalScripts

onSuccess: function(transport) {
$('canvas').innerHTML = transport.responseText;
},
onFailure: function() {
err = '<h1>Unable to connect to server, operation cancelled</h1>';
$('canvas').innerHTML = err + $('canvas').innerHTML;
showWait(false);
}
}

Enjoy

/Alex

----- Original Message -----

[T.J. Crowder]

Hi Jonathan,

> new Ajax.Request('test.php', {
> evalScripts: true,

Ajax.Request doesn't have an evalScripts option[1][2], that's an
option to Ajax.Updater[3].

> I read in the api that you need to set the contentType to 'text/

> javascript'...

Only if you're sending back JavaScript. If you're sending back HTML
with embedded script tags, you want text/html (which is probably the
PHP default). I suspect you were looking at the evalJS option[1], but
that's if what you're sending back is just script.

Looking at your Ajax.Request, you can use Ajax.Updater instead.
Here's a rough translation of your code:

function doSomeRequest() {
var err;

err = $('canvas').innerHTML;
new Ajax.Updater('canvas', 'test.php', {
evalScripts: true,

onFailure: function() {
err = '<h1>Unable to connect to server, operation

cancelled</h1>' + err;
Element.update.defer('canvas', err);
},
onComplete: function() {
showWait(false);
}
});
}

A couple of notes on that:

1. I've removed the onSuccess handler, because Ajax.Updater does what
we wanted to do on success.

2. I've moved the showWait(false) to the onComplete handler, because
that's fired regardless of the outcome and I assume we want to get rid
of the wait indicator on both success and failure.

3. I've grabbed the content of the target before sending the request,
because once we're in onFailure, we may or may not still have it
(since most servers do send back content along with their 404s or 500s
or whatnot). To use the previous content later, I used a closure for
the onFailure handler, where otherwise you could (if you wanted to)
make it a named function declared elsewhere. (It being a closure is
not unusual and is unlikely to be a problem; if it is, you can get
around that using Function.curry[4].)

4. In onFailure, I want to be sure my update showing the error
supercedes any update Ajax.Updater may do automatically, so I queue it
to run just a moment later using Function.defer[5]. Incredibly
useful, is Function.defer. :-)

But! If you do want to use Ajax.Request, you can just use
Element.update[6] in your onSuccess handler to update the element; it
will eval the scripts for you. If you end up needing to eval them for
yourself for any reason, Prototype provides String.evalScripts[7] (and
String.stripScripts[8]) to help.

So many options! Barring some additional requirement, I'd go with
Ajax.Updater. :-)

[1] http://www.prototypejs.org/api/ajax/options
[2] http://www.prototypejs.org/api/ajax/request
[3] http://www.prototypejs.org/api/ajax/updater
[4] http://www.prototypejs.org/api/function/curry
[5] http://www.prototypejs.org/api/function/defer
[6] http://www.prototypejs.org/api/element/update
[7] http://www.prototypejs.org/api/string/evalscripts
[8] http://www.prototypejs.org/api/string/stripscripts

HTH,
--
T.J. Crowder
tj / crowder software / com

[Jonathon Deason]

Alex,

I hit submit too early, I removed most of the real code to get it out of the way and accidentally changed it before I was allowed to post again! evalJS was not functioning either.

TJ,

But!  If you do want to use Ajax.Request, you can just use
Element.update[6] in your onSuccess handler to update the element; it
will eval the scripts for you.  If you end up needing to eval them for
yourself for any reason, Prototype provides String.evalScripts[7] (and
String.stripScripts[8]) to help.

I do want to use Ajax.Request for other reasons, but I did not know I could do Element.update!  I like it.  I figured out I can use evalScripts(), but it seems... quirky?

Thanks for all the help!

[T.J. Crowder]

Hi Jonathan,

> I figured out I can use evalScripts(), but
> it seems... quirky?

How so? Element.update just uses evalScripts under the covers, so any
quirkiness will be inherited... Do you mean the function definition
thing?

[snip]