Skip to content

Commit 1c70f52

Browse files
Merge pull request #104 from ricardodovalle/master
Update dataTable Responsive plugins and changed folder structure and fixed REAME
2 parents 2103c8f + 1ce7536 commit 1c70f52

File tree

9 files changed

+799
-511
lines changed

9 files changed

+799
-511
lines changed

CHANGELOG.md

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
## 2.1.10.0.1
2+
3+
Features:
4+
- updated datatables-responsible plugin
5+
- changed folder bootstrap and responsible files folder
6+
7+
## 2.1.10.0.0
8+
9+
Features:
10+
- updated extras plungins and changed names to be compatible with main DataTables plugins.
11+
- updated to jQuery DataTables 1.10.0
12+
13+
14+
## 1.12.2
15+
- last version bundled with jQuery DataTables 1.9.x

Readme.md

+117-75
Original file line numberDiff line numberDiff line change
@@ -1,72 +1,93 @@
1-
# Important
21

3-
The current gem is released without updated plugins. If you encounter any errors, please fork the repository, update the plugin files and send a pull-request.
42

53
# jquery-datatables-rails
4+
[![Gem Version](https://badge.fury.io/rb/jquery-datatables-rails.svg)](http://badge.fury.io/rb/jquery-datatables-rails)
65

76
This gem packages the jQuery [DataTables](http://datatables.net/) plugin for easy use with the Rails 3.1+ asset pipleine.
8-
97
It provides all the basic DataTables files, and a few of the extras.
108

9+
# Important
10+
11+
**The current gem is released without updated plugins.**
12+
**Take care of using the gem from master repository, there are general changes. [CHANGELOG.md](CHANGELOG.md)**
13+
14+
If you encounter any errors, please fork the repository, update the plugin files and send a pull-request.
15+
1116
## General Installation
1217

13-
1. Add to your Gemfile:
18+
**This is README is valid only for 2.1.10.0.1 version**
1419

15-
gem 'jquery-datatables-rails', '~> 2.1.10.0.0'
20+
1 - Add to your Gemfile:
1621

17-
1. Install the gem:
22+
```ruby
23+
gem 'jquery-datatables-rails', '~> 2.1.10.0.1'
24+
```
1825

19-
bundle install
26+
2 - Install the gem:
2027

21-
1. Add the JavaScript to `application.js`:
28+
```bash
29+
bundle install
30+
```
2231

23-
//= require dataTables/jquery.dataTables
32+
3 - Add the JavaScript to `application.js`:
2433

25-
1. Add the stylesheets to `application.css`:
34+
```javascript
35+
//= require dataTables/jquery.dataTables
36+
```
2637

27-
*= require dataTables/jquery.dataTables
38+
4 - Add the stylesheets to `application.css`:
39+
40+
```css
41+
*= require dataTables/jquery.dataTables
42+
```
2843

2944
## Twitter Bootstrap 2 Installation
3045

31-
1. Complete steps 1-3 of the General Installation
32-
1. Add some more JavaScript to `application.js`:
46+
1 - Complete steps 1-3 of the General Installation
47+
2 - Add some more JavaScript to `application.js`:
3348

34-
//= require dataTables/jquery.dataTables.bootstrap
49+
```javascript
50+
//= require dataTables/bootstrap/2/jquery.dataTables.bootstrap
51+
```
3552

36-
1. Add this (and only this) stylesheet to `application.css`:
53+
3 - Add this (and only this) stylesheet to `application.css`:
3754

38-
*= require dataTables/jquery.dataTables.bootstrap
55+
```css
56+
*= require dataTables/bootstrap/2/jquery.dataTables.bootstrap
57+
```
3958

40-
1. Initialize your datatables using one of these options:
59+
4 - Initialize your datatables using one of these options:
4160

4261
```javascript
4362
// For fluid containers
4463
$('.datatable').dataTable({
4564
"sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'span6'i><'span6'p>>",
4665
"sPaginationType": "bootstrap"
4766
});
48-
```
49-
```javascript
67+
5068
// For fixed width containers
5169
$('.datatable').dataTable({
5270
"sDom": "<'row'<'span6'l><'span6'f>r>t<'row'<'span6'i><'span6'p>>",
5371
"sPaginationType": "bootstrap"
5472
});
5573
```
5674

57-
5875
## Twitter Bootstrap 3 Installation
5976

60-
1. Complete steps 1-3 of the General Installation
61-
1. Add some more JavaScript to `application.js`:
77+
1 - Complete steps 1-3 of the General Installation
78+
2 - Add some more JavaScript to `application.js`:
6279

63-
//= require dataTables/jquery.dataTables.bootstrap3
80+
```javascript
81+
//= require dataTables/bootstrap/3/jquery.dataTables.bootstrap
82+
```
6483

65-
1. Add this (and only this) stylesheet to `application.css`:
84+
3 - Add this (and only this) stylesheet to `application.css`:
6685

67-
*= require dataTables/jquery.dataTables.bootstrap3
86+
```css
87+
*= require dataTables/bootstrap/3jquery.dataTables.bootstrap3
88+
```
6889

69-
1. Initialize your datatables using these option:
90+
4 - Initialize your datatables using these option:
7091

7192
```javascript
7293
$('.datatable').dataTable({
@@ -77,17 +98,21 @@ $('.datatable').dataTable({
7798

7899
## Zurb Foundation Installation
79100

80-
1. Complete steps 1-3 of the General Installation
101+
1 - Complete steps 1-3 of the General Installation
81102

82-
1. Add some more JavaScript to `application.js`:
103+
2 - Add some more JavaScript to `application.js`:
83104

84-
//= require dataTables/jquery.dataTables.foundation
105+
```javascript
106+
//= require dataTables/jquery.dataTables.foundation
107+
```
85108

86-
1. Add this (and only this) stylesheet to `application.css`:
109+
3 - Add this (and only this) stylesheet to `application.css`:
87110

88-
*= require dataTables/jquery.dataTables.foundation
111+
```css
112+
*= require dataTables/jquery.dataTables.foundation
113+
```
89114

90-
1. Initialize your datatables using these option:
115+
4 - Initialize your datatables using these option:
91116

92117
```javascript
93118
$('.datatable').dataTable({
@@ -97,50 +122,54 @@ $('.datatable').dataTable({
97122

98123
## Responsive Installation
99124

100-
1. Complete steps 1-3 of the General Installation
101-
1. Add the lodash gem to your application:
125+
1 - Complete steps 1-3 of the General Installation
126+
2 - Add the lodash gem to your application:
102127

103-
```
104-
gem 'lodash-rails'
105-
```
128+
```ruby
129+
gem 'lodash-rails'
130+
```
106131

107-
1. Add some more JavaScript to `application.js`:
132+
3 - Add some more JavaScript to `application.js`:
108133

109-
//= require dataTables/jquery.dataTables.bootstrap3
110-
//= require dataTables/jquery.dataTables.responsive
134+
```javascript
135+
//= require dataTables/bootstrap/3/jquery.dataTables.bootstrap
136+
//= require dataTables/extras/dataTables.responsive
137+
```
111138

112-
1. Add this (and only this) stylesheet to `application.css`:
139+
4 - Add this (and only this) stylesheet to `application.css`:
113140

114-
*= require dataTables/jquery.dataTables.bootstrap3
115-
*= require dataTables/jquery.dataTables.responsive
141+
```css
142+
*= require dataTables/bootstrap/3/jquery.dataTables.bootstrap
143+
*= require dataTables/extras/dataTables.responsive
144+
```
116145

117-
1. Initialize your datatables using:
146+
5 - Initialize your datatables using:
118147

119148
```coffeescript
120-
responsiveHelper = undefined
121-
breakpointDefinition =
122-
tablet: 1024
123-
phone: 480
124-
125-
tableContainer = $('.datatable')
126-
tableContainer.dataTable
127-
128-
sPaginationType: "bootstrap"
129-
# Setup for responsive datatables helper.
130-
bAutoWidth: false
131-
bStateSave: false
132-
133-
fnPreDrawCallback: ->
134-
responsiveHelper = new ResponsiveDatatablesHelper(tableContainer, breakpointDefinition) unless responsiveHelper
135-
136-
fnRowCallback: (nRow, aData, iDisplayIndex, iDisplayIndexFull) ->
137-
responsiveHelper.createExpandIcon nRow
138-
139-
fnDrawCallback: (oSettings) ->
140-
responsiveHelper.respond()
149+
responsiveHelper = undefined
150+
breakpointDefinition =
151+
tablet: 1024
152+
phone: 480
153+
154+
tableElement = $("#example")
155+
tableElement.dataTable
156+
autoWidth: false
157+
preDrawCallback: ->
158+
159+
# Initialize the responsive datatables helper once.
160+
responsiveHelper = new ResponsiveDatatablesHelper(tableElement, breakpointDefinition) unless responsiveHelper
161+
return
162+
163+
rowCallback: (nRow) ->
164+
responsiveHelper.createExpandIcon nRow
165+
return
166+
167+
drawCallback: (oSettings) ->
168+
responsiveHelper.respond()
169+
return
141170
```
142171

143-
1. To use see the author of responsive files and follow the instructions as described on [datatables-responsive]
172+
6 - To use see the author of responsive files and follow the instructions as described on [datatables-responsive]
144173

145174
## Plugins
146175

@@ -160,7 +189,7 @@ These files can be found in the [assets directory][assets].
160189

161190
## Extras
162191

163-
Only the official extras are available:
192+
Official extras are available:
164193

165194
* AutoFill
166195
* ColReorder
@@ -171,26 +200,38 @@ Only the official extras are available:
171200
* Scroller
172201
* TableTools
173202

174-
To add an extra into your application, add its JS file to `application.js` using the following pattern:
203+
Unofficial extra is available:
204+
* Responsive
175205

176-
//= require dataTables/extras/[ExtraName]
206+
### How to use Extras
207+
1 - To add an extra into your application, add its JS file to `application.js` using the following pattern:
208+
209+
```javascript
210+
//= require dataTables/extras/[ExtraName]
211+
```
177212

178-
Additionally, you may need to add any associated CSS files. For instance the TableTools extra requires
213+
2 - Additionally, you may need to add any associated CSS files. For instance the TableTools extra requires
179214
you to add the following two lines to your `application.css` file:
180215

181-
*= require dataTables/extras/dataTables.tableTools
182-
*= require dataTables/extras/TableTools_JUI
216+
```css
217+
*= require dataTables/extras/dataTables.tableTools
218+
*= require dataTables/extras/TableTools_JUI
219+
```
183220

184-
TableTools also requires this to be included in 'application.js':
221+
3 - TableTools also requires this to be included in 'application.js':
185222

186-
//= require dataTables/extras/ZeroClipboard.js
223+
```javascript
224+
//= require dataTables/extras/ZeroClipboard.js
225+
```
187226

188227
Make sure to also add it's initialization as described on [datatables extras' site][datatables_extras]
189228

190-
## Articles
229+
## Articles and Extras
191230

192231
[RailsCast #340 DataTables] Apr 11, 2012.
193232

233+
[ajax-datatables-rails] a wrapper around datatable's ajax methods that allow synchronization with server-side
234+
194235
## Thanks
195236

196237
Thanks to Comanche for responsive support files [datatables-responsive]
@@ -199,3 +240,4 @@ Thanks to Comanche for responsive support files [datatables-responsive]
199240
[datatables_extras]: http://datatables.net/extras/
200241
[datatables-responsive]: https://github.com/Comanche/datatables-responsive
201242
[RailsCast #340 DataTables]: http://railscasts.com/episodes/340-datatables
243+
[ajax-datatables-rails]: https://github.com/antillas21/ajax-datatables-rails

0 commit comments

Comments
 (0)