Summary
Creating an interactive search can be a daunting task. In this episode, we look at creating a "tokenized search" feature within our Rails application which is similar to what you'd find within New Relic or Kibana.rails search stimulusjs javascript 34:14
Chapters
- Introduction (0:00)
- Overview of what's configured (2:08)
- Generating the search controller (3:22)
- Setting up the routes (4:12)
- Creating the search form (4:22)
- Creating the stimulus controller (6:41)
- Updating the view with the stimulus controller targets (7:18)
- Prevent form submission (9:17)
- Making the Search input interactive (10:27)
- Check when value is present (12:15)
- Resetting the form (13:03)
- Creating the search tag (14:20)
- Building the tag element (17:11)
- Creating the hidden input (19:29)
- Testing out the stimulus controller (21:56)
- Inspecting the POST request (22:33)
- Creating the search functionality within Rails (23:28)
- Responding to a TURBO_STREAM (29:41)
- Demo of the search functionality (30:51)
- Fixing the pagination (31:34)
- Final thoughts (33:48)
Pro Monthly
$
19
/mo
Access to Pro Episodes
Invite to Slack Channel
Priority Suggestions
Ad Free
Pro Annual
$
190
/yr
Access to Pro Episodes
Invite to Slack Channel
Priority Suggestions
Ad Free