diff options
| -rw-r--r-- | wqflask/wqflask/templates/gsearch_pheno.html | 86 |
1 files changed, 9 insertions, 77 deletions
diff --git a/wqflask/wqflask/templates/gsearch_pheno.html b/wqflask/wqflask/templates/gsearch_pheno.html index 7abdb222..8824ce55 100644 --- a/wqflask/wqflask/templates/gsearch_pheno.html +++ b/wqflask/wqflask/templates/gsearch_pheno.html @@ -56,6 +56,7 @@ <script language="javascript" type="text/javascript" src="{{ url_for('js', filename='DataTablesExtensions/colResize/dataTables.colResize.js') }}"></script> <script language="javascript" type="text/javascript" src="/static/new/javascript/search_results.js"></script> <script language="javascript" type="text/javascript" src="/static/new/javascript/table_functions.js"></script> + <script language="javascript" type="text/javascript" src="/static/new/javascript/create_datatable.js"></script> <script type='text/javascript'> var getParams = function(url) { @@ -70,15 +71,13 @@ </script> <script type='text/javascript'> - var trait_list = {{ trait_list|safe }}; + var traitsJson = {{ trait_list|safe }}; </script> <script type="text/javascript" charset="utf-8"> $(document).ready( function () { var tableId = "trait_table"; - var width_change = 0; //ZS: For storing the change in width so overall table width can be adjusted by that amount - columnDefs = [ { 'data': null, @@ -199,30 +198,8 @@ } ] - loadDataTable(true); - - function loadDataTable(first_run=false){ - - if (!first_run){ - setUserColumnsDefWidths(tableId); - } - - table_settings = { - 'drawCallback': function( settings ) { - $('#' + tableId + ' tr').off().on("click", function(event) { - if (event.target.type !== 'checkbox' && event.target.tagName.toLowerCase() !== 'a') { - var obj =$(this).find('input'); - obj.prop('checked', !obj.is(':checked')); - } - if ($(this).hasClass("selected") && event.target.tagName.toLowerCase() !== 'a'){ - $(this).removeClass("selected") - } else if (event.target.tagName.toLowerCase() !== 'a') { - $(this).addClass("selected") - } - change_buttons() - }); - }, - "createdRow": function ( row, data, index ) { + tableSettings = { + "createdRow": function ( row, data, index ) { $('td', row).eq(0).attr("style", "text-align: center; padding: 4px 10px 2px 10px;"); $('td', row).eq(1).attr("align", "right"); $('td', row).eq(5).attr('title', $('td', row).eq(5).text()); @@ -248,60 +225,15 @@ $('td', row).eq(9).attr('data-export', $('td', row).eq(9).text()); $('td', row).eq(10).attr('data-export', $('td', row).eq(10).text()); }, - 'data': trait_list, - 'columns': columnDefs, - "order": [[1, "asc" ]], - 'sDom': "iti", - "destroy": true, - "deferRender": true, - "bSortClasses": false, - {% if trait_count > 20 %} - "scrollY": "100vh", - "scroller": true, - "scrollCollapse": true, + {% if trait_count <= 20 %} + "scroller": false {% else %} - "iDisplayLength": -1, + "scroller": true {% endif %} - "initComplete": function (settings) { - //Add JQueryUI resizable functionality to each th in the ScrollHead table - $('#' + tableId + '_wrapper .dataTables_scrollHead thead th').resizable({ - handles: "e", - alsoResize: '#' + tableId + '_wrapper .dataTables_scrollHead table', //Not essential but makes the resizing smoother - resize: function( event, ui ) { - width_change = ui.size.width - ui.originalSize.width; - }, - stop: function () { - saveColumnSettings(tableId, trait_table); - loadDataTable(); - } - }); - } - } + } - if (!first_run){ - table_settings['autoWidth'] = false; - $('#table_container').css("width", String($('#trait_table').width() + width_change {% if trait_list|length > 20 %}+ 17{% endif %}) + "px"); // Change the container width by the change in width of the adjusted column, so the overall table size adjusts properly - } - - let checked_rows = get_checked_rows(tableId); - trait_table = $('#' + tableId).DataTable(table_settings); - if (checked_rows.length > 0){ - recheck_rows(trait_table, checked_rows); - } - - if (first_run){ - {% if trait_list|length > 20 %} - $('#table_container').css("width", String($('#trait_table').width() + 17) + "px"); - {% endif %} - } - - trait_table.draw(); - } + create_table(tableId, traitsJson, columnDefs, tableSettings); - $('#redraw').click(function() { - var table = $('#' + tableId).DataTable(); - table.colReorder.reset() - }); }); </script> {% endblock %} |