diff options
| -rw-r--r-- | wqflask/wqflask/templates/correlation_page.html | 33 |
1 files changed, 18 insertions, 15 deletions
diff --git a/wqflask/wqflask/templates/correlation_page.html b/wqflask/wqflask/templates/correlation_page.html index aa74abf5..5093ebfa 100644 --- a/wqflask/wqflask/templates/correlation_page.html +++ b/wqflask/wqflask/templates/correlation_page.html @@ -80,19 +80,21 @@ <input type="hidden" name="database_name" id="database_name" value="None"> <input type="hidden" name="export_data" id="export_data" value=""> <input type="hidden" name="file_name" id="file_name" value="{{ this_trait.name }}_{{ dataset.name }}_correlation"> - <button class="btn btn-default" id="export_traits">Download CSV</button> <input type="text" id="searchbox" class="form-control" style="width: 200px; display: inline;" placeholder="Search Table For ..."> <input type="text" id="select_top" class="form-control" style="width: 200px; display: inline;" placeholder="Select Top ..."> <button class="btn btn-default" id="deselect_all" type="button"><span class="glyphicon glyphicon-remove"></span> Deselect</button> <button id="redraw" class="btn btn-default" type="button">Reset Columns</button> </form> <br /> + <div id="export_options"></div> {% if target_dataset.type != "Publish" %} <br /> - <button id="more_options" class="btn btn-primary">More Options...</button> + <div style="float: left; clear: left;"> + <button id="more_options" class="btn btn-primary">More Options...</button> + </div> <br /> <br /> - <div id="filter_options" style="display: none;"> + <div id="filter_options" style="display: none; float: left; clear: left;"> <span style="border: 1px dashed #999999; padding: 8px; background-color: #ddf; font-size: 12px;"> <button id="select_traits" class="btn btn-primary" style="font-size: 12px; padding: 2px 3px;">Select Traits</button> with r > <input type="text" name="r_greater_select" value="-1.0" size="6" maxlength="10"> @@ -115,7 +117,7 @@ </div> {% endif %} </div> - <div class="show-hide-container"> + <div class="show-hide-container" style="float: left; clear: left;"> <b>Show/Hide Columns:</b> <br> <button class="toggle-vis" data-column="1">Index</button> @@ -174,7 +176,7 @@ <script language="javascript" type="text/javascript" src="{{ url_for('js', filename='DataTables/js/jquery.dataTables.min.js') }}"></script> <script language="javascript" type="text/javascript" src="{{ url_for('js', filename='DataTablesExtensions/buttons/js/dataTables.buttons.min.js') }}"></script> - <script language="javascript" type="text/javascript" src="{{ url_for('js', filename='DataTablesExtensions/buttons/js/buttons.colVis.min.js') }}"></script> + <script language="javascript" type="text/javascript" src="{{ url_for('js', filename='DataTablesExtensions/buttons/js/buttons.html5.min.js') }}"></script> <script language="javascript" type="text/javascript" src="{{ url_for('js', filename='DataTablesExtensions/plugins/sorting/natural.js') }}"></script> <script language="javascript" type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/js/all.min.js"></script> <script language="javascript" type="text/javascript" src="https://cdn.datatables.net/scroller/2.0.2/js/dataTables.scroller.min.js"></script> @@ -259,17 +261,14 @@ $(document).ready( function () { table_conf = { buttons: [ - { - extend: 'columnsToggle', - columns: function( idx, data, node ) { - if (idx != 0) { - return true; - } else { - return false; - } - }, - postfixButtons: [ 'colvisRestore' ] + { + extend: 'csvHtml5', + text: 'Download <span class="glyphicon glyphicon-download"></span>', + className: 'btn btn-default', + exportOptions: { + columns: 'th:not(:first-child)' } + } ], 'drawCallback': function( settings ) { $('#trait_table tr').off().on("click", function(event) { @@ -544,6 +543,10 @@ trait_table = $('#trait_table').DataTable(table_conf); + trait_table.buttons().container().appendTo('#export_options') + + $('.buttons-csv').removeClass('dt-button') + trait_table.on( 'order.dt search.dt draw.dt', function () { trait_table.column(1, {search:'applied', order:'applied'}).nodes().each( function (cell, i) { cell.innerHTML = i+1; |