Render :edit在使用涡轮帧时未按预期工作

huangapple go评论56阅读模式
英文:

Render :edit not working as expected with turbo frame

问题

我正在使用turbo-rails开发一个两步预订表单,以便使用Ajax并仅更新必要的页面组件。
我正在使用两个模型,BookingDateBookingBookingDate包含开始和结束的日期时间。 Booking包含BookingDate和其他预订属性。
应用程序包含一个单页面。思路是:用户选择日期并按下“下一步”后,应用程序保存BookingDate记录,仍然显示可编辑的日期选择器(在编辑模式中),并显示这些日期可用的项目。
问题是:我无法在保存日期后显示可编辑的日期选择器。相反,应用程序显示booking_dates/index页面。

views/cust/customer_bookings/_main.html.erb

<%= turbo_frame_tag @booking_date do %>
  <%= render "booking_dates/cust_form", booking_date: @booking_date %>
<% end %>

views/bookings_dates/_cust_form.html.erb

<%= turbo_frame_tag @booking_date do %>
  <%= simple_form_for(@booking_date) do |f| %>
    <%= f.date_field :start_date %>
    <%= f.date_field :end_date %>
    <%= f.submit value = "Next step" %>
<% end %>

controllers/booking_dates_controller.rb

  def create
    @booking_date = BookingDate.new(booking_date_params)
    respond_to do |format|
      if @booking_date.save
        format.html { render :edit, location: @booking_date }
        format.json { render :show, status: :created, location: @booking_date }
      else
        ...
      end
    end
  end

views/booking_dates/_edit.html.erb

<%= turbo_frame_tag @booking_date do %>
  <%= render "booking_dates/cust_form", booking_date: @booking_date %>
<% end %>

服务器日志:

Started POST "/booking_dates" for ::1 at 2023-02-27 18:53:58 +0100
Processing by BookingDatesController#create as TURBO_STREAM
...
app/controllers/booking_dates_controller.rb:46:in `block in create'
TRANSACTION (93.7ms)  commit transaction
↳ app/controllers/booking_dates_controller.rb:46:in `block in create'
Rendering booking_dates/edit.html.erb
Rendered booking_dates/_cust_form.html.erb (Duration: 3.2ms | Allocations: 1042)
Rendered booking_dates/edit.html.erb (Duration: 4.2ms | Allocations: 1217)
Completed 200 OK in 110ms (Views: 5.6ms | ActiveRecord: 94.5ms | Allocations: 4237)
Started GET "/booking_dates" for ::1 at 2023-02-27 09:17:18 +0100

我使用以下教程来使用turbo frames:
Hotrails - Turbo Rails tutorial

英文:

I am developing a 2-step booking form using turbo-rails in order to use Ajax and update only the necessary page components.
I am using 2 models, BookingDate and Booking. BookingDate contains the start and end DateTimes. Booking contains the BookingDate and the other booking attributes.
The application consists in a single page. The idea is this: after the user chooses the dates and presses Next Step, the app saves the BookingDate record, still displays the date pickers enabled (in edit mode), and shows the items available for those dates.
The problem is: I am not able to display the editable date pickers after saving the dates. Instead, the app shows the booking_dates/index page.

views/cust/customer_bookings/_main.html.erb

<%= turbo_frame_tag @booking_date do %>
  <%= render "booking_dates/cust_form", booking_date: @booking_date %>
<% end %>

views/bookings_dates/_cust_form.html.erb

<%= turbo_frame_tag @booking_date do %>
  <%= simple_form_for(@booking_date) do |f| %>
    <%= f.date_field :start_date %>
    <%= f.date_field :end_date %>
    <%= f.submit value = "Next step" %>
<% end %>

controllers/booking_dates_controller.rb

  def create
    @booking_date = BookingDate.new(booking_date_params)
    respond_to do |format|
      if @booking_date.save
        format.html { render :edit, location: @booking_date }
        format.json { render :show, status: :created, location: @booking_date }
      else
        ...
      end
    end
  end

views/booking_dates/_edit.html.erb

<%= turbo_frame_tag @booking_date do %>
  <%= render "booking_dates/cust_form", booking_date: @booking_date %>
<% end %>

Server log:

Started POST "/booking_dates" for ::1 at 2023-02-27 18:53:58 +0100
Processing by BookingDatesController#create as TURBO_STREAM
...
app/controllers/booking_dates_controller.rb:46:in `block in create'
TRANSACTION (93.7ms)  commit transaction
↳ app/controllers/booking_dates_controller.rb:46:in `block in create'
Rendering booking_dates/edit.html.erb
Rendered booking_dates/_cust_form.html.erb (Duration: 3.2ms | Allocations: 1042)
Rendered booking_dates/edit.html.erb (Duration: 4.2ms | Allocations: 1217)
Completed 200 OK in 110ms (Views: 5.6ms | ActiveRecord: 94.5ms | Allocations: 4237)
Started GET "/booking_dates" for ::1 at 2023-02-27 09:17:18 +0100

For the use of turbo frames I am using this tutorial:
Hotrails - Turbo Rails tutorial

答案1

得分: 0

  1. 按照评论建议,将控制器的编辑操作更改为:format.html { render :edit, status: :ok, locals: {booking_date: @booking_date } }
  2. edit.html.erb 中,将 turbo_frame_tag 更改为 "new_booking_date"。对我来说,这是最难发现的错误之一:在持久化对象之后,先前的代码 turbo_frame_tag @booking_date 指向了已持久化的对象,因此破坏了具有相同 id 的 turbo 框架的逻辑 "new_booking_date"。
英文:

Solved by doing the following:

  1. As suggested in the comment, changed the controller's edit action to: format.html { render :edit, status: :ok, locals: {booking_date: @booking_date } }
  2. In edit.html.erb, changed the turbo_fram_tag to "new_booking_date". For me, this was the bug most difficult to spot: after persisting the object, the previous code turbo_frame_tag @booking_date was pointing to the persisted object, therefore breaking the logic of having a turbo frame with the same id "new_booking_date"

huangapple
  • 本文由 发表于 2023年2月27日 17:19:39
  • 转载请务必保留本文链接:https://go.coder-hub.com/75578624.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定