Rails render js file but can't execute it

Question

I have a problem with my Ruby (1.9.3p194 (2012-04-20 revision 35410) [x86_64-linux]) on Rails (3.2.6) application: I need to execute a js file, but I can only print it.

View:

291             <%= form_for :change_top_ten, remote: true, url: {controller: :users, action: :change_top_ten, format: :js} do |f| %>
292                 <%= f.select :status, options_for_select(@categories_and_interests, selected: "tutti"), {class: :'deafult-select'}, onchange: "this.form.submit();" %>
293             <% end %>

Controller:

1658   def change_top_ten
1659     @filter = params[:change_top_ten][:status]
1660   end

change_top_ten.js.erb

  1 alert('here');

server log:

Started POST "/change_top_ten.js" for 10.0.2.2 at 2015-10-29 10:30:10 +0000
Processing by UsersController#change_top_ten as JS
  Parameters: {"utf8"=>"✓", "authenticity_token"=>"+v0oW+p0fy9IxpfbaKTj7g9yZSzffK+SQG52Mx3vjwQ=", "change_top_ten"=>{"status"=>"prof_2"}}
  User Load (56.4ms)  SELECT "users".* FROM "users" WHERE "users"."has_confirmed" = 't' AND "users"."id" = ? LIMIT 1  [["id", 13]]
  Rendered users/change_top_ten.js.erb (0.1ms)
Completed 200 OK in 154.7ms (Views: 34.9ms | ActiveRecord: 66.0ms)

The file is rendered as an html page: blank page with "alert('here');" printed on it.

EDIT: I'm editing the question to reply to the first comment:

application.js

  1 // This is a manifest file that'll be compiled into application.js, which will include all the files
  2 // listed below.
  3 //
  4 // Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts,
  5 // or vendor/assets/javascripts of plugins, if any, can be referenced here using a relative path.
  6 //
  7 // It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
  8 // the compiled file.
  9 //
 10 // WARNING: THE FIRST BLANK LINE MARKS THE END OF WHAT'S TO BE PROCESSED, ANY BLANK LINE SHOULD
 11 // GO AFTER THE REQUIRES BELOW.
 12 //
 13 //# require angular
 14 //= require jquery
 15 //= require jquery_ujs
 16 //= require jquery.countdown
 17 //= require jquery.remotipart
 18 //# require_tree .

Jquery is imported because I have other calls like the one described here and thery are working fine

Aren't you missing the rails-jquery javascripts? i.e. `//= require jquery_ujs` line in `application.js`? — roman-roman, Oct 29 '15 at 10:38
I think your question is answered here [rails form submission with remote => true](http://stackoverflow.com/questions/20628013/rails-form-submission-with-remote-true-js-file-renders-but-does-not-execut) — Pardeep Saini, Oct 29 '15 at 10:50
Please check the request `content-type` from the server log. I'm sure it will be `application/text` — Kh Ammad, Oct 29 '15 at 11:39

score 1 · Answer 1 · answered Oct 29 '15 at 17:37

1

Ok so the response to your ajax query is not being evaluated as javascript. Try adding the following to your application.js file or somewhere where it will be executed before your form is rendered.

$.ajax({
    url: this.href,
    dataType: "script",
    beforeSend: function(xhr) {xhr.setRequestHeader("Accept", text/javascript");}
});

What this is doing is saying set the data type of all ajax calls as 'script' which should mean the response is evaluated as javascript.

answered Oct 29 '15 at 17:37

Paul D

31
4

Hi Paul D is the double quotes symbol after text/javscript correct? – ste Oct 30 '15 at 07:27
I added your code (with text/javascirpt sourrounded by double quotes) and nothing changed :( – ste Oct 30 '15 at 07:35

score 0 · Answer 2 · answered Oct 29 '15 at 14:07

0

You just put respond_to js in your method. Please try a code below:

def change_top_ten
  @filter = params[:change_top_ten][:status]
  respond_to do |format|
    format.js
  end
end

It will run your change_to_ten.js.erb file. I hope this help you.

answered Oct 29 '15 at 14:07

akbarbin

4,985
1
28
31

Same result: Started POST "/change_top_ten.js" for 10.0.2.2 at 2015-10-29 15:58:22 +0000 Processing by UsersController#change_top_ten as JS Parameters: {"utf8"=>"✓", "authenticity_token"=>"+v0oW+p0fy9IxpfbaKTj7g9yZSzffK+SQG52Mx3vjwQ=", "change_top_ten"=>{"status"=>"prof_1"}} User Load (2.0ms) SELECT "users".* FROM "users" WHERE "users"."has_confirmed" = 't' AND "users"."id" = ? LIMIT 1 [["id", 13]] Rendered users/change_top_ten.js.erb (0.4ms) Completed 200 OK in 150.5ms (Views: 26.0ms | ActiveRecord: 71.6ms) – ste Oct 29 '15 at 16:00

Paul D · Answer 3 · 2015-10-30T10:29:35.627

Ok so you want to submit the form when the select is changed, which is a bit different to your original question.

You want to add some javascript to your application.js file which binds to the onChange event of the select control.

i.e. something like this:

$('select').onChange(function()
  {
    $('form').submit();
  }
);

That should submit any form on the page when any select is changed. You will probably want to scope the binding to a specific select and the submit to a specific form.

score 0 · Answer 4 · answered Oct 30 '15 at 09:15

I found a temporary solution. The problem was this code:

onchange: "this.form.submit();"

After deleting it an adding this code:

<%= f.submit :Save, class: :'btn', type: :submit %>

The js file is executed like it should.

How can I submit the form with the onchange method and have my js code executed?

score 0 · Answer 5 · answered Jun 27 '16 at 07:28

0

Make sure it has opening javascript tag, ex

<script type="text/javascript">
    enter code here
</script>

answered Jun 27 '16 at 07:28

Soh Cher Wei

1

Rails render js file but can't execute it

5 Answers5