How to Force Javascript to Execute within HTML Response to Ajax Request

28,557

Solution 1

The parameter is:

evalScripts:true

Note that you should be using Ajax.Updater, not Ajax.Request

See: http://www.prototypejs.org/api/ajax/updater

Ajax.Request will only process JavaScript if the response headers are:

application/ecmascript, application/javascript, application/x-ecmascript, application/x-javascript, text/ecmascript, text/javascript, text/x-ecmascript, or text/x-javascript

Whereas Ajax.Updater will process JS is evalScripts:true is set. Ajax.Request is geared toward data transport, such as getting a JSON response.

Since you are updating HTML you should be using Ajax.Updater anyways.

Solution 2

Does setting evalScripts: true as an option help?

Share:
28,557
Guram Savinov
Author by

Guram Savinov

I work for Lendio which helps small businesses find lending. While I have spent a lot of time as a full stack LAMPP programmer, my first love was data and databases. At present I get to spend all of my time at Lendio working on data architecture solutions, data quality, and helping data tell its story to our employees.

Updated on July 05, 2022

Comments

  • Guram Savinov
    Guram Savinov almost 2 years

    We're using Prototype for all of our Ajax request handling and to keep things simple we simple render HTML content which is then assigned to the appropriate div using the following function:

    function ajaxModify(controller, parameters, div_id)
    {
        var div = $(div_id);
    
        var request = new Ajax.Request 
        (
            controller, 
            {
                method: "post",
                parameters: parameters,
                onSuccess: function(data) {
                    div.innerHTML = data.responseText;
                },
                onFailure: function() {
                    div.innerHTML = "Information Temporarily Unavailable";  
                }
            }
        );
    }
    

    However, I occasionally need to execute Javascript within the HTML response and this method appears incapable of doing that.

    I'm trying to keep the list of functions for Ajax calls to a minimum for a number of reasons so if there is a way to modify the existing function without breaking everywhere that it is currently being used or a way to modify the HTML response that will cause any embedded javascript to execute that would great.

    By way of note, I've already tried adding "evalJS : 'force'" to the function to see what it would do and it didn't help things any.

  • Guram Savinov
    Guram Savinov over 15 years
    THAT WAS TOTALLY WICKED! I can't believe that I never saw this before. Thank you.
  • Diodeus - James MacFarlane
    Diodeus - James MacFarlane over 15 years
    Me too. I made the same mistake and spent an hour bashing my head against my monitor. It was because I was just spitting out JS and didn't care about updating any HTML. I ended up updating a dummy/hidden DIV just so I didn't have to fiddle with server headers.