Rails 4：甘い警告を受け取るにはどうすればよいですか？

Question

私は初心者ですが、レコードを削除する際の基本的な醜い確認メッセージを置き換えるためにSweet Alertを使用したいと思います。私はsweet-alert宝石とsweet-alert-confirmを私の宝石ファイルに追加しました。私は彼らが読んで言ったことを正確に行っていますが、それは動作しません、私はレコードを削除することができますが、 。

Gemfile

... 
gem 'sweet-alert' 
gem 'sweet-alert-confirm' 
... 

Application.jssupportedディレクティブ。

//= require jquery 
//= require jquery_ujs 
//= require turbolinks 
//= require jquery.turbolinks 
//= require bootstrap-sprockets 
//= require sweet-alert 
//= require sweet-alert-confirm  
//= require_tree . 

stylesheet.css

/* 
... 

*= require_self 
*= require sweet-alert 
*= require_tree . 
*/ 

index.html.erbまた

... 
<%= link_to 'Destroy', ice_cream, method: :delete, data: { confirm: 'Are you sure?' } %> 
... 

、私は放火犯を開いたときにそれは価値が言及、私が見つけた場合、私は知りません代あり次のエラー。

ありがとう、あなたは私を助けることができる願っています。

Answer 1

感謝コム大きな助けのために団結！、しかし、再び、私は答えを自分で見つけ...

はsweetalert宝石との問題があるようなので

1. は、私が使用してそれをアンインストール

   gem uninstall sweetalert 
   

2. 私は私のに次の行を追加してRails Assets Web Sit Eを使用してsweetalert2をインストール10

   gem 'rails-assets-sweetalert2', source: 'https://rails-assets.org' 
   

3. 実行バンドル

4. 再配置application.jsこのよう

   //= require sweetalert2 
   //= require jquery 
   //= require jquery_ujs 
   //= require turbolinks 
   //= require jquery.turbolinks 
   //= require bootstrap-sprockets 
   //= require sweet-alert-confirm 
   //= require_tree . 
   

5. 再配置application.cssこのよう

   *= require_self 
   *= require sweetalert2 
   *= require_tree . 
   */ 
   

私はsweet-alert-confirmの宝石を手に入れました。今、私は、コードの任意の行を追加することなく、レコードを削除しようとするたびに...この甘いメッセージを見つける

注：あなたが行う前に、あなたが質問を下に投票している理由を説明してください。

Answer 2

あなたの質問が投票された理由はあまりよく分かりませんが、私は実際に数日前に同じ問題に直面しました。

ここでは、宝石を使用しないソリューションです。

1. Sweet Alertsのファイルをダウンロードします。2.ファイルを追加してアセットを読み込みます。これにより、sweetAlert関数またはswal関数を使用してアラートを作成することができます。

前述のように、確認アラート用の独自のイベントハンドラを作成する必要があり、POSTとDELETEリクエストであるため、かなりの作業が必要になります。

2. このようなリクエストの場合、このJavascriptコードを使用してallowActionメソッドを上書きできます。 application.js、または任意のjsファイルでhttp://thelazylog.com/custom-dialog-for-data-confirm-in-rails/

：回答から構成されている

//Override the default confirm dialog by rails 
$.rails.allowAction = function(link){ 
    if (link.data("confirm") == undefined){ 
    return true; 
    } 
    $.rails.showConfirmationDialog(link); 
    return false; 
} 

//User click confirm button 
$.rails.confirmed = function(link){ 
    link.data("confirm", null); 
    link.trigger("click.rails"); 
} 

//Display the confirmation dialog 
$.rails.showConfirmationDialog = function(link){ 
    var message = link.data("confirm"); 
    swal({ 
    title: message, 
    type: 'warning', 
    confirmButtonText: 'Sure', 
    confirmButtonColor: '#2acbb3', 
    showCancelButton: true 
    }).then(function(e){ 
    $.rails.confirmed(link); 
    }); 
}; 

は宝石をしようとしたが、それは私のために動作しませんでした。

Answer 3

• あなたのGemfileにこれを追加します。

  宝石 "sweetalert-Railsの

• があなたの資産/ JavaScriptのにこれを追加/

  // = sweetalertを必要としapplication.js

• アセット/スタイルシート/ application.cssに追加

  'あなたが削除してもよろしい？'、「＃を：

  * =は、この行に

  「甘い（＃{[ID]のparams}を追加するには、ERBファイルで

• 甘い警戒が必要です{posts_path（paramsは[：ID]）}」、 ''）すべて削除」：クラス=> "JSファイルにおいて削除、すべて赤色テキスト" ％>

このコード

を追加

このコードは、適切なパラメータを渡すことでプロジェクトからすべてのアラートに使用できますers。

function sweet(id, text, href, button_text) { 
    timer: 4000 
    swal({ 
    title: "Warning!", 
    text: text, 
    showCancelButton: true, 
    confirmButtonColor: "#FF6633", 
    confirmButtonText: button_text, 
    cancelButtonText: "Cancel", 
    closeOnConfirm: true, 
    closeOnCancel: true }, 
    function(isConfirm) { 
    if (isConfirm) 
    { 
     location.href = href; 
    } 
    }); 
} 

Answer 4

私はTurboLinks 5を使用していますし、提供するソリューションのどれもこれ以外、私のために働いていません。おそらく最もクリーンなソリューションではないでしょうが、それは機能します...

sweetalert2 gemを使用して、application.jsファイルに次を追加します。

//Override the default confirm dialog by rails 
$.rails.allowAction = function(link){ 
    if (link.data("confirm") == undefined){ 
    return true; 
    } 
    $.rails.showConfirmationDialog(link); 
    return false; 
} 

//User click confirm button 
$.rails.confirmed = function(link){ 
    link.data("confirm", null); 
    Turbolinks.visit(link.attr('href')) 
} 

//Display the confirmation dialog 
$.rails.showConfirmationDialog = function(link){ 
    var message = link.data("confirm"); 
    swal({ 
    title: message, 
    type: 'warning', 
    confirmButtonText: 'Continue', 
    confirmButtonColor: '#0A6EFF', 
    showCancelButton: true 
    }).then(function(e){ 
    $.rails.confirmed(link); 
    }); 
}; 

Answer 5

私は上記の解決策のいずれかを実行することはできませんでした。 （レール5、ターボリンク5）。最後に、どのような私のために働いたことは、次のCoffeeScriptを追加しました

：

ready = -> 
    $('[data-sweet-alert-confirm]').on 'click', sweetAlertConfirm 
$(document).ready(ready) 
$(document).on('page:load', ready)