-
Notifications
You must be signed in to change notification settings - Fork 0
api
Franky Van Liedekerke edited this page Dec 4, 2025
·
15 revisions
fTable is used to develop AJAX-based CRUD (Create/Retrieve/Update/Delete) tables without coding HTML and JavaScript. The only required HTML tag is a simple div element in your page:
<div id="MyTableContainer"></div>To initialize a fTable instance, you can call the ftable method in the ready event of the document:
<script type="text/javascript">
$(document).ready(function () {
$('#MyTableContainer').ftable({
// General options come here
actions: {
// Action definitions come here
},
fields: {
// Field definitions come here
}
// Event handlers...
});
});
</script>fTable has three types of options:
- General options: Define the general behavior of the fTable instance.
- Actions: Define how to communicate from the client to the server.
- Fields: Define the structure of the record, create/edit forms, and table. A row in the table is called a "record," which must have fields like a relational database table.
NOTE: When you create a fTable instance, a table is created, but no data is loaded into the table. Use the
loadmethod to load data. See the Getting Started document for detailed usage.
- animationsEnabled
- closeOnOverlayClick
- columnResizable
- columnSelectable
- csvExport
- defaultDateFormat
- defaultSorting
- deleteConfirmation
- forcePost
- gotoPageArea
- listCache
- listQueryParams
- loadingAnimationDelay
- logLevel
- messages
- multiselect
- multiSorting
- multiSortingCtrlKey
- openChildAsAccordion
- paging
- pageList
- pageSize
- pageSizes
- printTable
- pageSizeChangeArea
- saveUserPreferences
- saveUserPreferencesMethod
- searchDebounceMs
- selecting
- selectingCheckboxes
- selectOnRowClick
- sorting
- sortingInfoSelector
- tableId
- tableReset
- title
- toolbar
- toolbarreset
- toolbarsearch
- columnResizable
- create
- edit
- dateFormat
- dateLocale
- defaultValue
- dependsOn
- display
- explain
- input
- inputAttributes
- inputClass
- inputTitle
- key
- list
- listClass
- listClassEntry
- listClassHeader
- listEscapeHTML
- options
- placeholder
- searchable
- searchDateFormat
- searchType
- sorting
- title
- type
- visibility
- width
3. Actions
4. Methods
Static methods:
Instance methods:
- addRecordToTable
- closeChildTable
- deleteRecord
- deleteRows
- deselectRow
- destroy
- editRecord
- editRecordByKey
- editRecordViaAjax
- getRowByKey
- getSelectedRows
- getSortingInfo
- hideColumn
- load
- openChildTable
- recalcColumnWidths
- recalcColumnWidthsOnce
- reload
- selectRow
- setColumnVisibility
- showAddRecordForm
- showColumn
- toggleRowSelection
- updateRecordInTable
5. Events
6. Localization
See the files in the localization subdir to know the format