0

バックボーンコレクションから入力される選択ボックスがあります。

class Prog.Views.History extends Backbone.View

  template: JST['backbone/templates/shapes/history']
  tagName: "option"


  initialize: ->
    @model.bind('change:formatted', @render, this);

  render: ->
   $(@el).html(@template(history: @model))
   this

バックボーン/テンプレート/形状/履歴

<option value="<%=history.get('origin')%>"><%=history.get('origin')%></option>

これはうまく機能し、すべての正しいデータが選択ボックスに表示されますが、最初のオプションは「選択してください」、つまりプレースホルダーです...「プレースホルダー」というレコードをコレクションに挿入することを考えましたしかし、それは道のりのようです。

これは私がそれを呼ぶ方法です：

  appdenDropdown: (history) ->
    console.log("append trigger")
    view = new Prog.Views.History(model: history)
    $('select#history').append(view.render().el)

これをデフォルトにするにはどうすればよいですか？

4

1 に答える 1

1

まず、この実装が適切に機能するとは思わないので、レンダリングの結果は次のようになると思います。

<option><option value="the_origin">the_origin</option></option>

ダブルオプションへの注意。

適切な解決策は次のとおりです。

class Prog.Views.History extends Backbone.View
  tagName: "option"

  initialize: ->
    @model.bind('change:formatted', @render, this);

  render: ->
    $(@el).attr( "value", this.get( "origin" ) )
    $(@el).html( this.get("origin") )
    this

ここにテンプレートは必要ありません。

「選択してください」オプションの追加について。

HTMLに直接ハードコーディングされた「選択してください」オプション要素をselect要素に含めます。

次に、 selectthis.$el.html()にデータを入力するために使用しませんが、これは実際のデフォルトオプションを尊重し、その後に動的要素を追加します。this.$el.append()

更新しました

たとえば、select要素が次のようになっている場合：

<select id="history"></select>

次のように表示します。

<select id="history">
  <option value="0" selected="selected">Please select...</option>
</select>

動的オプション要素appendを追加するために使用しているため、プレースホルダーオプション要素は残ります。

于 2012-08-07T19:55:58.680 に答える