Why do basic forms not work in Rails 6 without binding events to each form?

it says here in the docs that for turobolinks that you now have to BIND ALL YOUR AJAX EVENTS (!?!?) if you want your forms to submit correctly.

https://guides.rubyonrails.org/working_with_javascript_in_rails.html#remote-elements

“You probably don’t want to just sit there with a filled out , though. You probably want to do something upon a successful submission. To do that, bind to the ajax:success event. On failure, use ajax:error. Check it out:”

$(document).ready ->

``$("#new_article").on("ajax:success", (event) ->

``[data, status, xhr] = event.detail

``$("#new_article").append xhr.responseText

``).on "ajax:error", (event) ->

``$("#new_article").append "<p>ERROR</p>"

basically… sitting there with a filled out form is exactly what happens if you just do a generic form_with and post it now in Rails 6 … literally, the user just sits there and nothing happens.

are you really supposed to bind all your turbolinks forms throughout your website like this? This seems totally nuts to me, and, kind of, not at all ‘unobtrusive’ … (I thought the whole point of ‘unobtrusive’ was to not have to write a lot of helper/glue/boiler plate code.)

it seems totally crazy to me that out-of-the-box Rails 6 installations can’t do the most basic web function of submitting a form without the developer having to know about binding events of the Ajax calls. In the old days didn’t this used to ‘just work’ out of the box?

anyone else have any thoughts on this and think Rails is moving in the wrong direction here? The main attraction of Rais is how easy it is to make so much functionality with little config and effort, and this area seems too basic to me to require this top-heavy approach that requires binding up Ajax events.

I think Rails 7 should move away from having turbolinks turned on by default — it’s a good technology if you want to opt-in to it, but it’s got so much configuration that it often just gets in the way for new Rails apps. It would be very easy to simply leave off Turbolinks in default Rails apps and then simply provide instructions for opting-in to it. (Like, active record session store and other things that used to be default and then were extracted out into separate opt-in gems.)

Thoughts?

Jason

1 Like

It doesn’t say you that you HAVE to bind all the ajax events. It explicitly says that you “probably” want to do that if you “probably” want to do something other than just submitting the form.

Incorrect. You HAVE to bind your Ajax events, or else there is no functionality. (the page does not refresh and gives no user interaction). I do not think that expecting user interaction is an abnormal expectation in a modern web app.

I have a few rails 6 projects and remote forms works out of the box with no event binding. Can you reproduce that problem with a clean rails app? maybe you have some other js messing up rails’ ajax handers.

Can you share some code to reproduce the problem? (a github repo with a simple rais app would be greate)

And also (sorry for the multiple responses), you are showing jquery code, rails moved out of jquery a long time ago (I think docs are outdated though), something might be wrong with your setup.

Yes, I was discussing this in the Slack channel yesterday in the #coding room

You’re right that Rails no longer installs JQUery by default, but lots of things just go ahead and encourage it anyway. (which Is fine and not what I’m complaining about)

This guide, for example, as I said above, encourages you to use jQUery to add Ajax events to your form submit:

https://guides.rubyonrails.org/working_with_javascript_in_rails.html#remote-elements

You could of course not use jQuery and do it another way, except that rails-ujs, which is really the problem here, expect you not to.

Right at the top of the https://github.com/rails/jquery-ujs/wiki/ajax docs it says that the UJS events are emitted through jQuery.

So I realize that UJS is also at play here, and neither UJS nor jQUery are my complaints.

My complaint is that this obscure non-intuitive part of Rails is required to do something basic-- like submit a form-- and that Rails 6 has too much configuration over convention.

These days when I install Rails 6 all I do is configuration, configuration, configuration (and fighting with these obscure parts of Rails to configure it some more)

my code just looks like this:

  • if @unsubscribe

= form_with url: ‘/unsubscribe’ do |f|

= f.hidden_field :email, value: @unsubscribe.email

= f.hidden_field :nonce, value: @unsubscribe.nonce

You are confirming that you want to unsubscribe:

