2012-07-11 13 views
6

まず、backbone.jsフレームワークに完全に統合されたツールを作成したbackbone-formsのおかげで、条件付きフィールドのバックボーンフォーム

私はbackbone-formsプラグインでbackbone.jsを使用していますが、条件付きフィールドを作成する必要があります。

私は次のフォームを持っているとしましょう。 selectで選択された値に従って、textまたはtextareaで1行の入力を表示したい(または表示しない)場合。

<form method="post" action="">     
    <select > 
     <option value="" selected="selected">choose one</option> 
     <option value="1" >line</option> 
     <option value="2" >area</option> 
    </select> 
    <input id="element_1" /> 
    <textarea id="element_2" ></textarea> 
</form> 

このような動作は、バックボーンにデフォルトで実装されていますか?

もしそうでなければ、どうすればjavascriptやbackone-formsで実装できますか?

ありがとうございました。選択した要素にイベントをバインドし、それらをの表示を切り替えることができます

//Pseudo code 
var line = $("element_1"),area = $("element_2"); 
if(selectvalue ==="1"){ 
    line.show(); 
    area.hide(); 
} 
else{ 
    line.hide(); 
    area.show(); 
} 
+0

http://jsfiddle.net/evilcelery/c5QHr/あなたのための –

答えて

2

ありませんが、次のコードを参照してください。他のフォーム要素。

これを試してください:この由来http://jsfiddle.net/shioyama/grn6y/

https://groups.google.com/d/topic/backbone-forms/X5eVdTZWluQ/discussion

+0

おかげで多くのことを

$(function() { //The form var form = new Backbone.Form({ schema: { inputType: { type: 'Select', options: ['line', 'area'] }, line: 'Text', area: 'TextArea' } }).render(); form.fields['area'].$el.hide(); form.on('inputType:change', function(form, editor) { form.fields['line'].$el.toggle(); form.fields['area'].$el.toggle(); }); //Add it to the page $('body').append(form.el); }); 

ここではいくつかのライブのコードがあります回答。 +1!しかし、バックボーンフォームのモデル/スキームにスクリプトを含める方法があるのだろうかと思っていましたか? –

7

:実際implementation.Inデフォルトは完全に自分でも非常に簡単です、

+0

この回答でリンクされているjsfiddleをraw.gitub.comの代わりにrawgit.comを使用するように更新しました。これは適切なMIMEタイプを提供するので、ブラウザはJSをロードしてロードします。 http://jsfiddle.net/grn6y/43/ –

関連する問題