3

以前は Rails でbutton_toタグを使用すると、このような確認ダイアログを使用することができました

<%= button_to 'Destroy', @post, method: :delete, data: { confirm: 'Are you sure?' } %>

data: { confirm: 'Are you sure?' }内部で @rails/ujs ライブラリによって使用された Rails マジック データ属性です。

Rails 7 以降、このライブラリはデフォルトでは有効ではなくなりました。この Rails の代わりに Turbo ライブラリを使用します

そして今、このコードは機能しません

公式のRailsドキュメントとTurboハンドブックには情報がありません

私が試したこと

<%= button_to 'Destroy', @post, method: :delete, data: { turbo_confirm: 'Are you sure?' } %>
<%= button_to 'Destroy', @post, method: :delete, data: { 'turbo-confirm': 'Are you sure?' } %>

でも結果が出ない

SOで解決策は見つかりませんでしたが、Hotwireフォーラムで見つかりました。刺激アクションを使用したこのソリューション。少しだけ改善します

<%= form_with model: @post, method: :delete, data: { controller:  'confirmation', message: 'Are you sure?', action: 'submit->confirmation#confirm' } do |f| %>
  <%= f.submit 'Destroy' %>
<% end %>

// app/javascript/confirmation_controller.js
import { Controller } from '@hotwired/stimulus'

export default class extends Controller {
  confirm(event) {
    if (!(window.confirm(this.element.dataset.message))) {
      event.preventDefault()
    }
  }
}

それは機能しますが、非常に難しく、見栄えが悪く、Rails がクールであることに慣れています。

4

2 に答える 2

2

rails-ujs を使用しない Turbo を使用する Rails では、確認ポップアップ ウィンドウを呼び出すにbutton_toは、次のようなコードを使用する必要があります。

<%= button_to 'Destroy', @post, method: :delete, form: { data: { turbo_confirm: 'Are you sure?' } } %>

また

<%= button_to 'Destroy', @post, method: :delete, form: { data: { 'turbo-confirm': 'Are you sure?' } } %>

どちらもdata-turbo-confirm属性を生成します

したがって、この属性を送信ボタン (rails-ujs など) ではなく、このボタンを含むフォームに直接追加する必要があります (このタグはボタン付きのフォームを生成することを思い出してください)。

于 2022-02-05T00:26:19.527 に答える
0

それで、これはどこに文書化されていますか？

ばかげた data-confirm link_to を追加するのに何時間も費やしました。destroy の link_to バージョンはターボ トラップです。そのトラップはオブジェクトを削除するだけでなく、ターボ フレームに応答してツリー構造全体を削除します。

刺激の助けを借りて button_to を動作させましたが、button_to のドキュメントでこのオプションを見たことがありません。

于 2022-02-23T02:14:11.693 に答える