#Multiple actions on a single page

1 messages · Page 1 of 1 (latest)

violet hound
#

Since a route's action is basically a POST endpoint, all forms will submit to the same action.

This solution works for multiple forms on a page, as well as multiple submit buttons in a form

By adding a name _action and unique value to each submit button, your action logic can identify which form was submitted

Then, use a switch or if chain in your main action to call specific functions

https://www.jacobparis.com/guides/remix-multiple-actions

Multiple forms and actions on a page with Remix

A Remix action is an endpoint for POST requests, and all forms will submit to the same action. Add a name and value to your submit button to know which form was submitted, and use that to determine which action to take.

noble kindle
#

really good & practical example! (implementing a tweet!)

pure frost
#

have you tried namedActions from Remix Utils?

#

the example on your article would look like this:

return namedAction(formData) {
  LIKE: async () => likeTweetAction(args),
  RETWEET: async () => retweetAction(args),
  REPLY: async () => replyAction(args),
  SHARE: async () => shareAction(args),
}

if you don't use all uppercase for the _action you could just do async like() { likeTweetAction(args) }