Skip to content

Commit 7ef4798

Browse files
committed
display message when there are no results
1 parent c041ee6 commit 7ef4798

11 files changed

Lines changed: 73 additions & 22 deletions

File tree

CHANGELOG.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22

33
## v.4.0.22-Alpha
44
- Fix issue where 'Change User Password' popup form couldn't handle specifying a new password.
5+
- Display message when there are no results in `ufTable`
56

67
## v.4.0.21-Alpha
78
- Implement reflow and column selector for tables (#670)

app/sprinkles/admin/templates/components/tables/activities.html.twig

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
{% extends "components/tables/table-paginated.html.twig" %}
99

1010
{% block table %}
11-
<table id="{{table.id}}" class="tablesorter table table-bordered table-hover table-striped" data-sortlist="[[0, 1]]">
11+
<table id="{{table.id}}" class="tablesorter table table-bordered table-hover table-striped" data-sortlist="[[0, 1]]" data-message-empty-rows="{{table.message_empty_rows}}">
1212
<thead>
1313
<tr>
1414
<th class="sorter-metanum" data-column-name="occurred_at" data-column-template="#activity-table-column-occurred-at">{{translate('ACTIVITY.TIME')}} <i class="fa fa-sort"></i></th>

app/sprinkles/admin/templates/components/tables/groups.html.twig

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
{% extends "components/tables/table-paginated.html.twig" %}
99

1010
{% block table %}
11-
<table id="{{table.id}}" class="tablesorter table table-bordered table-hover table-striped" data-sortlist="[[0, 0]]">
11+
<table id="{{table.id}}" class="tablesorter table table-bordered table-hover table-striped" data-sortlist="{{table.sortlist}}" data-message-empty-rows="{{table.message_empty_rows}}">
1212
<thead>
1313
<tr>
1414
<th class="sorter-metatext" data-column-name="name" data-column-template="#group-table-column-info">{{translate('GROUP')}} <i class="fa fa-sort"></i></th>

app/sprinkles/admin/templates/components/tables/permission-users.html.twig

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
{% extends "components/tables/table-paginated.html.twig" %}
99

1010
{% block table %}
11-
<table id="{{table.id}}" class="tablesorter table table-bordered table-hover table-striped" data-sortlist="[[0, 0]]">
11+
<table id="{{table.id}}" class="tablesorter table table-bordered table-hover table-striped" data-sortlist="{{table.sortlist}}" data-message-empty-rows="{{table.message_empty_rows}}">
1212
<thead>
1313
<tr>
1414
<th class="sorter-metatext" data-column-name="name" data-column-template="#user-table-column-info">{{translate('USER')}} <i class="fa fa-sort"></i></th>

app/sprinkles/admin/templates/components/tables/permissions.html.twig

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
{% extends "components/tables/table-paginated.html.twig" %}
99

1010
{% block table %}
11-
<table id="{{table.id}}" class="tablesorter table table-bordered table-hover table-striped" data-sortlist="[[0, 0]]">
11+
<table id="{{table.id}}" class="tablesorter table table-bordered table-hover table-striped" data-sortlist="{{table.sortlist}}" data-message-empty-rows="{{table.message_empty_rows}}">
1212
<thead>
1313
<tr>
1414
<th class="sorter-metatext" data-column-name="name" data-column-template="#permission-table-column-name">{{translate('PERMISSION')}} <i class="fa fa-sort"></i></th>

app/sprinkles/admin/templates/components/tables/roles.html.twig

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
{% extends "components/tables/table-paginated.html.twig" %}
99

1010
{% block table %}
11-
<table id="{{table.id}}" class="tablesorter table table-bordered table-hover table-striped" data-sortlist="[[0, 0]]">
11+
<table id="{{table.id}}" class="tablesorter table table-bordered table-hover table-striped" data-sortlist="{{table.sortlist}}" data-message-empty-rows="{{table.message_empty_rows}}">
1212
<thead>
1313
<tr>
1414
<th class="sorter-metatext" data-column-name="name" data-column-template="#role-table-column-info">{{translate('ROLE')}} <i class="fa fa-sort"></i></th>

app/sprinkles/admin/templates/components/tables/table-paginated.html.twig

Lines changed: 29 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,14 @@
22
# Requires tablesorter-custom.css for proper styling of pager elements.
33
#}
44

5+
{# Set some default values for the child template. #}
6+
{% set table = {
7+
'id': "uf-table",
8+
'message_empty_rows': translate('NO_RESULTS'),
9+
'sortlist': "[[0, 0]]"
10+
} | merge(table)
11+
%}
12+
513
<div class="table-search form-group has-feedback">
614
<input type="search" class="form-control" data-column="all">
715
<i class="fa fa-search form-control-icon" aria-hidden="true"></i>
@@ -15,18 +23,25 @@
1523
{# Define your Handlebars cell templates in this block in your child template #}
1624
{% endblock %}
1725

18-
<div class="pager pager-lg tablesorter-pager">
19-
<span class="pager-control first" title="First page"><i class="fa fa-angle-double-left"></i></span>
20-
<span class="pager-control prev" title="Previous page"><i class="fa fa-angle-left"></i></span>
21-
<span class="pagedisplay"></span> {# this can be any element, including an input #}
22-
<span class="pager-control next" title="Next page"><i class="fa fa-angle-right"></i></span>
23-
<span class="pager-control last" title= "Last page"><i class="fa fa-angle-double-right"></i></span>
24-
<br><br>
25-
{{translate("PAGINATION.GOTO")}}: <select class="gotoPage"></select> &bull; {{translate("PAGINATION.SHOW")}}:
26-
<select class="pagesize">
27-
{% for count in pager.take|default([5, 10, 50, 100]) %}
28-
<option value="{{count}}">{{count}}</option>
29-
{% endfor %}
30-
</select>
31-
</div>
26+
{% block table_info %}
27+
<div class="uf-table-info-messages">
28+
</div>
29+
{% endblock %}
30+
31+
{% block table_pager_controls %}
32+
<div class="pager pager-lg tablesorter-pager">
33+
<span class="pager-control first" title="First page"><i class="fa fa-angle-double-left"></i></span>
34+
<span class="pager-control prev" title="Previous page"><i class="fa fa-angle-left"></i></span>
35+
<span class="pagedisplay"></span> {# this can be any element, including an input #}
36+
<span class="pager-control next" title="Next page"><i class="fa fa-angle-right"></i></span>
37+
<span class="pager-control last" title= "Last page"><i class="fa fa-angle-double-right"></i></span>
38+
<br><br>
39+
{{translate("PAGINATION.GOTO")}}: <select class="gotoPage"></select> &bull; {{translate("PAGINATION.SHOW")}}:
40+
<select class="pagesize">
41+
{% for count in pager.take|default([5, 10, 50, 100]) %}
42+
<option value="{{count}}">{{count}}</option>
43+
{% endfor %}
44+
</select>
45+
</div>
46+
{% endblock %}
3247
</div>

app/sprinkles/admin/templates/components/tables/users.html.twig

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
{% extends "components/tables/table-paginated.html.twig" %}
99

1010
{% block table %}
11-
<table id="{{table.id}}" class="tablesorter table table-bordered table-hover table-striped" data-sortlist="[[0, 0]]">
11+
<table id="{{table.id}}" class="tablesorter table table-bordered table-hover table-striped" data-sortlist="{{table.sortlist}}" data-message-empty-rows="{{table.message_empty_rows}}">
1212
<thead>
1313
<tr>
1414
<th class="sorter-metatext" data-column-name="name" data-column-template="#user-table-column-info" data-priority="1">{{translate('USER')}} <i class="fa fa-sort"></i></th>

app/sprinkles/core/assets/local/core/css/userfrosting.css

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -64,6 +64,20 @@ form textarea {
6464
display: none;
6565
}
6666

67+
/* Special styling for uf-table messages */
68+
.uf-table-info-messages {
69+
background-color: #fff !important;
70+
color: #cdcdcd;
71+
font-weight: 700;
72+
text-align: center;
73+
}
74+
75+
.uf-table-error-row td {
76+
background-color: #f39c12 !important;
77+
color: #fff !important;
78+
text-align: center;
79+
}
80+
6781
/* Special wrapper for alerts on public form pages (sign-in, register, etc) */
6882
.form-alerts {
6983
margin-bottom: 10px !important;

app/sprinkles/core/assets/local/core/js/uf-table.js

Lines changed: 22 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -198,7 +198,7 @@
198198
// class added to arrows when at the extremes; see the "updateArrows" option
199199
// (i.e. prev/first arrows are "disabled" when on the first page)
200200
cssDisabled : 'disabled', // Note there is no period "." in front of this class name
201-
cssErrorRow : 'tablesorter-errorRow' // error information row
201+
cssErrorRow : 'uf-table-error-row' // error information row
202202
}
203203
},
204204
options
@@ -317,7 +317,27 @@
317317
});
318318

319319
base.ts.on('pagerComplete', function () {
320-
$el.trigger('pagerComplete.ufTable');
320+
$el.trigger('pagerComplete.ufTable');
321+
});
322+
323+
// Show info messages when there are no rows/no results
324+
base.ts.on('filterEnd filterReset pagerComplete', function () {
325+
var table = base.ts[0];
326+
var infoMessages = base.$T.find('.uf-table-info-messages');
327+
if (table.config.pager) {
328+
infoMessages.html('');
329+
var fr = table.config.pager.filteredRows;
330+
if (fr === 0) {
331+
infoMessages.html($(table).data('message-empty-rows'));
332+
}
333+
}
334+
});
335+
336+
// Detect changes to element attributes
337+
this.$T.attrchange({
338+
callback: function (event) {
339+
this.element = event.target;
340+
}.bind(this)
321341
});
322342
};
323343

0 commit comments

Comments
 (0)