2016-05-02 9 views
0

データ確認のためのデフォルトのブラウザオプションを置き換えるために、カスタムのポップアップダイアログが必要でした。メソッドのデータ確認のためのオンラインの例はたくさんありましたが、通常のリンクでも機能するようにマイナーなカスタマイズを行う必要がありました。例えば、私は、ダイアログをレンダリングするでしょうリンクの2種類があるRailsのカスタムJqueryダイアログによるリンクの確認の処理

:私はオンライン調査した情報で

<%= link_to(scoreboard_team_path(@scoreboard, team), remote: true, method: :delete, data: {confirm: "Are you sure you want to delete?"})%> 

<%= link_to "Clear Teams", deleteteams_scoreboard_path(@scoreboard), class: "btn btn-primary reset-link", :data => {:confirm => "Are you absolutely sure you want to delete all teams?"} %> 

が、私はのためのアプリケーション全体の確認のため、次のjqueryのコードが出ていますこれらのタイプのリンク:

$(document).ready(function(){ 

    $.rails.allowAction = function(link) { 
      if (!link.attr('data-confirm')) { 
      return true; 
      } 
      $.rails.showConfirmDialog(link); 
      return false; 
    }; 

    $.rails.confirmed = function(link) { 
     link.removeAttr('data-confirm'); 
     if(link.hasClass("reset-link")){ 
     window.location.replace("" + link.context.href + ""); 
     } else { 
      return link.trigger('click.rails'); 
     } 
     }; 


    $.rails.showConfirmDialog = function(link) { 
      var html; 
      var message = link.data("confirm"); 
      html = "<div id=\"dialog-confirm\" title=\"Warning!\">\n <p>"+message+"</p>\n</div>"; 
      return $(html).dialog({ 
      resizable: false, 
      modal: true, 
      buttons: { 
       OK: function() { 
       $.rails.confirmed(link); 
       return $(this).dialog("close"); 
       }, 
       Cancel: function() { 
       return $(this).dialog("close"); 
       } 
      } 
      }); 
     }; 
}); 

私の問題は、記事の著者が何が起こっているかについてよく説明していないことです。

は、そのために私の質問は以下のとおりです。

次のコード何を意味するかをん:ラインwindow.location.replace("" + link.context.href + "");

if (!link.attr('data-confirm')) { 
      return true; 
      } 

link.context.hrefは何を意味するのでしょうか?

答えて

1
if (!link.attr('data-confirm')) { 
    return true; 
} 

基本的には、(jQueryの)DOM要素に渡されたのdata-confirm属性値をチェックし、それが存在しない場合、関数はtrueを返します。ラインwindow.location.replace("" + link.context.href + "");


link.context.hrefは何を意味するのでしょうか?

$().contextは推奨されず、should not be usedです。つまり、jQueryセレクタの元のコンテキストを返します。あなたのケースでは

$('.link'     ).context; // Return `document` object 
 
$('.link', $('#wrapper')[0]).context; // Return `#wrapper` object
<div id="wrapper"> 
 
    <a href="#some-link" class="link">Click me</a> 
 
</div>

が、それはlink.context.hrefは、DOM要素を取得し、そのhref属性にアクセスしているように思える:

の例では、あなたのアイデアを与える必要があります。代わりにlink.attr('href')のような何かをしている可能性があります。しかし、著者がそれをそういう形で書くことに決めたのであれば、いくつかの端緒があったと思います。

+0

完璧!私が従っていたガイドはかなり古いものです。先端に感謝します。 'link.attr( 'href')'は自分のコードで動作するので、それを変更しました。 – kpaul

関連する問題