diff options
20 files changed, 152 insertions, 47 deletions
diff --git a/test/requests/link_checker.py b/test/requests/link_checker.py index 5888146d..7af28ab1 100644 --- a/test/requests/link_checker.py +++ b/test/requests/link_checker.py @@ -117,6 +117,11 @@ def check_packaged_js_files(args_obj, parser): "/js/qtip2/jquery.qtip.min.js", "/js/js_alt/md5.min.js", "/js/ckeditor/ckeditor.js", + "/js/cytoscape/cytoscape.min.js", + "/js/cytoscape-panzoom/cytoscape-panzoom.js", + "/js/cytoscape-panzoom/cytoscape.js-panzoom.css", + "/js/cytoscape-qtip/cytoscape-qtip.js", + "/css/d3-tip/d3-tip.css", ] print("Checking links") diff --git a/wqflask/base/trait.py b/wqflask/base/trait.py index ec8c40a0..50bd8874 100644 --- a/wqflask/base/trait.py +++ b/wqflask/base/trait.py @@ -25,19 +25,19 @@ def create_trait(**kw): assert bool(kw.get('dataset')) != bool( kw.get('dataset_name')), "Needs dataset ob. or name" - if kw.get('name'): - if kw.get('dataset_name'): - if kw.get('dataset_name') != "Temp": - dataset = create_dataset(kw.get('dataset_name')) - else: - dataset = kw.get('dataset') + assert bool(kw.get('name')), "Needs trait name" + if kw.get('dataset_name'): if kw.get('dataset_name') != "Temp": - if dataset.type == 'Publish': - permissions = check_resource_availability( - dataset, kw.get('name')) - else: - permissions = check_resource_availability(dataset) + dataset = create_dataset(kw.get('dataset_name')) + else: + dataset = kw.get('dataset') + + if dataset.type == 'Publish': + permissions = check_resource_availability( + dataset, kw.get('name')) + else: + permissions = check_resource_availability(dataset) if "view" in permissions['data']: the_trait = GeneralTrait(**kw) diff --git a/wqflask/tests/unit/wqflask/marker_regression/test_gemma_mapping.py b/wqflask/tests/unit/wqflask/marker_regression/test_gemma_mapping.py index 5b621264..b8c13ab4 100644 --- a/wqflask/tests/unit/wqflask/marker_regression/test_gemma_mapping.py +++ b/wqflask/tests/unit/wqflask/marker_regression/test_gemma_mapping.py @@ -43,22 +43,22 @@ class TestGemmaMapping(unittest.TestCase): @mock.patch("wqflask.marker_regression.gemma_mapping.GEMMA_WRAPPER_COMMAND", "ghc") @mock.patch("wqflask.marker_regression.gemma_mapping.TEMPDIR", "/home/user/data/") @mock.patch("wqflask.marker_regression.gemma_mapping.parse_loco_output") - @mock.patch("wqflask.marker_regression.gemma_mapping.logger") @mock.patch("wqflask.marker_regression.gemma_mapping.flat_files") @mock.patch("wqflask.marker_regression.gemma_mapping.gen_covariates_file") @mock.patch("wqflask.marker_regression.run_mapping.random.choice") @mock.patch("wqflask.marker_regression.gemma_mapping.os") @mock.patch("wqflask.marker_regression.gemma_mapping.gen_pheno_txt_file") - def test_run_gemma_firstrun_set_true(self, mock_gen_pheno_txt, mock_os, mock_choice, mock_gen_covar, mock_flat_files, mock_logger, mock_parse_loco): + def test_run_gemma_firstrun_set_true(self, mock_gen_pheno_txt, mock_os, mock_choice, mock_gen_covar, mock_flat_files,mock_parse_loco): """add tests for run_gemma where first run is set to true""" - chromosomes = [] + this_chromosomes={} for i in range(1, 5): - chromosomes.append(AttributeSetter({"name": f"CH{i}"})) - chromo = AttributeSetter({"chromosomes": chromosomes}) + this_chromosomes[f'CH{i}']=(AttributeSetter({"name": f"CH{i}"})) + chromosomes = AttributeSetter({"chromosomes": this_chromosomes}) + dataset_group = MockGroup( {"name": "GP1", "genofile": "file_geno"}) dataset = AttributeSetter({"group": dataset_group, "name": "dataset1_name", - "species": AttributeSetter({"chromosomes": chromo})}) + "species": AttributeSetter({"chromosomes": chromosomes})}) trait = AttributeSetter({"name": "trait1"}) samples = [] mock_gen_pheno_txt.return_value = None @@ -76,7 +76,6 @@ class TestGemmaMapping(unittest.TestCase): mock_parse_loco.assert_called_once_with(dataset, "GP1_GWA_RRRRRR") mock_os.path.isfile.assert_called_once_with( ('/home/user/imgfile_output.assoc.txt')) - self.assertEqual(mock_logger.debug.call_count, 2) self.assertEqual(mock_flat_files.call_count, 4) self.assertEqual(results, ([], "GP1_GWA_RRRRRR")) diff --git a/wqflask/wqflask/markdown_routes.py b/wqflask/wqflask/markdown_routes.py index 183f4caa..ebf75807 100644 --- a/wqflask/wqflask/markdown_routes.py +++ b/wqflask/wqflask/markdown_routes.py @@ -9,6 +9,7 @@ import sys from bs4 import BeautifulSoup +from flask import send_from_directory from flask import Blueprint from flask import render_template @@ -99,6 +100,13 @@ def environments(): 200) +@environments_blueprint.route('/svg-dependency-graph') +def svg_graph(): + directory, file_name, _ = get_file_from_python_search_path( + "wqflask/dependency-graph.svg").partition("dependency-graph.svg") + return send_from_directory(directory, file_name) + + @links_blueprint.route("/") def links(): return render_template( @@ -109,7 +117,7 @@ def links(): @policies_blueprint.route("/") def policies(): return render_template( - "links.html", + "policies.html", rendered_markdown=render_markdown("general/policies/policies.md")), 200 diff --git a/wqflask/wqflask/static/new/css/markdown.css b/wqflask/wqflask/static/new/css/markdown.css index 38d664e2..859fe7fc 100644 --- a/wqflask/wqflask/static/new/css/markdown.css +++ b/wqflask/wqflask/static/new/css/markdown.css @@ -62,7 +62,8 @@ } .graph-legend, -#guix-graph { +#guix-graph, +#guix-svg-graph{ width: 90%; margin: 10px auto; } @@ -71,6 +72,10 @@ border: solid 2px black; } +#guix-svg-graph img { + width: 100%; +} + #markdown table { width: 100%; } diff --git a/wqflask/wqflask/templates/comparison_bar_chart.html b/wqflask/wqflask/templates/comparison_bar_chart.html index f791457f..b27a6b06 100644 --- a/wqflask/wqflask/templates/comparison_bar_chart.html +++ b/wqflask/wqflask/templates/comparison_bar_chart.html @@ -1,7 +1,7 @@ {% extends "base.html" %} {% block title %}Comparison Bar Chart{% endblock %} {% block css %} - <link rel="stylesheet" type="text/css" href="/static/new/css/d3-tip.min.css" /> + <link rel="stylesheet" type="text/css" href="{{ url_for('css', filename='d3-tip/d3-tip.css') }}" /> <link rel="stylesheet" type="text/css" href="/static/new/css/panelutil.css" /> {% endblock %} {% block content %} <!-- Start of body --> diff --git a/wqflask/wqflask/templates/correlation_matrix.html b/wqflask/wqflask/templates/correlation_matrix.html index 4e150618..96ad9c35 100644 --- a/wqflask/wqflask/templates/correlation_matrix.html +++ b/wqflask/wqflask/templates/correlation_matrix.html @@ -4,7 +4,7 @@ <link rel="stylesheet" type="text/css" href="/static/new/css/corr_matrix.css" /> <link rel="stylesheet" type="text/css" href="/static/new/css/show_trait.css" /> <link rel="stylesheet" type="text/css" href="/static/new/css/panelutil.css" /> - <link rel="stylesheet" type="text/css" href="/static/new/css/d3-tip.min.css" /> + <link rel="stylesheet" type="text/css" href="{{ url_for('css', filename='d3-tip/d3-tip.css') }}" /> {% endblock %} {% block content %} diff --git a/wqflask/wqflask/templates/correlation_page.html b/wqflask/wqflask/templates/correlation_page.html index 06ee9056..68566ee5 100644 --- a/wqflask/wqflask/templates/correlation_page.html +++ b/wqflask/wqflask/templates/correlation_page.html @@ -345,8 +345,15 @@ 'title': "Sample {% if corr_method == 'pearson' %}r{% else %}rho{% endif %}", 'type': "natural-minus-na", 'width': "40px", - 'data': "sample_r", - 'orderSequence': [ "desc", "asc"] + 'data': null, + 'orderSequence': [ "desc", "asc"], + 'render': function(data, type, row, meta) { + if (data.sample_r != "N/A") { + return "<a target\"_blank\" href=\"corr_scatter_plot?dataset_1={% if dataset.name == 'Temp' %}Temp_{{ dataset.group.name }}{% else %}{{ dataset.name }}{% endif %}&dataset_2=" + data.dataset + "&trait_1={{ this_trait.name }}&trait_2=" + data.trait_id + "\">" + data.sample_r + "</a>" + } else { + return data.sample_r + } + } }, { 'title': "N", @@ -357,7 +364,7 @@ }, { 'title': "Sample p({% if corr_method == 'pearson' %}r{% else %}rho{% endif %})", - 'type': "natural-minus-na", + 'type': "scientific", 'width': "65px", 'data': "sample_p", 'orderSequence': [ "desc", "asc"] @@ -459,8 +466,15 @@ 'title': "Sample {% if corr_method == 'pearson' %}r{% else %}rho{% endif %}", 'type': "natural-minus-na", 'width': "40px", - 'data': "sample_r", - 'orderSequence': [ "desc", "asc"] + 'data': null, + 'orderSequence': [ "desc", "asc"], + 'render': function(data, type, row, meta) { + if (data.sample_r != "N/A") { + return "<a target\"_blank\" href=\"corr_scatter_plot?dataset_1={% if dataset.name == 'Temp' %}Temp_{{ dataset.group.name }}{% else %}{{ dataset.name }}{% endif %}&dataset_2=" + data.dataset + "&trait_1={{ this_trait.name }}&trait_2=" + data.trait_id + "\">" + data.sample_r + "</a>" + } else { + return data.sample_r + } + } }, { 'title': "N", @@ -471,7 +485,7 @@ }, { 'title': "Sample p({% if corr_method == 'pearson' %}r{% else %}rho{% endif %})", - 'type': "natural-minus-na", + 'type': "scientific", 'width': "65px", 'data': "sample_p", 'orderSequence': [ "desc", "asc"] @@ -506,8 +520,15 @@ 'title': "Sample {% if corr_method == 'pearson' %}r{% else %}rho{% endif %}", 'type': "natural-minus-na", 'width': "40px", - 'data': "sample_r", - 'orderSequence': [ "desc", "asc"] + 'data': null, + 'orderSequence': [ "desc", "asc"], + 'render': function(data, type, row, meta) { + if (data.sample_r != "N/A") { + return "<a target\"_blank\" href=\"corr_scatter_plot?dataset_1={% if dataset.name == 'Temp' %}Temp_{{ dataset.group.name }}{% else %}{{ dataset.name }}{% endif %}&dataset_2=" + data.dataset + "&trait_1={{ this_trait.name }}&trait_2=" + data.trait_id + "\">" + data.sample_r + "</a>" + } else { + return data.sample_r + } + } }, { 'title': "N", @@ -518,7 +539,7 @@ }, { 'title': "Sample p({% if corr_method == 'pearson' %}r{% else %}rho{% endif %})", - 'type': "natural-minus-na", + 'type': "scientific", 'width': "65px", 'data': "sample_p", 'orderSequence': [ "desc", "asc"] diff --git a/wqflask/wqflask/templates/ctl_results.html b/wqflask/wqflask/templates/ctl_results.html index e374eb4e..f90ee20c 100644 --- a/wqflask/wqflask/templates/ctl_results.html +++ b/wqflask/wqflask/templates/ctl_results.html @@ -1,7 +1,7 @@ {% extends "base.html" %} {% block css %} <link rel="stylesheet" type="text/css" href="/static/new/css/network_graph.css" /> - <link rel="stylesheet" type="text/css" href="/js/cytoscape-panzoom/cytoscape.js-panzoom.css" /> + <link rel="stylesheet" type="text/css" href="{{ url_for('css', filename='cytoscape-panzoom/cytoscape.js-panzoom.css') }}"> <link rel="stylesheet" type="text/css" href="{{ url_for('css', filename='qtip2/jquery.qtip.min.css') }}"> <style> /* The Cytoscape Web container must have its dimensions set. */ @@ -67,10 +67,10 @@ <script language="javascript" type="text/javascript" src="/static/new/packages/DataTables/js/jquery.js"></script> <script language="javascript" type="text/javascript" src="{{ url_for('js', filename='qtip2/jquery.qtip.min.js') }}"></script> <script language="javascript" type="text/javascript" src="{{ url_for('js', filename='js_alt/underscore.min.js') }}"></script> - <script language="javascript" type="text/javascript" src="/js/cytoscape/cytoscape.min.js"></script> - <script language="javascript" type="text/javascript" src="/js/cytoscape-panzoom/cytoscape-panzoom.js"></script> + <script language="javascript" type="text/javascript" src="{{ url_for('js', filename='cytoscape/cytoscape.min.js') }}"></script> + <script language="javascript" type="text/javascript" src="{{ url_for('js', filename='cytoscape-panzoom/cytoscape-panzoom.js') }}"></script> <!-- should be using cytoscape-popper for tips, see docs --> - <script language="javascript" type="text/javascript" src="/js/cytoscape-qtip/cytoscape-qtip.js"></script> + <script language="javascript" type="text/javascript" src="{{ url_for('js', filename='cytoscape-qtip/cytoscape-qtip.js') }}"></script> <!-- Loads flash - who wants that? diff --git a/wqflask/wqflask/templates/environment.html b/wqflask/wqflask/templates/environment.html index 5fe01dad..89e805ce 100644 --- a/wqflask/wqflask/templates/environment.html +++ b/wqflask/wqflask/templates/environment.html @@ -21,6 +21,16 @@ </div> <div id="guix-graph"></div> + +<!-- Display the svg graph --> + +<div id="guix-svg-graph"> + <h1>The dependency graph is shown below</h1> + + <p>To explore this image SVG you may want to open it in new browser page and zoom in. Or use an SVG viewing application.</p> + + <img alt="Dependency graph of the tools needed to build python3-genenetwork2" src="{{url_for('environments_blueprint.svg_graph')}}"/> +</div> {% endif %} {% endblock %} diff --git a/wqflask/wqflask/templates/facilities.html b/wqflask/wqflask/templates/facilities.html index a022b657..56b127f9 100644 --- a/wqflask/wqflask/templates/facilities.html +++ b/wqflask/wqflask/templates/facilities.html @@ -10,7 +10,7 @@ <div class="github-btn-container"> <div class="github-btn"> - <a href="https://github.com/genenetwork/gn-docs"> + <a href="https://github.com/genenetwork/gn-docs/blob/master/general/help/facilities.md"> Edit Text <img src="/static/images/edit.png"> </a> diff --git a/wqflask/wqflask/templates/glossary.html b/wqflask/wqflask/templates/glossary.html index 752c4b12..aaee7c5a 100644 --- a/wqflask/wqflask/templates/glossary.html +++ b/wqflask/wqflask/templates/glossary.html @@ -10,7 +10,7 @@ <div class="github-btn-container"> <div class="github-btn"> - <a href="https://github.com/genenetwork/gn-docs"> + <a href="https://github.com/genenetwork/gn-docs/blob/master/general/glossary/glossary.md"> Edit Text <img src="/static/images/edit.png"> </a> diff --git a/wqflask/wqflask/templates/heatmap.html b/wqflask/wqflask/templates/heatmap.html index 497838dd..b16de42e 100644 --- a/wqflask/wqflask/templates/heatmap.html +++ b/wqflask/wqflask/templates/heatmap.html @@ -1,7 +1,7 @@ {% extends "base.html" %} {% block title %}Heatmap{% endblock %} {% block css %} - <link rel="stylesheet" type="text/css" href="/static/new/css/d3-tip.min.css" /> + <link rel="stylesheet" type="text/css" href="{{ url_for('css', filename='d3-tip/d3-tip.css') }}" /> <link rel="stylesheet" type="text/css" href="/static/new/css/panelutil.css" /> {% endblock %} {% block content %} <!-- Start of body --> diff --git a/wqflask/wqflask/templates/links.html b/wqflask/wqflask/templates/links.html index 072e8429..6e91adae 100644 --- a/wqflask/wqflask/templates/links.html +++ b/wqflask/wqflask/templates/links.html @@ -10,7 +10,7 @@ <div class="github-btn-container"> <div class="github-btn "> - <a href="https://github.com/genenetwork/gn-docs"> + <a href="https://github.com/genenetwork/gn-docs/blob/master/general/links/links.md"> Edit Text <img src="/static/images/edit.png"> </a> diff --git a/wqflask/wqflask/templates/network_graph.html b/wqflask/wqflask/templates/network_graph.html index be3d0402..3c2ec601 100644 --- a/wqflask/wqflask/templates/network_graph.html +++ b/wqflask/wqflask/templates/network_graph.html @@ -1,7 +1,7 @@ {% extends "base.html" %} {% block css %} <link rel="stylesheet" type="text/css" href="/static/new/css/network_graph.css" /> - <link rel="stylesheet" type="text/css" href="/js/cytoscape-panzoom/cytoscape.js-panzoom.css" /> + <link rel="stylesheet" type="text/css" href="{{ url_for('css', filename='cytoscape-panzoom/cytoscape.js-panzoom.css') }}"> <link rel="stylesheet" type="text/css" href="{{ url_for('css', filename='qtip2/jquery.qtip.min.css') }}"> <style> /* The Cytoscape Web container must have its dimensions set. */ @@ -144,10 +144,10 @@ <script language="javascript" type="text/javascript" src="{{ url_for('js', filename='qtip2/jquery.qtip.min.js') }}"></script> <script language="javascript" type="text/javascript" src="{{ url_for('js', filename='js_alt/underscore.min.js') }}"></script> - <script language="javascript" type="text/javascript" src="/js/cytoscape/cytoscape.min.js"></script> - <script language="javascript" type="text/javascript" src="/js/cytoscape-panzoom/cytoscape-panzoom.js"></script> + <script language="javascript" type="text/javascript" src="{{ url_for('js', filename='cytoscape/cytoscape.min.js') }}"></script> + <script language="javascript" type="text/javascript" src="{{ url_for('js', filename='cytoscape-panzoom/cytoscape-panzoom.js') }}"></script> <!-- should be using cytoscape-popper for tips, see docs --> - <script language="javascript" type="text/javascript" src="/js/cytoscape-qtip/cytoscape-qtip.js"></script> + <script language="javascript" type="text/javascript" src="{{ url_for('js', filename='cytoscape-qtip/cytoscape-qtip.js') }}"></script> <!-- Loads flash - who wants that? diff --git a/wqflask/wqflask/templates/pair_scan_results.html b/wqflask/wqflask/templates/pair_scan_results.html index f1646af7..d64bb4b4 100644 --- a/wqflask/wqflask/templates/pair_scan_results.html +++ b/wqflask/wqflask/templates/pair_scan_results.html @@ -4,7 +4,7 @@ <link rel="stylesheet" type="text/css" href="{{ url_for('css', filename='DataTables/css/jquery.dataTables.css') }}" /> <link rel="stylesheet" type="text/css" href="/static/packages/DT_bootstrap/DT_bootstrap.css" /> <link rel="stylesheet" type="text/css" href="/static/packages/TableTools/media/css/TableTools.css" /> - <link rel="stylesheet" type="text/css" href="/static/new/css/d3-tip.min.css" /> + <link rel="stylesheet" type="text/css" href="{{ url_for('css', filename='d3-tip/d3-tip.css') }}" /> <link rel="stylesheet" type="text/css" href="/static/new/css/panelutil.css" /> {% endblock %} diff --git a/wqflask/wqflask/templates/policies.html b/wqflask/wqflask/templates/policies.html index 4e0985d3..e36c9e08 100644 --- a/wqflask/wqflask/templates/policies.html +++ b/wqflask/wqflask/templates/policies.html @@ -10,7 +10,7 @@ <div class="github-btn-container"> <div class="github-btn "> - <a href="https://github.com/genenetwork/gn-docs"> + <a href="https://github.com/genenetwork/gn-docs/blob/master/general/policies/policies.md"> Edit Text <img src="/static/images/edit.png"> </a> diff --git a/wqflask/wqflask/templates/references.html b/wqflask/wqflask/templates/references.html index f723a1e8..04e60361 100644 --- a/wqflask/wqflask/templates/references.html +++ b/wqflask/wqflask/templates/references.html @@ -6,7 +6,7 @@ {% block content %} <div class="github-btn-container"> <div class="github-btn"> - <a href="https://github.com/genenetwork/gn-docs"> + <a href="https://github.com/genenetwork/gn-docs/blob/master/general/references/references.md"> Edit Text <img src="/static/images/edit.png"> </a> diff --git a/wqflask/wqflask/templates/show_trait.html b/wqflask/wqflask/templates/show_trait.html index 7b74a3f6..07efbe62 100644 --- a/wqflask/wqflask/templates/show_trait.html +++ b/wqflask/wqflask/templates/show_trait.html @@ -5,7 +5,7 @@ <link rel="stylesheet" type="text/css" href="/static/new/css/box_plot.css" /> <link rel="stylesheet" type="text/css" href="/static/new/css/prob_plot.css" /> <link rel="stylesheet" type="text/css" href="/static/new/css/scatter-matrix.css" /> - <link rel="stylesheet" type="text/css" href="/static/new/css/d3-tip.min.css" /> + <link rel="stylesheet" type="text/css" href="{{ url_for('css', filename='d3-tip/d3-tip.css') }}" /> <link rel="stylesheet" type="text/css" href="{{ url_for('css', filename='DataTables/css/jquery.dataTables.css') }}" /> <link rel="stylesheet" type="text/css" href="/static/new/packages/noUiSlider/nouislider.css" /> <link rel="stylesheet" type="text/css" href="/static/new/packages/noUiSlider/nouislider.pips.css" /> @@ -221,6 +221,33 @@ primary_table.search($(this).val()).draw(); } ); + $('.toggle-vis').on('click', function (e) { + e.preventDefault(); + + function toggle_column(column) { + //ZS: Toggle column visibility + column.visible( ! column.visible() ); + if (column.visible()){ + $(this).removeClass("active"); + } else { + $(this).addClass("active"); + } + } + + // Get the column API object + var target_cols = $(this).attr('data-column').split(",") + for (let i = 0; i < target_cols.length; i++){ + console.log("THE COL:", target_cols[i]) + var column = primary_table.column( target_cols[i] ); + toggle_column(column); + + {% if sample_groups|length != 1 %} + var column2 = other_table.column( target_cols[i] ); + toggle_column(column2); + {% endif %} + } + } ); + {% if sample_groups|length != 1 %} $('#other_searchbox').on( 'keyup', function () { other_table.search($(this).val()).draw(); diff --git a/wqflask/wqflask/templates/show_trait_edit_data.html b/wqflask/wqflask/templates/show_trait_edit_data.html index 2e730248..4ad11a5e 100644 --- a/wqflask/wqflask/templates/show_trait_edit_data.html +++ b/wqflask/wqflask/templates/show_trait_edit_data.html @@ -1,6 +1,36 @@ <div> {% for sample_type in sample_groups %} <div class="sample-table-container"> + {% if loop.index == 1 %} + <b>Show/Hide Columns:</b> + <br> + <button class="toggle-vis" data-column="1">ID</button> + <button class="toggle-vis" data-column="2">Sample</button> + <button class="toggle-vis" data-column="3">Value</button> + {% if sample_groups[0].se_exists %} + <button class="toggle-vis" data-column="4,5">SE</button> + {% if has_num_cases %} + <button class="toggle-vis" data-column="6">N</button> + {% set attr_start_pos = 7 %} + {% else %} + {% set attr_start_pos = 6 %} + {% endif %} + {% else %} + {% if has_num_cases %} + <button class="toggle-vis" data-column="4">N</button> + {% set attr_start_pos = 5 %} + {% else %} + {% set attr_start_pos = 4 %} + {% endif %} + {% endif %} + {% if sample_groups[0].attributes %} + {% for attribute in sample_groups[0].attributes %} + <button class="toggle-vis" data-column="{{ loop.index + attr_start_pos - 1 }}">{{ sample_groups[0].attributes[attribute].name }}</button> + {% endfor %} + {% endif %} + <br> + <br> + {% endif %} <div class="sample-table-search-container"> <input type="text" id="{{ sample_type.sample_group_type }}_searchbox" class="form-control sample-table-search" placeholder="Search This Table For ..."> </div> |