0

バックエンドでDjangoを使用し、フロントを構築するためにjQuery UI/Backboneを使用するアプリを構築しています。Djangoで生成されたフォームを、バックボーンビュー内のjQuery.get（）を含むページにプルしています。その部分は正常に機能しますが、jQuery UIのものをフォームに追加したいと思います（たとえば、日付ピッカー、ダイアログを開くボタンなど）。したがって、関連するコードは次のとおりです。

var InstructionForm = Backbone.View.extend({
  render: function() {
    var that = this;
    $.get(
      '/tlstats/instruction/new/',
      function(data) {
        var elements = $(data);
        $('#id_date', elements).datepicker();
        that.$el.html(elements.html());
      }
    };
    return this;
  }
});

パス/tlstats/ Instruction / new /は、Djangoが生成した形式のHTMLフラグメントを返します。何が起こっているのかというと、input＃id_dateがhasDatePickerクラスを追加し、datepicker divが<body>要素に追加されています（両方とも期待どおり）が、input＃id_dateをクリックしても何も起こりません。日付ピッカーウィジェットは表示されず、コンソールにエラーはありません。なぜこれが起こっているのでしょうか？

また、ややトピックから外れていますが、この問題を自分で理解しようとすると、人々が次のようなことをしているいくつかのコード例に出くわしました。

$(function() {
  $('#dialog').dialog(...);
  ...
});

じゃあ後で：

var MyView = Backbone.View.extend({
  initialize(): function() {
    this.el = $('#dialog');
  }
});

これはBackboneの目的を打ち破り、すべてのjQuery UIコードをBackbone構造の外側に完全に持つことではありませんか？それとも、バックボーンの役割を誤解していますか？

ありがとう。

4

1 に答える 1

1

私はあなたの問題がここにあると思います：

$('#id_date', elements).datepicker();
that.$el.html(elements.html());

最初に日付ピッカーをでバインドし、次にHTML文字列に.datepicker()変換してすべてを破棄します。elements

that.$el.html(elements.html());

その文字列をに入れます$el。あなたが言うときe.html()、あなたはイベントバインディングと他のすべてでラップされたDOMオブジェクトを取り、文字列の単純なHTMLに変換します、そのプロセスは単純なHTMLではないすべて（イベントバインディングなど）を捨てます。

.html()jQueryオブジェクト自体を指定します。

$('#id_date', elements).datepicker();
that.$el.html(elements);

または、HTMLを追加した後に日付ピッカーをバインドします。

that.$el.html(elements);
that.$('#id_date').datepicker();
于 2012-07-25T19:27:27.637 に答える