Dynamically writing Javascript code?

Question

I am creating dynamic sites with the same code base, where I will need to display the appropriate Google ads Javascript code, based on some logic.

In my .Net 4, MVC3 environment, I have setup the following scenario:

Navigating to www.mysite.com/script_processor/ returns the following text:

function doAlert(v1, v2){alert('Called alert()' + v1 + ' : ' + v2);}

This text come out of my model as such:

page.stringResponse = "function doAlert(v1, v2){alert('Called alert()' + v1+ ' : ' + v2);}";

I can then do something like this from a separate site/page:

<script type="text/javascript" src="http://mysite.com/script_processor/">
</script>
<script type="text/javascript">
    doAlert('string 1', 'string 2');
</script>

As you would expect, I get an alert box with "Called alert() string 1 : string 2", so the function on mysite.com is accessible from site 2.

Obviously when I do a view source form the page, I only see the doAlert() call, and not the content of the function that sits on mysite.com.

Now, instead of doAlert() on mysite.com, I want to have a function that dynamically writes out javascript that can will be seen on site 2 when it's called.

I created a model method:

public GetResponsePage GetPageResponse(string V1, string V2)
{
    var page = new GetResponsePage();
    page.stringResponse = "<script type=\"text/javascript\">document.write('testing injected Javascript.');alert('value of v1: " + V1 + "value of v2: " + V2 + "');</script>";
    return page;
}

When navigating to the route, I see the popup, and the "testing injected Javascript." on the page.

When I reference this from site 2, I don't see the popup, nor do I see "testing injected Javascript" in the page source.

As I mentioned I will later replace this with the JS code for the appropriate Google Ads js code.

I don't think this is working quite right... what am I missing?

Thanks.

If your goal is to be able to include an external javascript on a page and have that external javascript alter the content of the page so that you see the altered contents when you do a view source, it won't work. — jessegavin
– jessegavin, Commented Dec 27, 2011 at 17:43
No, I just want to dynamically set the javascript that gets displayed on the page. So the request comes in to /script_processor/, and returns the appropriate Javascript that needs to be visible from the site calling it. — ElHaix
– ElHaix, Commented Dec 27, 2011 at 17:57

Adam Rackis · Accepted Answer · 2011-12-27 18:02:54Z

3

You can use the ever evil eval to dynamically execute JavaScript. The JavaScript you pass in can also declare functions.

eval("function doAlert(v1, v2){alert('Called alert()' + v1 + ' : ' + v2);}");

I'm not sure exactly what you're trying to accomplish, but you could put an eval call like this wherever you want:

function createDoAlertFunction(){
    eval("function doAlert(v1, v2){alert('Called alert()' + v1 + ' : ' + v2);}");
}

Just note though, that this should be avoided. Stick to declaring your functions the old fashioned way, like you already are.

EDIT

Oh, you want MVC to to inject JavaScript dynamically. MVC has a JavaScriptResult, but it looks like its use is strongly, strongly discouraged.

Nonetheless, here's a link that shows its use

public ActionResult DoSomething() {  
   string s = "$('#some-div').html('Updated!');";  
   return JavaScript(s);  
}

and why it's not a good idea

edited Dec 27, 2011 at 18:02

answered Dec 27, 2011 at 17:37

Adam Rackis

83.5k57 gold badges281 silver badges402 bronze badges

Sign up to request clarification or add additional context in comments.

9 Comments

ElHaix Over a year ago

Updated with more details above.

ElHaix Over a year ago

Thanks for the info on eval... I've stayed away from this in the past. What I'm trying to accomplish is when making the js reference, that the response from www.mysite.com/script_processor/ is visible to say, Google/etc. From my tests above, I know that the script is accessible, and that I can pass variables to script_processor that will allow me to add the appropriate js response text. With that reference on site 1 the script_processor, how can I verify that the script is loaded and visible, when all I see is the reference in the code?

Adam Rackis Over a year ago

@ElHaix - ahh, I see. Let's say there's a global variable called x declared in a script, and you want to know if this script has been loaded. The best way would be to check to see if x exists, which you can do like this if (typeof x === "undefined") alert("not loaded");

ElHaix Over a year ago

@ Adam - Makes sense. I was part way there with the alert() test. Thanks for the nudge.

Adam Rackis Over a year ago

@ElHaix - sure. And x can be a function and that'll work fine. So for your example you could test whether doAlert has been created with if (typeof doAlert === "undefined") alert("not loaded");

|

Manpreet Singh Dhillon · Accepted Answer · 2018-04-02 20:11:18Z

0

I know it is very late. But there is very easy way to send JavaScript from controller.

 @Html.Raw("<script>" + @ViewBag.DynamicScripts + "</script>")

In controller send JavaScript as follows:

 ViewBag.DynamicScripts = "alert('test');";

answered Apr 2, 2018 at 20:11

Manpreet Singh Dhillon

91311 silver badges20 bronze badges

Collectives™ on Stack Overflow

Dynamically writing Javascript code?

2 Answers 2

9 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

9 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related