brisa-build / brisa

The Web Platform Framework.
https://brisa.build
MIT License
448 stars 12 forks source link

Server Action in a loop can't pass data #631

Open AlbertSabate opened 1 week ago

AlbertSabate commented 1 week ago

Is your feature request related to a problem? Please describe. When you do a loop

{response.data
  .map((booking) => (
    <button onClick={(e) => doSomething(e, booking.id)}>lala</button>
))}

booking.id will throw an error because it does not exist on the client and the server bookind.id will be undefined.

The very unique way to solve this is injecting a data attr and use dataset to retreive the data on the server.

{response.data
  .map((booking) => (
    <button data-lala={booking.id} onClick={doSomething}>lala</button>
))}

// then e.currentTarget.dataset.lala will have the info

This is working and is a valid approach, but maybe we could document this or give a better way to handle this situation.

aralroca commented 1 week ago

@AlbertSabate is already documented https://brisa.build/building-your-application/data-management/server-actions#using-data-attributes

aralroca commented 1 week ago

btw; improve any kind of documentation is always very welcome as a contribution

AlbertSabate commented 1 week ago

Ohh nice, I saw the commit https://github.com/brisa-build/brisa/commit/b66b39ba9d4f16b98fd17d3fa8177d21f3eab18b @aralroca so fast adding docs haha

Let's keep it open for now, maybe someone can improve the examples? If there is no volunteers I'll get more examples there :)

Thank you!!