2011-11-09 9 views
3

私は簡単にサーバー側にカメレオンとピラミッドを背にしたajax 'ウィジェット'を作成したいと考えています。ピラミッドとカメレオンのajaxウィジェット

Pyramidは、ウィジェットの作成を容易にする配管コードを提供していますか?

私の現在のアプローチは、レンダラーとしてhome.ptを使用するホームビューです。 home.ptは、ページ構造を定義し、home.ptが満たすためのスロットを提供するマクロbase.ptを使用します。 base.ptは私が書いたログインウィジェットマクロも使用しています(下のaccount_login_widget.pt参照)。

理論的には、これはすばらしい音です...私は多くのページで使用できる再利用可能なログインウィジェットを持っていますが、私の現在のアプローチはあまりうまく機能しません。私のログインウィジェットはレンダラー(サーバーが定義する必要がある)で$ {username}のような変数を使います。私はログインウィジェットとそのレンダリングを可能な限り独立させたい。しかし、現在の私のやり方では、ホームビューコードはログインウィジェットのニーズを認識し、ユーザー名、フォームレンダーおよびその他の変数を辞書に提供する必要があります。確かによくない...

私は、任意の考え

...私は正しい考えに近いんだように感じるが、いくつかのことを行方不明?

base.pt:

<html> 
<head></head> 
<body> 
<div id="container"> 
    <div id="header"> 
     <span metal:use-macro="load: account_login_widget.pt"></span>  
    </div> 
    <div id="middle"> 
     <span metal:define-slot="content"></span> 
    </div> 
    <div id="footer"></div> 
</div> 
</body> 
</html> 

home.pt:

<div metal:use-macro="load: base.pt"> 
<span metal:fill-slot="content"> 
    <div>my stuff</div> 
</span> 
</div> 

account_login_widget.pt:

<span metal:define-macro="account_login_widget"> 
<script type="text/javascript"> 
(function($) { 
    $.fn.my_function = function() { 
     $('#login_form').submit(function(e) { 
      e.preventDefault(); 

      // ajax call 
      $.post(some_url, some_data, function(response) { 
       $('#account_login_widget').html(response); 
      }); 
     }; 
     return this; 
    }; 
})(jQuery); 

// Define the entry point  
$(document).ready(function() { 
    $(document).my_function(); 
}); 
</script> 

<div id="account_login_widget"> 
<div id="login_bar" tal:condition="not username"> 
    ${form_renderer.begin(...)} 
     ... my form ... 
    ${form_renderer.end()} 
    <span tal:condition="login_failed">Login failed</span> 
    <div id="forgot_password_link"><a href="#">Forgot Password?</a></div> 
    <div id="create_account_link"><a href="${signup_url}">Create Account</a></div> 
</div> 
<div tal:condition="username"> 
    Welcome <strong>${username}</strong>! <a href="${logout_url}">Logout</a> 
</div> 
</div> 
</span> 
+0

私の現在の考えは、すべての私のビューが拡張されるBaseViewクラスを持つことです。このBaseViewクラスでは、私のウィジェットのビューオブジェクトを受け取り、すべての変数の依存関係を私のビューが最終的に返されるdictに追加するウィジェットメソッドを追加することができます。 – lostdorje

答えて

8

これに対処する良い方法は、あなたとaccount_login_widgetを関連付けることですそれ自体のビューは次のようになります:

@view_config(name='login_widget', 
      renderer='templates/account_login_widget.pt') 
def login_widget(request): 
    return {'username': ...} 

http://yourapp/login_widgetにアクセスして、ウィジェットのHTMLのみを取得することができます。

残っているのは、ビューを呼び出して結果のHTMLをテンプレートに含めることです。つまり、代わりに:

<span metal:use-macro="load: account_login_widget.pt"></span> 

あなたのようなものをお勧めします:

<span tal:replace="structure render_view('login_widget')"></span> 

render_viewしかし、テンプレートに存在しません。あなた自身でそれを提供する必要があります。完了http://docs.pylonsproject.org/projects/pyramid/dev/narr/hooks.html#beforerender-event

from pyramid.events import subscriber 
from pyramid.events import BeforeRender 
from pyramid.view import render_view_to_response 

@subscriber(BeforeRender) 
def add_render_view_global(event): 
    event['render_view'] = lambda name: render_view_to_response(context, request, name, secure).ubody 

:それは前にこのイベントをレンダリング使用することをお勧めします。このアプローチは、AJAXを使ってウィジェットを動的にロードする必要がある場合にも役立ちます。

+0

ありがとう!この戦略はかなり良いと思って、私を遠くにします。しかし、まだ1つまたは2つのキンクがあります。あなたの提案はトラバーサルの使用を前提としていますか?私はURLディスパッチを使用しています。私が持っている問題は、 '@ view_config'はroute_nameを指定していないため、http:// yourapp/login_widgetが見つかりません(これは私のajax投稿が機能しないことを意味します)。しかし、名前に加えてroute_nameを指定すると、render_view_to_response()の呼び出しはビューに解決されません。 '名前'または 'ルート名'は '@view_config'にのみ指定できますが、両方は指定できないようです。ここで何がうまくいかないの? – lostdorje

+0

2つのview_configsを追加することは、そのトリックを行うようです。結合された述語は、過度に特異的であった。しかし、2つのview_configsを追加することは難しいようです。 @view_config(name = 'account_login_widget'、レンダラー= 'テンプレート/ account_login_widget.pt') @view_config(route_name = 'account_login_widget'、レンダラー= 'テンプレート/ account_login_widget.pt') – lostdorje

+0

あなたはそうです。私の答え( '@ view_config')のビュー設定ビットは、トラバースを想定しています。 url dispatchを使用している場合は、ビューの構成が異なります。 http://docs.pylonsproject.org/projects/pyramid/dev/narr/urldispatch.html#route-configuration –

関連する問題