Skip to content

Vuetable Methods

Rati Wannapanop edited this page Apr 26, 2017 · 7 revisions

Vuetable - Methods

# normalizeFields

  • params: none

  • description

    Parse fields definition to field objects usable by Vuetable. This method is called automatically "once" during the created life cycle hook.

    If you dynamically change the fields prop, you will need to manually call normalizeFields method to properly parse the fields definition as Vuetable will not be able to pickup the change and will not work as expected.

# setData

  • params:

    • data: Array
  • description

    You can use this method to manually set the data that Vuetable will be used for table rendering instead of requesting data from the server.

    Note The method will automatically set api-mode to false.

# reload

  • params: none

  • description

    Force Vuetable to reload the data from the server using the current value of parameters. However, the page number will not be reset.

# refresh

  • params: none

  • description

    Force Vuetable to reload the data from the server and the page number will be reset to 1. It's the same as using goto-page page event to load page 1.

# resetData

  • params: none

  • description

    This will set tableData and tablePagination to null resulting in not displaying any data in the table (as there is no data to display). This method will also fire vuetable:data-reset event which can be captured to force update pagination component accordingly.

# transform

  • params:

    • data: Array
  • must return: Array

  • description

    In case, the data returned from the server is not in the format that Vuetable expected, you can define transform method on the main Vue instance and Vuetable will automatically called it with the data from the server.

    The transform method must return the array of data that Vuetable expected.

    See also: Data Format (JSON)

# gotoPreviousPage

  • params: none

  • description

    ** API Mode Only **

    This method will automatically request the previous page of data from the server.

# gotoNextPage

  • params: none

  • description

    ** API Mode Only **

    This method will automatically request the next page of data from the server.

# gotoPage

  • params:

    • page: Number
  • description

    ** API Mode Only **

    This method will automatically request the specified page of data from the server.

# changePage

  • params:

    • page: String, Number
  • description

    ** API Mode Only **

    This method will automatically request the specified page of data from the server. You can either pass in the page number, or 'prev' string for previous page, or 'next' string for next page.

# isVisibleDetailRow

  • params:

    • rowId: RowIdentifier
  • description

    Determine if the detail row of the given row identifier is marked as visible.

    See also: Row Identifier

# showDetailRow

  • params:

    • rowId: RowIdentifier
  • description

    Force displaying the detail row of the given row.

    See also: Row Identifier

# hideDetailRow

  • params:

    • rowId: RowIdentifier
  • description

    Force hiding the detail row of the given row.

    See also: Row Identifier

# toggleDetailRow

  • params:

    • rowId: RowIdentifier
  • description

    Toggle the display of the detail row of the given row.

    See also: Row Identifier

# showField

  • params:

    • index: Number
  • description

    Force displaying the specified field.

# hideField

  • params:

    • index: Number
  • description

    Force hiding the specified field.

# toggleField

  • params:

    • index: Number
  • description

    Toggle display of the specified field.