Add clear search button to data tables.

This commit is contained in:
JonnyWong16 2015-08-19 13:25:29 -07:00
parent 5a1516286c
commit 01b3ae377b
8 changed files with 43 additions and 11 deletions

View file

@ -66,6 +66,8 @@
var colvis = new $.fn.dataTable.ColVis(history_table, { buttonText: '<i class="fa fa-columns"></i> Select columns', buttonClass: 'btn btn-dark', exclude: [0, 10] });
$(colvis.button()).appendTo('div.colvis-button-bar');
clearSearchButton('history_table', history_table);
$('#row-edit-mode').click(function() {
if ($(this).hasClass('active')) {
$('.delete-control').each(function() {

View file

@ -43,6 +43,8 @@
}
history_table = $('#history_table').DataTable(history_table_modal_options);
clearSearchButton('history_table', history_table);
});
</script>
% else:

View file

@ -267,6 +267,8 @@ DOCUMENTATION :: END
var colvis = new $.fn.dataTable.ColVis(history_table, { buttonText: '<i class="fa fa-columns"></i> Select columns', buttonClass: 'btn btn-dark', exclude: [0, 10] });
$(colvis.button()).appendTo('div.colvis-button-bar');
clearSearchButton('history_table', history_table);
});
</script>
% elif data['type'] == 'show':
@ -285,6 +287,8 @@ DOCUMENTATION :: END
history_table = $('#history_table').DataTable(history_table_options);
var colvis = new $.fn.dataTable.ColVis(history_table, { buttonText: '<i class="fa fa-columns"></i> Select columns', buttonClass: 'btn btn-dark', exclude: [0, 10] });
$(colvis.button()).appendTo('div.colvis-button-bar');
clearSearchButton('history_table', history_table);
});
</script>
% endif
@ -303,7 +307,7 @@ DOCUMENTATION :: END
</script>
% endif
<script>
$("#airdate").html($.datepicker.formatDate('M dd, yy', new Date($("#airdate").html())));
$("#airdate").html(moment($("#airdate")).format('MMM DD, YYYY'));
$("#runtime").html(millisecondsToMinutes($("#runtime").html(), true));
</script>
% endif

View file

@ -348,3 +348,12 @@ Accordion.prototype.dropdown = function(e) {
$el.find('.submenu').not($next).slideUp().parent().removeClass('open');
};
}
function clearSearchButton(tableName, table) {
$('#' + tableName + '_filter').find('input[type=search]')
.wrap('<div class="input-group" role="group" aria-label="Search"></div>')
.after('<span class="input-group-btn"><button class="btn btn-form" data-toggle="button" aria-pressed="false" autocomplete="off" id="clear-search-' + tableName + '"><i class="fa fa-remove"></i></button></span>')
$('#clear-search-' + tableName).click(function() {
table.search('').draw();
});
}

View file

@ -86,6 +86,7 @@ from plexpy import helpers
$(document).ready(function() {
LoadPlexPyLogs();
clearSearchButton('log_table', log_table);
});
function LoadPlexPyLogs() {
@ -105,11 +106,13 @@ from plexpy import helpers
$("#plexpy-logs-btn").click(function() {
$("#clear-logs").show();
LoadPlexPyLogs();
clearSearchButton('log_table', log_table);
});
$("#plex-logs-btn").click(function() {
$("#clear-logs").hide();
LoadPlexLogs();
clearSearchButton('plex_log_table', plex_log_table);
});
$("#clear-logs").click(function() {

View file

@ -57,9 +57,10 @@
"url": "get_sync"
}
sync_table = $('#sync_table').DataTable(sync_table_options);
var colvis = new $.fn.dataTable.ColVis( sync_table, { buttonText: '<i class="fa fa-columns"></i> Select columns', buttonClass: 'btn btn-dark' } );
$( colvis.button() ).appendTo('div.colvis-button-bar');
clearSearchButton('sync_table', sync_table);
});
</script>
</%def>

View file

@ -314,6 +314,8 @@ from plexpy import helpers
var colvis = new $.fn.dataTable.ColVis(history_table, { buttonText: '<i class="fa fa-columns"></i> Select columns', buttonClass: 'btn btn-dark', exclude: [0, 10] });
$(colvis.button()).appendTo('#button-bar-history');
clearSearchButton('history_table', history_table);
});
$( "#ip-tab-btn" ).one( "click", function() {
@ -329,6 +331,8 @@ from plexpy import helpers
}
}
user_ip_table = $('#user_ip_table').DataTable(user_ip_table_options);
clearSearchButton('user_ip_table', user_ip_table);
});
$( "#sync-tab-btn" ).one( "click", function() {
@ -341,10 +345,12 @@ from plexpy import helpers
}
}
sync_table = $('#sync_table').DataTable(sync_table_options);
history_table.column(1).visible(false);
sync_table.column(1).visible(false);
var colvis_sync = new $.fn.dataTable.ColVis( sync_table, { buttonText: '<i class="fa fa-columns"></i> Select columns', buttonClass: 'btn btn-dark' } );
$( colvis_sync.button() ).appendTo('#button-bar-sync');
clearSearchButton('sync_table', sync_table);
});
// Load edit user modal

View file

@ -41,6 +41,7 @@
<script src="interfaces/default/js/moment-with-locale.js"></script>
<script src="interfaces/default/js/tables/users.js"></script>
<script>
$(document).ready(function() {
users_list_table_options.ajax = {
"url": "get_user_list",
type: "post",
@ -49,7 +50,11 @@
}
}
var users_list_table = $('#users_list_table').DataTable(users_list_table_options);
users_list_table = $('#users_list_table').DataTable(users_list_table_options);
clearSearchButton('users_list_table', users_list_table);
});
$("#refresh-users-list").click(function() {
$.ajax({