[knockoutjs]独自のイベントを追加する.その１

gistfile1.md

フォームでEnter->イベント実行するサンプル

// knockout初期化前に以下を実行
ko.bindingHandlers.executeOnEnter = {
  init: function (element, valueAccessor, allBindingsAccessor, viewModel) {
    var allBindings = allBindingsAccessor();
    $(element).keypress(function (event) {
      var keyCode = event.which || event.keyCode;
      if (keyCode === 13) {
        allBindings.executeOnEnter.call(viewModel);
      }
    });
  }
};

var viewModel = {
  // hogehoge...

  search: function () {
    // ここで検索を実行するとする
  }
}

ko.applyBindings(viewModel);

bindingHandlersにイベントを追加すると以下のような形で使用できます。

<input data-bind="value: query, valueUpdate: 'afterkeydown', executeOnEnter: search" />

これでフォームにフォーカスした状態でEnterを押すとviewModel.search()が実行されます。
このように、bindingHandlersに独自のイベントを追加できます。