ajax opsダウンロード-Ajax ajax opsソースコードのダウンロード

ajax ops

ウェブサイトデータ

1.0.0

ダウンロード

宣言的なAJAX操作

JavaScriptコードの単一行がない1ページのWebアプリケーションを持つ最も簡単な最速の方法。

ライブデモ

デモを実行します

デモは静的なファイルです。このディレクトリをサーバードキュメントルートに配置するか、ポート8000で簡単なHTTPサーバーを起動する次のコマンドを入力してから、http：// localhost：8000/index.htmlでブラウザを指してください。

python -m SimpleHTTPServer

慣習

el -DOM要素
$target - target DOM要素のjQueryオブジェクト
whereにあるか：ドキュメント全体を意味するclosest 、 inside 、またはdoc
howにすることができますか： prepend 、 append 、またはreplace

宣言的な使用

 < a data-toggle =" ajax-load " href =" /posts/today.json " data-target =" .posts " > my link </ a >
< button type =" button " data-toggle =" ajax-ops " > my button </ a >
< div class =" me " data-refresh-url =" /user/me.json " data-template =" user_info " > </ div >
< div class =" posts " data-template =" posts_titles " > </ div >
< div class =" posts " data-template =" full_posts " > </ div >

定義できます

data-toggle
- ajax-loadフェッチされたテキスト、HTMLコンテンツ、または純粋なデータをターゲットに適用します
- ajax-ops json op-codesを取得します
- ajax-modal *には拡張が必要です
data-target - フェッチしたコンテンツを適用するセレクター
data-url （これはhrefまたはdata-refresh-urlに置き換えることもあります）
data-template - 純粋なデータをレンダリングするために使用されるテンプレート
data-format - text 、 html 、またはjsonにすることができます
data-how - の1つにすることができます： prepend 、 append 、またはreplace

テンプレートはJSONオブジェクトを使用してHTMLを返す関数です任意のテンプレートエンジンを使用できますが、ハンドルバーをお勧めします

参照

ajax_ops.flashmsg({html:, text:, type:info|danger, selector:, base_target:$obj, where:closest|inside|''})
- 「Flashmsg」と呼ばれるテンプレートを使用してテキストまたはhtmlとタイプを使用して、情報または警告ボックスを表示します
- ajax_ops.flashmsg({text:'not found', type:'danger');
- ajax_ops.flashmsg.call(this, {text:'not found', type:'danger', selector:'.modal', where:'closest'});
- self.flashmsg_opts.selectorの影響を受ける.content:first
onsubmit="return ajax_ops.submit_form(this, params);"
- paramsはオプションです
- params.target=$obj
- params.cb=function($target, data){}
ajax_ops.loads({html: CONTENT, text: CONTENT, data: JSON, template: NAME, el: ELEMENT, how: prepend|append|replace})
- HTML、テキスト、またはテンプレートデータを要素にロードするヘルパーを追加または準備するオプションを備えています
ajax_ops.load({el:element, url:, how: prepend|append|replace, selector:, where:closest|inside|, })
ajax_ops.refresh(element|selector, params)
- paramsはオプションです
- params.where
- params.base_element
- ajax_ops.loadを使用して、そのパラメーションをhowように受け入れますか
- 例ajax_ops.refresh('.me')
ajax_ops.exec_ops([ [op1, selector1, params1], [op2, selector2, params2],.. ])
- 操作は可能です
  - remove
  - refresh
  - load
  - attr {set:{k:v}, unset:[k1,k2]}
  - class {add:[], remove:[], toggle[]}
  - ajax_ops.ops['my_opcode']=function(el, params){}を追加することで、より多くの操作で拡張できます。

注：

 // register templates
ajax_ops . templates = Handlebars . templates ;
// nice hack
Handlebars . partials = Handlebars . templates ;
// You might want to disable usual links behavior 
$ ( 'a[data-toggle]' ) . click ( function ( e ) { e . preventDefault ( ) } ) ;