|
1 | 1 | /* |
2 | | - megridview v0.3.1 |
| 2 | + megridview v0.3.2 |
3 | 3 | Developed By Mesut Talebi ([email protected]) |
4 | 4 | Open Source And no licence :) free to use |
5 | 5 | */ |
6 | | -(function ($) { |
7 | | - $.fn.meGridView = function () { |
| 6 | +(function ($) { |
| 7 | + $.fn.meGridView = function (options) { |
8 | 8 |
|
9 | 9 | var $gridviewObject = new Object(); |
10 | 10 |
|
11 | | - var options = { |
12 | | - ShowPageOptions : true, |
13 | | - ItemsPerPage : 10, |
14 | | - PageOptions: [10, 20, 50, 100], |
15 | | - PageSizeText: "Page Size", |
16 | | - PageText: "Page" |
17 | | - } |
18 | | - |
| 11 | + var defaults = $.extend({}, $.fn.meGridView.defaults, options); |
| 12 | + |
19 | 13 | //A function to Automatically insert page options |
20 | 14 | var writePagerHtml = function (obj) { |
21 | 15 | var pagerHtml = |
22 | 16 | '<!-- Pager Left-->' + |
23 | 17 | '<div class="col-sm-6 col-xs-12">' + |
24 | 18 | '<!-- Page Size Area -->' + |
25 | 19 | '<div class="gridview-itemization">'; |
26 | | - if (options.ShowPageOptions === true) { |
27 | | - pagerHtml += '<span>Page Size</span>' + |
| 20 | + if (defaults.ShowPageOptions === true) { |
| 21 | + pagerHtml += '<span> ' + defaults.PageSizeText + ' </span>' + |
28 | 22 | '<div class="btn-group selectlist dropup" data-resize="auto">' + |
29 | 23 | '<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">' + |
30 | | - '<span class="selected-label">' + options.ItemsPerPage + '</span>' + |
| 24 | + '<span class="selected-label"> ' + defaults.ItemsPerPage + ' </span>' + |
31 | 25 | '<span class="caret"></span>' + |
32 | | - '<span class="sr-only">' + options.PageSizeText + ' </span>' + |
| 26 | + '<span class="sr-only"> ' + defaults.PageSizeText + ' </span>' + |
33 | 27 | '</button>' + |
34 | 28 | '<ul class="dropdown-menu" role="menu">'; |
35 | | - for (var i = 0; i < options.PageOptions.length ; i++) { |
36 | | - pagerHtml += '<li data-value="' + options.PageOptions[i] + '"><a href="#">' + options.PageOptions[i] + '</a></li>'; |
| 29 | + for (var i = 0; i < defaults.PageOptions.length ; i++) { |
| 30 | + pagerHtml += '<li data-value="' + defaults.PageOptions[i] + '"><a href="#">' + defaults.PageOptions[i] + '</a></li>'; |
37 | 31 | } |
38 | 32 | pagerHtml += '</ul>' + |
39 | 33 | '<input class="hidden hidden-field" name="itemsPerPage" readonly="readonly" aria-hidden="true" type="text">' + |
40 | 34 | '</div>'; |
41 | 35 | } |
42 | | - pagerHtml += '<span>' + |
43 | | - '<span class="gridview-start">1</span> - <span class="gridview-end">' + options.ItemsPerPage + '</span>' + |
| 36 | + pagerHtml += '<span> ' + |
| 37 | + '<span class="gridview-start">1</span> - <span class="gridview-end">' + defaults.ItemsPerPage + '</span>' + |
44 | 38 | '(<span class="gridview-count">0</span>)' + |
45 | 39 | '</span>' + |
46 | 40 | '</div>' + |
|
54 | 48 | '<span class="fa fa-chevron-left"></span>' + |
55 | 49 | '<span class="sr-only">Previous Page</span>' + |
56 | 50 | '</button>' + |
57 | | - '<label class="page-label" id="myPageLabel"> ' + options.PageText + ' </label>' + |
| 51 | + '<label class="page-label" id="myPageLabel"> ' + defaults.PageText + ' </label>' + |
58 | 52 | '<input type="number" class="form-control gridview-secondaryPaging active" aria-labelledby="myPageLabel" value="1">' + |
59 | 53 | '<span>' + |
60 | | - '/ <span class="gridview-pages">0</span>' + |
61 | | - '</span>' + |
| 54 | + ' / <span class="gridview-pages">0</span>' + |
| 55 | + '</span> ' + |
62 | 56 | '<button type="button" class="btn btn-default btn-sm gridview-next">' + |
63 | 57 | '<span class="fa fa-chevron-right"></span>' + |
64 | 58 | '<span class="sr-only">Next Page</span>' + |
|
76 | 70 |
|
77 | 71 | //The gridview object that we are working on it |
78 | 72 | var gridview = this; |
79 | | - |
| 73 | + |
80 | 74 | //Inserts Pager Html |
81 | 75 | writePagerHtml(gridview); |
82 | 76 |
|
|
85 | 79 | LoadFirstPage(gridview); |
86 | 80 |
|
87 | 81 | //Btn gridview-next click event |
88 | | - $(gridview).on('click', 'button.gridview-next', function () { |
| 82 | + $(gridview).on('click', 'button.gridview-next', function () { |
89 | 83 | if ($('button.gridview-next', gridview).is(':enabled')) { |
90 | 84 | NextPage(gridview); |
91 | 85 | } |
|
107 | 101 | var size = $($li).data('value'); |
108 | 102 | var pageSize = $gridviewObject.ItemsPerPage; |
109 | 103 | if (size != pageSize) |
110 | | - ChangePageSize(size, gridview); |
| 104 | + ChangePageSize(size, gridview); |
111 | 105 | }); |
112 | 106 |
|
113 | 107 | //Pressing Enter event for page number input |
|
130 | 124 | }); |
131 | 125 |
|
132 | 126 | //Searching data |
133 | | - $(gridview).on('click', '.search button', function() { |
| 127 | + $(gridview).on('click', '.search button', function () { |
134 | 128 | var $searchTerm = $('.search input[type=search]', gridview).val(); |
135 | 129 |
|
136 | 130 | if ($searchTerm.length >= 0) { |
|
179 | 173 | var obj = $('.active', p)[0].nodeName.toLowerCase(); |
180 | 174 |
|
181 | 175 | $(obj + '.active', p).removeClass('active'); |
182 | | - $(this).parents(obj).addClass('active'); |
| 176 | + $(this).parents(obj).addClass('active'); |
183 | 177 | }); |
184 | 178 | }); |
185 | 179 |
|
|
221 | 215 | LoadData(gridview); |
222 | 216 | } |
223 | 217 | } |
224 | | - |
| 218 | + |
225 | 219 | function Init(obj) { |
226 | 220 | //add icon place holder for sortable fields |
227 | 221 | $('th.sortable', obj).append('<span class="pull-right fa"></span>'); |
|
241 | 235 | } |
242 | 236 |
|
243 | 237 | function LoadData(obj) { |
244 | | - |
| 238 | + |
245 | 239 | var data = { |
246 | 240 | "CurrentPage": $gridviewObject.CurrentPage, |
247 | 241 | "ItemsPerPage": $gridviewObject.ItemsPerPage, |
248 | 242 | "SearchTerm": $gridviewObject.SearchTerm, |
249 | 243 | "Sort": $gridviewObject.Sort, |
250 | 244 | "Filters": $gridviewObject.Filters |
251 | 245 | }; |
252 | | - |
| 246 | + |
253 | 247 | GetData(data, obj); |
254 | 248 | } |
255 | 249 |
|
|
406 | 400 | $gridviewObject.CurrentPage = 1; |
407 | 401 | $gridviewObject.ItemsPerPage = $gridviewObject.PageOptions[0]; |
408 | 402 | LoadData(obj); |
409 | | - } |
410 | | - }; |
| 403 | + } |
| 404 | + }; |
| 405 | + |
| 406 | + $.fn.meGridView.defaults = { |
| 407 | + ShowPageOptions: true, |
| 408 | + ItemsPerPage: 10, |
| 409 | + PageOptions: [10, 20, 50, 100] |
| 410 | + }; |
| 411 | + |
| 412 | + $.fn.meGridView.locales = []; |
| 413 | + |
| 414 | + $.fn.meGridView.locales['en'] = { |
| 415 | + PageSizeText: "Page Size", |
| 416 | + PageText: "Page", |
| 417 | + PreviousPage: "Previous Page", |
| 418 | + NextPage: "Next Page" |
| 419 | + }; |
| 420 | + |
| 421 | + $.extend($.fn.meGridView.defaults, $.fn.meGridView.locales['en']); |
411 | 422 | }(jQuery)); |
0 commit comments