A jQuery Datagrid done right.
jTable JS project
jtable-rails RubyGem
jTable.net source
To Use:<div id="widgets"></div>
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
$("#widgets").jTable({
columns: [
{heading: "Column 1", attribute: "attribute_1"},
{heading: "Column 2", attribute: "attribute_2"},
{heading: "Column 3", attribute: "attribute_3"}
]
})
})
</script>
Options:
identifierAttribute:
Default: "id"
This attribute will be used to identify each record in the table.
singleColumnSearch:
Default: false
Enable single column search for all searchable columns.
perPage:
Default: 25
The default number of items displayed per page.
perPageOptions:
Default: [25,50,100]
The possible selections for the number of items displayed per page.
fullPagination:
Default: true
Show page numbers.
ajaxInterval:
Default: 250
The amount of time (in ms) to wait for more user input before sending server request.
noItemsMsg:
Default: "No Records were found."
The text displayed when no records are returned for the current query.
rowClass:
Default: ""
CSS classes to be added to each records table row. Multiple classes should be space separated.
width:
Default: ""
CSS width to be applied to the container.
indexUrl:
Default: ""
The URL where all query calls are sent.
viewLink:
Default: true
Show the "View" link on each record.
viewUrl:
Default: "?id=:id:"
The URL for the "View" link. The value of a records attributes can be substituted into the URL by using :attribute: (see the "Record URLs" section below).
inlineView:
Default: true
Display the view in the table.
editLink:
Default: true
Show the "Edit" link on each record.
editUrl:
Default: "edit?id=:id:"
The URL for the "Edit" link. The value of a records attributes can be substituted into the URL by using :attribute: (see the "Record URLs" section below).
destroyLink:
Default: true
Show the "Destroy" link on each record.
destroyUrl:
Default: "?id=:id:"
The URL for the "Destroy" link. The value of a records attributes can be substituted into the URL by using :attribute: (see the "Record URLs" section below).
onDestroy:
Default: function(data){}
Function to run when the destroy ajax call returns successful. The destroy ajax call's response is passed into the function.
destroyConfirmMsg:
Default: "Are you sure?"
Message to use in confirmation before the destroy request is sent.
otherActions:
Default: []
An array of objects that are used to generate links thats are added to each records actions.
Action options:
title: This will be the text of the link
All other attributes will be applied as HTML attributes of the link. The value of a records attributes can be substituted into each HTML attribute value by using :attribute: (see the "Record URLs" section below).
columns:
Default: []
An array of objects that are used to for generating the tables columns (see the "Column Options" section below).
Record URLs
For Widget with attributes {id: 37, name: 'Thingy'}
/widgets/:id:?name=:name:
, will produce /widgets/37?name=Thingy
.
true
Enable searching for this column
sortable:
Default: true
Enable sorting for this column
dataType:
Default: "string"
What type of attribute is this column (ex. string
, boolean
).
trueValue:
Default: "True"
The text displayed for a true
value in a boolean
dataType column.
falseValue:
Default: "False"
The text displayed for a false
value in a boolean
dataType column.
columnClass:
Default: ""
CSS classes to be added to this column for each record. Multiple classes should be space separated.
版权声明:
1、该文章(资料)来源于互联网公开信息,我方只是对该内容做点评,所分享的下载地址为原作者公开地址。2、网站不提供资料下载,如需下载请到原作者页面进行下载。