javascript - How do I continue do things after finish footable initialize? - Stack Overflow

admin管理员组

文章数量:1415100

I use query plugin named fooTable for my data table (/)

Below is my code to initialize my datatable...

jQuery(function($){
  $('.table').footable({
      "paging": { "size": 15 },
      // "toggleColumn": "last",
      "showToggle": false,
      "columns": $.get('/footable/js/columns.json'),
      "rows": $.get('/footable/js/rows.json')
  })
})

My question is how to do something after it finished initialize?

I try

jQuery(function($){
  $('.table').footable({
      "paging": { "size": 15 },
      // "toggleColumn": "last",
      "showToggle": false,
      "columns": $.get('/footable/js/columns.json'),
      "rows": $.get('/footable/js/rows.json')
  })
  .done(function(){
    alert('do something');
  })
})

But it was not working.

I use query plugin named fooTable for my data table (http://fooplugins.github.io/FooTable/)

Below is my code to initialize my datatable...

jQuery(function($){
  $('.table').footable({
      "paging": { "size": 15 },
      // "toggleColumn": "last",
      "showToggle": false,
      "columns": $.get('/footable/js/columns.json'),
      "rows": $.get('/footable/js/rows.json')
  })
})

My question is how to do something after it finished initialize?

I try

jQuery(function($){
  $('.table').footable({
      "paging": { "size": 15 },
      // "toggleColumn": "last",
      "showToggle": false,
      "columns": $.get('/footable/js/columns.json'),
      "rows": $.get('/footable/js/rows.json')
  })
  .done(function(){
    alert('do something');
  })
})

But it was not working.

• javascript
• jquery
• promise
• footable

Share Improve this question Follow edited Oct 2, 2016 at 10:24 Ehsan Sajjad 62.6k1616 gold badges112112 silver badges170170 bronze badges asked Oct 2, 2016 at 10:17 DreamsDreams 8,5161111 gold badges5050 silver badges7373 bronze badges

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 3

You should use the postinit.ft.table event along with the on option as mentioned by @Roamer-1888. (You can click on any option to see a small example of how to use it.)

jQuery(function($) {
    $('.table').footable({
        // your other options
        'on': {
            'postinit.ft.table': function(e, ft) {
                /*
                 * e: The jQuery.Event object for the event.
                 * ft: The instance of the plugin raising the event.
                 */
                // all initialized - do stuff here
            }
        }
    });
});

Alternatively the second argument to the plugin constructor is a ready callback so you can just provide a function to execute once everything is done.

jQuery(function($) {
    $('.table').footable({
        // your options
    }, function(ft){
        /*
         * ft: The instance of the plugin raising the event.
         */
        // all initialized - do stuff
    });
});

use postinit.ft.table event. See http://fooplugins.github.io/FooTable/docs/jsdocs/FooTable.html#.event:Table%2522postinit.ft.table%2522

The postinit.ft.table event is raised after any ponents are initialized but before the table is drawn for the first time. Calling preventDefault on this event will disable the initial drawing of the table.

Also, postdraw.ft.table is what you may want.

About how to use it

I am not very familiar to it. So give it a try. If it doesn't work tell me.

.when('postinit.ft.table', function(e, ft){
    //ok
})

The FooTable documentation is difficult to follow as it's not over-endowed with examples.

I think @turle's suggestion to use the "postinit.ft.table" event is a good one, however I can't see that .when('postinit.ft.table', function(e, ft){ /* do something */ }) is the right syntax.

As far as I can gather from here, event handlers are attached using the "on" option.

Try :

jQuery(function($) {
    $('.table').footable({
        'paging': { 'size': 15 },
        // "toggleColumn': "last",
        'showToggle': false,
        'columns': $.get('/footable/js/columns.json'),
        'rows': $.get('/footable/js/rows.json'),
        'on': {
            'postinit.ft.table': function(e, ft) {
                /*
                 * e: The jQuery.Event object for the event.
                 * ft: The instance of the plugin raising the event.
                 */
                // all initialized - do stuff here
            }
        }
    });
});

Just try 'ready.ft.table'

Something like

jQuery(function($){
    $('.table').footable({
    "on": {
        "ready.ft.table": function(e, ft){
            // bind to the plugin initialize event to do something
        }
    }
   });
});

本文标签： javascriptHow do I continue do things after finish footable initializeStack Overflow