%br

%br

= f.text_field :email, disabled: true, value: @unsubscribe.email

%br

%br

= f.submit ‘Unsubscribe’

When I do this, the form is submitted as Javascript (JS). if I add local: true then the form is submitted as HTML.

***This is not a bug, it is a complaint. ***

the default behavior (to submit using JS) shouldn’t leave my app in a non-working buggy state (nothing happens unless you bind an event to the Ajax event). that’s the complaint.

-Jason

I understand your complain, what I’m saying is that I have some rails 6 projects using form_for remote and form_with and I didn’t have to bind to the ajax events. rails-ujs and jquery_ujs both expect you to render a view with .js format and both libraries executes your response’s javascript.

Are you rendering a js view when you process the unsubscribe action? what does you action do? what do you respond to the user from your server? you have to tell rails what to do when you submit the form, how are you telling rails what to do?

I don’t think you can blame Rails 6 for that. It is a weird default, but it is like that from the very beginning.
I never use the method, so, I guess, it can be considered as somewhat obscure. It seems to appear in Rails version 5.1 and no change since.
Normally, I would use ActiveModel for a local form. Just in case you don’t know, ActiveModel can also be used independently from ActiveRecord.

This is the earliest docs I found.
https://api.rubyonrails.org/v5.1/classes/ActionView/Helpers/FormHelper.html#method-i-form_with

Guess someone already complained, but it is too late; there is no good reason to introduces breaking changes for a better default.
Also, in a sense, this can be the better default, since ActiveModel is there for you to build a form for the same app.

Let me try again on a new Rails app and confirm that I am right.… if what YOU say is correct then I missed something when debugging and it is my bad.
Will revert on this

I’m not suggesting any breaking changes at all.

I’ve been using Rails since Rails version 2 so I don’t know what you mean “like that from the beginning”

In the beginning, DHH said things would “just work” and, as a community we would value convention over configuration.

As far as using ActiveModel with the form_with, I don’t think that’s relevant, it wouldn’t make any difference as to behavior.

All I’m suggesting is that Turbolinks is too complicated and should be OFF by default, like a lot of other things, so that it could be opted-into by the dev instead of forced upon us by the framework.

1 Like

For your information, the context of my previous post is focused on form_with, the method in the discussion.

But, for broader sense, Basecamp and DHH are great and generous companion to be in the same community. You can't find community like this somewhere else.

However, we all eventually grow up from the Rails way.
You are frustrating with Turbolinks, et al, these are normal.
Me too, have the same experience, my project don't even use Active Record, for me it is a pain, and every design based on ER diagram is usually subpar IMO.

However, I won't give up on Rails, it is so far beyond other community from my point of view. After all Rails is just a bunch of libraries, if you don't like some, just ignore it, the benefit from the community is far exceeding it down side.

And you too, should see it already, or you won't stick to it this long.

I think what @Jason_FB is alluding to is that forms don’t work with remote out of the box, and convention is a wee bit broken. I would agree with that. I’ve been using Rails since version 3.2 (c. 2011), and it is also true that we’ve ended up here because… because we’ve ended up here :man_shrugging:.

I came upon this post today pretty much out of serendipity, but as a matter of dev UX, this has been mentioned a few times, I even opened up a Github issue (I’ve been a bit cranky there, sorry!) at rails#20610, also a mention in jquery-ujs#506.

I think this is a good first step to build forward into what reasonable defaults would look like based on where we’re at, and what’s possible. I don’t think we’re that far off.

you know… upon more work with Rails 6 I realize they do work out of the box if you use the (very old-style) .js.erb (that, emulated ruby inside of javascript responses).

If you use JS responses and the server pushes back JS, then adding remote: true to your forms does actually work out of the box.

but I guess what seems odd is that the JS-response style is like SO old now, like it’s a paradigm from like 2007 and if you want to do anything else and use remote: true, then you have to do this ‘binding’ work in JS by hand. (or it feels that way).

or just use an actual front-end JS framework and be done with Rails forms.