1

Rails UJSを使用してコンテンツをライトボックスに挿入する最良の方法を見つけようとしています。次のようなリンクがあります。

<%= link_to "login", login_path, :remote => true %>

次のようにhtmlを生成します。

<a data-remote="true" href="/login">login</a>

これはすべてうまく機能し、ビューファイルを作成しました。user_sessions/new.js.erbこれも問題なくロードされますが、html をページに追加するための推奨される方法は何ですか? 非jsページにすでにログインフォームがあるように、その部分をページにロードすることはできませんか?

どんなアイデアでも大歓迎です。

4

2 に答える 2

3

あなたが求めていることを完全に理解しているかどうかはわかりませんが、一般的には、次のように HTML のフラグメントを既存のコンテナーに詰め込むことができます。

$('div#yourDiv').html(blob_of_HTML);

以下を使用して、サーバー側のアクションから HTML のフラグメントをロードできます。

$('div#yourDiv').load(yourURL, function() {
  // stuff to do when the content has been loaded
});

完全なページがあり、その一部だけを別のページにロードしたい場合は、これを試すことができます:

$('div#yourDiv').load(yourUrl + ' #something', function() {
  // stuff to do ...
});

これにより、ロードされたページ全体のコンテンツを取得し、そのページ全体で「#something」を探し、ページのその部分のみをターゲット コンテナーにロードするように jQuery に指示します。

于 2010-06-12T23:19:13.433 に答える
1

私はこれをやってしまいました.ujsに依存するjQueryプラグインのようなものです:

これは私の中でuser_sessions/new.js.erb

$(this).modal("<%= escape_javascript(render 'form') %>");

次に、jQueryプラグインを次のように作成しました。

jQuery.fn.modal = function(content) {
  var modal_screen = $(document.createElement('div')).addClass("modal_screen");

  var modal_container = $(document.createElement('div')).addClass("modal_container");
  var modal_outer_border = $(document.createElement('div')).addClass("modal_outer_border").appendTo(modal_container);
  var modal_inner_border = $(document.createElement('div')).addClass("modal_inner_border").appendTo(modal_outer_border);
  var modal_contents = $(document.createElement('div')).addClass("modal_contents").appendTo(modal_inner_border);

  $(modal_screen).appendTo('body');
  $(modal_container).appendTo('body');
  $(modal_contents).append(content);
}

そして、私はそれがたくさんのコンテナであることを知っていますが、モーダルウィンドウを垂直方向に中央に配置し、素敵な二重境界線の状況を提供するためにこれを行う必要がありました.

この人たちについてどう思うか教えてください!


$.modal("<%= escape_javascript(render 'form') %>");おそらく、追加の質問は、jQuery プラグインを作成するときに、オブジェクトなしでプラグインを呼び出すだけthisで、jQuery オブジェクト自体でメソッドを呼び出すことができるようにするにはどうすればよいでしょうか?

于 2010-06-12T23:33:45.193 に答える