# UJS not getting executed upon return, in production only. Works in development

**URL:** <https://www.ruby-forum.com/t/ujs-not-getting-executed-upon-return-in-production-only-works-in-development/195535>\
**Category:** Rails\
**Created:** [September 24, 2010, 5:24pm UTC](https://www.ruby-forum.com/t/ujs-not-getting-executed-upon-return-in-production-only-works-in-development/195535 "2010-09-24T17:24:10Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![William\_KSHatch\_Jr](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/w/f9ae1b/32.png) [@William\_KSHatch\_Jr](https://www.ruby-forum.com/u/William_KSHatch_Jr)\
**Post date:** [September 24, 2010, 5:24pm UTC](https://www.ruby-forum.com/t/ujs-not-getting-executed-upon-return-in-production-only-works-in-development/195535/1 "2010-09-24T17:24:10Z")

</div>

Hello all,

I’ve got an action that’s somewhat heavy (slow) that returns …js.erb.  
The action completes fine, and I can see the results in firebug in the  
console, but the javascript isn’t being executed, on the production  
(more like production test) box. It works fine locally in development  
env, and if I copy and paste the returned stuff from the firebug console  
response it will execute just fine. Here’s the js erb:

$("#\<%=@element\_id%\>").fadeOut();  
$("#\<%=@element\_id%\>").hide(100);  
$("#FirstTheme").append("\<%= escape\_javascript(render(:partial =\> ‘tag’,  
:locals=\>{:entity\_id=\>@entity\_id, :theme\_id=\>@theme\_id,  
:entity=\>@entity, :element\_id=\>@element\_id, :parent\_id=\>@parent\_id,  
:tag=\>@tag})) %\>");  
$("#ObsList").html("\<%=  
escape\_javascript(render(:partial=\>‘explore/observation’,  
:collection=\>@observations))%\>");

I’m using jquery 1.4.2, rails 3. I’m not a jquery expert, so I’m  
scratching my head as where to look for debugging this. Thanks for any  
pointers.

Bill

---

<div class="post-metadata">

**Author:** ![William\_KSHatch\_Jr](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/w/f9ae1b/32.png) [@William\_KSHatch\_Jr](https://www.ruby-forum.com/u/William_KSHatch_Jr)\
**Post date:** [September 24, 2010, 6:27pm UTC](https://www.ruby-forum.com/t/ujs-not-getting-executed-upon-return-in-production-only-works-in-development/195535/2 "2010-09-24T18:27:22Z")

</div>

William K. Hatch Jr. wrote:

> Hello all,
> 
> I’ve got an action that’s somewhat heavy (slow) that returns …js.erb.

You should probably fix that. Dynamically generated JS is usually a  
design problem IMHO.

> The action completes fine, and I can see the results in firebug in the  
> console, but the javascript isn’t being executed, on the production  
> (more like production test) box. It works fine locally in development  
> env, and if I copy and paste the returned stuff from the firebug console  
> response it will execute just fine. Here’s the js erb:

And here are my suggestions for doing it with static JS, which might  
perhaps solve your problem.

> $(“#\<%=@element\_id%\>”).fadeOut();  
> $(“#\<%=@element\_id%\>”).hide(100);

If you don’t know the element ID in advance, just assign it a known  
class name when the HTML is generated. Then you can do  
$(“.fade”).fadeOut();.

> $(“#FirstTheme”).append(“\<%= escape\_javascript(render(:partial =\> ‘tag’,  
> :locals=\>{:entity\_id=\>@entity\_id, :theme\_id=\>@theme\_id,  
> :entity=\>@entity, :element\_id=\>@element\_id, :parent\_id=\>@parent\_id,  
> :tag=\>@tag})) %\>”);

That’s awful! The right way to do this is to have something like the  
following in your .html.erb file (or rather, equivalent Haml), where  
your CSS defines .hidden {display: none}:

 \<%= render :partial =\> 'tag', :all =\> 'the', :other =\> 'stuff' %\>

then in the static JS

$(“#FirstTheme”).append($(“#firstThemeContent”).innerHTML)

Again, no js.erb necessary.

> $(“#ObsList”).html(“\<%=  
> escape\_javascript(render(:partial=\>‘explore/observation’,  
> :collection=\>@observations))%\>”);

Use the same technique as above.

This should clean up your JavaScript considerably and may help you  
isolate the problem, if it does not get rid of it entirely.

Also, most people use lowercase (either dashed-lower-case or  
lowerCamelCase) for their DOM IDs.

## Best,

Marnen Laibow-Koser  
[http://www.marnen.org](http://www.marnen.org)  
removed\_email\_address@domain.invalid

---

<div class="post-metadata">

**Author:** ![William\_KSHatch\_Jr](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/w/f9ae1b/32.png) [@William\_KSHatch\_Jr](https://www.ruby-forum.com/u/William_KSHatch_Jr)\
**Post date:** [September 25, 2010, 7:58pm UTC](https://www.ruby-forum.com/t/ujs-not-getting-executed-upon-return-in-production-only-works-in-development/195535/3 "2010-09-25T19:58:30Z")

</div>

On Sep 24, 2010, at 12:27 PM, Marnen Laibow-Koser wrote:

> William K. Hatch Jr. wrote:
> 
> > Hello all,
> > 
> > I’ve got an action that’s somewhat heavy (slow) that returns …js.erb.
> 
> You should probably fix that. Dynamically generated JS is usually a  
> design problem IMHO.

What??? It’s the response for an ajax request; I don’t understand what  
you’re saying here. How else would I take data driven content and insert  
it into the dom?

> > $("#\<%=@element\_id%\>").fadeOut();  
> > $("#\<%=@element\_id%\>").hide(100);
> 
> If you don’t know the element ID in advance, just assign it a known  
> class name when the HTML is generated. Then you can do  
> $(".fade").fadeOut();.

Again, this isn’t when the html is initially generated. I think I wasn’t  
clear: this is an ajax request; not an html request.

> \<%= render :partial =\> 'tag', :all =\> 'the', :other =\> 'stuff' %\>
> 
> then in the static JS
> 
> $("#FirstTheme").append($("#firstThemeContent").innerHTML)

Again, this content wouldn’t exist at the time of the page load, so it’s  
not possible for it to be there in the first place.

> isolate the problem, if it does not get rid of it entirely.
> 
> Also, most people use lowercase (either dashed-lower-case or  
> lowerCamelCase) for their DOM IDs.

well, the shop i’m doing it for uses camel case caps for the id’s, and  
lowercase dashed on class names.

Sorry, but I think you’re completely missing the point, probably because  
I didn’t explain it well.

All of this works, has worked fine, in development. The issue is it’s  
not getting rendered by the browser even though it is being returned to  
the browser, in production, on the server. So, request comes in, gets  
processed, javascript gets returned to the browser, and if in  
development, the appropriate elements update and content is inserted. If  
in production, request comes in, gets processed, javascript gets  
returned to the browser, and nothing happens.

---

<div class="post-metadata">

**Author:** ![William\_KSHatch\_Jr](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/w/f9ae1b/32.png) [@William\_KSHatch\_Jr](https://www.ruby-forum.com/u/William_KSHatch_Jr)\
**Post date:** [September 25, 2010, 8:32pm UTC](https://www.ruby-forum.com/t/ujs-not-getting-executed-upon-return-in-production-only-works-in-development/195535/4 "2010-09-25T20:32:29Z")

</div>

William K. Hatch Jr. wrote:

> On Sep 24, 2010, at 12:27 PM, Marnen Laibow-Koser wrote:
> 
> > William K. Hatch Jr. wrote:
> > 
> > > Hello all,
> > > 
> > > I’ve got an action that’s somewhat heavy (slow) that returns …js.erb.
> > 
> > You should probably fix that. Dynamically generated JS is usually a  
> > design problem IMHO.
> 
> What??? It’s the response for an ajax request; I don’t understand what  
> you’re saying here. How else would I take data driven content and insert  
> it into the dom?

I know it’s an Ajax response. Your Ajax responses should generally be  
data (HTML or JSON) to be processed on the client side, not code.

> > > $(“#\<%=@element\_id%\>”).fadeOut();  
> > > $(“#\<%=@element\_id%\>”).hide(100);
> > 
> > If you don’t know the element ID in advance, just assign it a known  
> > class name when the HTML is generated. Then you can do  
> > $(“.fade”).fadeOut();.
> 
> Again, this isn’t when the html is initially generated.

Doesn’t matter in the least.

> I think I wasn’t  
> clear: this is an ajax request; not an html request.

An Ajax request _is_ (or can be) an HTML request; it’s really no  
different than a non-Ajax request from your server’s point of view.

> > \<%= render :partial =\> 'tag', :all =\> 'the', :other =\> 'stuff' %\>
> > 
> > then in the static JS
> > 
> > $(“#FirstTheme”).append($(“#firstThemeContent”).innerHTML)
> 
> Again, this content wouldn’t exist at the time of the page load, so it’s  
> not possible for it to be there in the first place.

Irrelevant. Your client-side static JS should fire the Ajax request,  
then process the returned HTML fragment or JSON packet to put it into  
the DOM.

> > isolate the problem, if it does not get rid of it entirely.
> > 
> > Also, most people use lowercase (either dashed-lower-case or  
> > lowerCamelCase) for their DOM IDs.
> 
> well, the shop i’m doing it for uses camel case caps for the id’s, and  
> lowercase dashed on class names.
> 
> Sorry, but I think you’re completely missing the point, probably because  
> I didn’t explain it well.

As far as I can tell, I am not missing the point at all. I hate to say  
it, but I think you are, in that you seem to be under a misapprehension  
as to how to use Ajax efficiently.

What do you think I’m missing?

> All of this works, has worked fine, in development. The issue is it’s  
> not getting rendered by the browser even though it is being returned to  
> the browser, in production, on the server. So, request comes in, gets  
> processed, javascript gets returned to the browser, and if in  
> development, the appropriate elements update and content is inserted. If  
> in production, request comes in, gets processed, javascript gets  
> returned to the browser, and nothing happens.

So stop returning JS to the browser! That’s not the way to do Ajax well  
IMHO. See my suggestions above.

Best,  
–Â  
Marnen Laibow-Koser  
[http://www.marnen.org](http://www.marnen.org)  
removed\_email\_address@domain.invalid