3

handsontableのロード/初期化 が完了した後、いくつかのDOM操作を実行しようとしています。

handsontableには、ビルドが完了した後にトリガーされるイベントがありますか？

4

2 に答える 2

10

このための組み込みイベントがあるため、コードを変更する必要はありません。

afterInit ()-Handsontableインスタンスが開始された後にコールバックが発生しました。

afterLoadData ()-新しいデータが（loadDataメソッドによって）データソース配列にロードされた後にコールバックが発生します。

afterRender ()-Handsontableテーブルがレンダリングされた後にコールバックが発生しました。

イベントの完全なリストについては、こちらをご覧ください

于 2013-06-27T13:17:36.127 に答える
4

私は彼らのgithubでそのようなコールバックを見つけることができません、そして私はあなたが本当にそれを必要としないと思います。を呼び出した後、DOMを変更するだけです$("#container").handsontable()。ajaxをロードしていることが原因の場合は、完了時に呼び出すだけです。ここで彼らの例に従ってください。
if (source === 'loadData') {...}

ただし、問題が解決しない場合は、ダウンロードしたバージョンに応じて、ソースコードを詳しく調べて、自分で調整することができます。これは非常に単純なためです。ハンズオンテーブルがajaxをロードせずに初期化を完了した後、コールバックを要求していると想定しています。

私に従ってください、すぐに飛び込みましょう。

の変更jquery.handsontable.full.js

右、これは、設定の直後に、オンライン2165で次のように表示されます。

$.fn.handsontable = function (action) {...};

そこでは、すべてが初期化されていることがわかります。幸い、開発者は自分のものに適切にコメントしてラベルを付けることができたので、その中の行を見てみましょう。

オンライン2182でそれは言う：

instance = new Handsontable.Core($this, currentSettings);

それらがコアなものを初期化する場所があります、少なくともそれは私が名前から識別できるものです、それでこの行の後にコールバックを追加することはコールバックとして十分であるはずですafterInit。

したがって、必要なのは、ユーザーが提供する設定にコールバックのチェックを追加してから呼び出すことだけです。2184インスタンス化後なので、このコールバックを行の後に追加することにしました。
コールバックをどこに置くか、それが関数内にあるべきかどうかCore、設定が関数であるかどうかを確認する方法などについて議論することができますが、これで作業が完了し、この方法の方が簡単です。

だから、オンライン2182 

[...] 
instance = new Handsontable.Core($this, currentSettings); //<---- line 2182
$this.data("handsontable", instance);
instance.init(); //<---- line 2184

if(typeof(currentSettings.afterInit) == "function"){
    currentSettings.afterInit();
}
[...]

そこで、私たちがする必要があるのはそれだけです！これで、コールバック関数を使用してハンズオンテーブルを作成できますafterInit。

$("#container").handsontable({
    startRows: 8,
    startCols: 6,
    rowHeaders: true,
    colHeaders: true,
    minSpareRows: 1,
    contextMenu: true,
    afterInit: function(){
        console.log("Handsontable initialized!");
    }
});

ソースコードをいじくりまわすことを恐れないでください、あなたはたくさん学ぶでしょう！

完全に変更されたコード

2165行から関数を2203含むまでの完全に変更されたコードは次のとおりです。$.fn.handsontable

$.fn.handsontable = function (action) {
  var i, ilen, args, output = [], userSettings;
  if (typeof action !== 'string') { //init
    userSettings = action || {};
    return this.each(function () {
      var $this = $(this);
      if ($this.data("handsontable")) {
        instance = $this.data("handsontable");
        instance.updateSettings(userSettings);
      }
      else {
        var currentSettings = $.extend(true, {}, settings), instance;
        for (i in userSettings) {
          if (userSettings.hasOwnProperty(i)) {
            currentSettings[i] = userSettings[i];
          }
        }
        instance = new Handsontable.Core($this, currentSettings);
        $this.data("handsontable", instance);
        instance.init();
        if(typeof(currentSettings.afterInit) == "function"){
            currentSettings.afterInit();
        }
      }
    });
  }
  else {
    args = [];
    if (arguments.length > 1) {
      for (i = 1, ilen = arguments.length; i < ilen; i++) {
        args.push(arguments[i]);
      }
    }
    this.each(function () {
      output = $(this).data("handsontable")[action].apply(this, args);
    });
    return output;
  }
};
于 2012-12-19T17:13:58.603 に答える