Dynamic Select Fields in Rails using Hotwire

► Check out gorails.com for Pro episodes and more!
► SaaS business template for Ruby on Rails with built-in features like Payments, Teams, and much more: jumpstartrails...
► Ruby on Rails hosting with Hatchbox.io: hatchbox.io
► Learn how to add Stripe Payments (with SCA support!) with Ruby on Rails: courses.gorail...

[@ricardomordaunt1101]

Chris is a genius when it comes to programming.. it's all Greek to me.. how do you understand it all.. You are truly in a league of your own in my opinion.. Thank you for this tutorial

[@deybmen]

Just what i needed for my current project

[@GorailsTV]

Love when a screencast comes out at the perfect time!

[@deybmen]

@@GorailsTV thank you!

[@richarddana2603]

SIRRR!!!!! You are my Knight in SHIMMERING armor

[@anthonypetruzzi158]

.invert 😲 where has that been my whole life. I don't do rails anymore 😭 but I just LOVE watching your videos 💘

[@defsdoor]

I really liked this video, generally but primarily for one reason. It confirmed that I was on the right track with my own dive in to stimulus and turbo. There's not a lot of information out there still and, for turbo/turbo frames especially, it's very much still a moving target.

[@GorailsTV]

It sure is. Luckily it's becoming easier and easier to use and more tutorials now that we've had time to learn and use it for a few months.

[@kwhandy]

dude please add more hotwire-related content this semester. you also need to update any existing content that already done with turbolinks/UJS, like button loading spinner and love/like/follow button.

[@GorailsTV]

It's coming!

[@elissonmichael2807]

Thanks for sharing.

[@jayjreg]

Failed to register controller: country (controllers/country_controller) TypeError: Failed to resolve module specifier "@rails/request.js". Relative references must start with either "/", "./", or "../".

[@jayjreg]

Could not find a declaration file for module '@rails/request.js'.

[@jayjreg]

Error invoking action "change->select#change"

[@igorpenkovsky3209]

Nice, thanks!

[@jheathco]

Great work. What about when editing an address to have the list of states pull on page load based on the record's existing country?

[@dabiraakinwumi8698]

hey i ran into the same issue and i solved it by getting the id of the existing record from the url params. Then calling my model from my controller e.g Address.find[:id]. Once you know what country is attached to the current address you can get the list of states and attach it to the page on page load using stimulus. Thats the basic idea

[@cmthimmaiah]

Awesome video, thank you

[@angeluray9211]

How could I integrate this functionality with the registration form of devise, I want to let my users select the country they're from or live.

[@SEOng-gs7lj]

possible to show the turbo progress bar when the request.js GET is slow?

[@BorisBarroso]

This is nice, how it would work if you set the value of the country in the form? I think we should make changes to the *change* function to make it work

[@shannonmariehauck]

This is awesome! I need to figure out a slight variation: suppose there are too many countries for a form.select field. Think of millions of countries. How could it use an autocomplete search to display only matching options for the user to select. Thank you!

[@GorailsTV]

A Javascript library like TomSelect is handy for this. You can have it load the options via AJAX requests and also filter those results remotely.

[@grahambinho]

Great video. Do you have a tutorial video on 'collection_check_boxes'?

[@RohanDaxini]

Thanks for this tutorial Chris. Very helpful. Somehow just for my setup (Rails 7.0.1 and Ruby 3.0.0) the request.js didn't work for me directly while using it in country_controller.js (or select_controller.js). In other words, despite doing that step, and then calling get() function, it was unable to do anything. Though, I followed the exact step from this tutorial i.e. using "yarn add @rails/request.js". So I had to still install request.js using gem "requestjs-rails" and then running "rails requestjs:install". The earlier yarn step also added dependency in package.json but still, it was not working. After using gem and installing request.js step with rails command, it added the import statement for "rails/request.js" in import application.js. Everything worked fine after this step. It's strange but that's how it worked for me. Letting you know here just in case it helps anybody else facing the same issue.

[@amazingcake7023]

Did you import the " { get } from '@rails/request.js' ". I've the same setup as you and mine is not working.

[@amazingcake7023]

i still get this error message "Uncaught TypeError: Failed to resolve module specifier "rails/request.js". Relative references must start with either "/", "./", or "../". "

[@RohanDaxini]

@@amazingcake7023 Yes I have "import { get } from "@rails/request.js"" in country_controller.js as well otherwise it wasn't working.

[@RohanDaxini]

@@amazingcake7023 did you try importing i.e. import "@rails/request.js" in your application.js ?

[@kristianpapadakis996]

How would you extend this to also select a city from a given state?

[@GorailsTV]

You'd do the same thing when the state changes and load a list of cities from the Rails app.

[@kristianpapadakis996]

Thank you, Chris@@GorailsTV

[@Kami84]

I need to do this for state and county within the US. As in user selects state and the second drop down will list counties within that state. There is not gem for this that I have found. How would I do this if there is no gem that I can use? I am also new to ruby on rails.

[@GorailsTV]

You could load a CSV or make a database model for the counties. Doesn't really matter where you store the data. 👍

[@whyimustusemyrealname3801]

anyone have example for typeahead combobox ?

[@mutigersuaheli8444]

Hello, can you tell me how I can fill a simple text field dynamically in this way?

[@GorailsTV]

Your turbo stream would probably need to replace the text field with one that's filled out.

[@samuelfaure4332]

Very good tutorial, but it would be amazing if you showed some tests too (with rspec/capybara for example)

[@MichalDudkiewicz-m7g]

he do something but source to download is build completly different

[@bristinachristian1366]

Make video on pagination without gem with dropdown filter

[@spryffee-old]

This approach does not work if you have another controller (e.g. slim-select) set for the select fields

[@GorailsTV]

You would modify it to update slim select options instead.

[@je9625]

Is it me or is the code complex ?

[@GorailsTV]

It takes some getting used to. I found turbo confusing for a while.