From dd0eba12574bab9ec2998540548f0da5fdf90458 Mon Sep 17 00:00:00 2001 From: Roberto Velasco Segura Date: Fri, 20 Jul 2018 09:44:37 -0500 Subject: [PATCH 01/20] input fields --- js/csv_to_html_table.js | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/js/csv_to_html_table.js b/js/csv_to_html_table.js index 99e5bbe8..7efd0ee1 100644 --- a/js/csv_to_html_table.js +++ b/js/csv_to_html_table.js @@ -30,8 +30,15 @@ CsvToHtmlTable = { $tableHeadRow.append($("").text(csvHeaderRow[headerIdx])); } $tableHead.append($tableHeadRow); - $table.append($tableHead); + + var $tableHeadRow_filter = $(""); + for (var headerIdx = 0; headerIdx < csvHeaderRow.length; headerIdx++) { + $tableHeadRow_filter.append($("").html('')); + } + $tableHead.append($tableHeadRow_filter); + $table.append($tableHead_filter); + var $tableBody = $(""); for (var rowIdx = 1; rowIdx < csvData.length; rowIdx++) { From f3e4090589584c8898a39852c72f58f4e0b6d78e Mon Sep 17 00:00:00 2001 From: Roberto Velasco Segura Date: Fri, 20 Jul 2018 09:55:35 -0500 Subject: [PATCH 02/20] bugfix --- js/csv_to_html_table.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/js/csv_to_html_table.js b/js/csv_to_html_table.js index 7efd0ee1..eef5121e 100644 --- a/js/csv_to_html_table.js +++ b/js/csv_to_html_table.js @@ -30,14 +30,14 @@ CsvToHtmlTable = { $tableHeadRow.append($("").text(csvHeaderRow[headerIdx])); } $tableHead.append($tableHeadRow); - $table.append($tableHead); var $tableHeadRow_filter = $(""); for (var headerIdx = 0; headerIdx < csvHeaderRow.length; headerIdx++) { $tableHeadRow_filter.append($("").html('')); } $tableHead.append($tableHeadRow_filter); - $table.append($tableHead_filter); + + $table.append($tableHead); var $tableBody = $(""); From dd6abd295aa391ddb81f05d64bd0970592be3655 Mon Sep 17 00:00:00 2001 From: Roberto Velasco Segura Date: Fri, 20 Jul 2018 10:45:06 -0500 Subject: [PATCH 03/20] trying to add an event --- js/csv_to_html_table.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/js/csv_to_html_table.js b/js/csv_to_html_table.js index eef5121e..041d26ac 100644 --- a/js/csv_to_html_table.js +++ b/js/csv_to_html_table.js @@ -34,7 +34,11 @@ CsvToHtmlTable = { var $tableHeadRow_filter = $(""); for (var headerIdx = 0; headerIdx < csvHeaderRow.length; headerIdx++) { $tableHeadRow_filter.append($("").html('')); - } + $tableHeadRow_filter[0].childNodes[headerIdx].childNodes[0].on( + 'keyup change', + function () { + console.log(this.value)})} + $tableHead.append($tableHeadRow_filter); $table.append($tableHead); From c351d014159a857a7eeb14d8fdc6ad12c7de6935 Mon Sep 17 00:00:00 2001 From: Roberto Velasco Segura Date: Fri, 20 Jul 2018 10:54:32 -0500 Subject: [PATCH 04/20] another try --- js/csv_to_html_table.js | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/js/csv_to_html_table.js b/js/csv_to_html_table.js index 041d26ac..15fe0b5b 100644 --- a/js/csv_to_html_table.js +++ b/js/csv_to_html_table.js @@ -34,10 +34,7 @@ CsvToHtmlTable = { var $tableHeadRow_filter = $(""); for (var headerIdx = 0; headerIdx < csvHeaderRow.length; headerIdx++) { $tableHeadRow_filter.append($("").html('')); - $tableHeadRow_filter[0].childNodes[headerIdx].childNodes[0].on( - 'keyup change', - function () { - console.log(this.value)})} + $tableHeadRow_filter[0].childNodes[headerIdx].childNodes[0].onchange = function() { console.log("khkjhk") } $tableHead.append($tableHeadRow_filter); From 6eb568ffb6244b7b793eaf1c6c999e6d9f08947b Mon Sep 17 00:00:00 2001 From: Roberto Velasco Segura Date: Fri, 20 Jul 2018 10:55:27 -0500 Subject: [PATCH 05/20] bugfix --- js/csv_to_html_table.js | 1 + 1 file changed, 1 insertion(+) diff --git a/js/csv_to_html_table.js b/js/csv_to_html_table.js index 15fe0b5b..73dc0061 100644 --- a/js/csv_to_html_table.js +++ b/js/csv_to_html_table.js @@ -35,6 +35,7 @@ CsvToHtmlTable = { for (var headerIdx = 0; headerIdx < csvHeaderRow.length; headerIdx++) { $tableHeadRow_filter.append($("").html('')); $tableHeadRow_filter[0].childNodes[headerIdx].childNodes[0].onchange = function() { console.log("khkjhk") } + } $tableHead.append($tableHeadRow_filter); From f5d51133634fea210c28ddecbd401693f4036d74 Mon Sep 17 00:00:00 2001 From: Roberto Velasco Segura Date: Fri, 20 Jul 2018 10:59:52 -0500 Subject: [PATCH 06/20] more ambitious function --- js/csv_to_html_table.js | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/js/csv_to_html_table.js b/js/csv_to_html_table.js index 73dc0061..7d31bf3b 100644 --- a/js/csv_to_html_table.js +++ b/js/csv_to_html_table.js @@ -34,7 +34,17 @@ CsvToHtmlTable = { var $tableHeadRow_filter = $(""); for (var headerIdx = 0; headerIdx < csvHeaderRow.length; headerIdx++) { $tableHeadRow_filter.append($("").html('')); - $tableHeadRow_filter[0].childNodes[headerIdx].childNodes[0].onchange = function() { console.log("khkjhk") } + $tableHeadRow_filter[0].childNodes[headerIdx].childNodes[0].onchange = function() { + console.log("column filter") + console.log(headerIdx) + console.log(this.value) + if ( $table.column(headerIdx).search() !== this.value ) { + $table + .column(headerIdx) + .search( this.value ) + .draw(); + } + } } $tableHead.append($tableHeadRow_filter); From ebc01d8bba7d6a834b89b889629a9f0438a0f4fd Mon Sep 17 00:00:00 2001 From: Roberto Velasco Segura Date: Fri, 20 Jul 2018 11:20:50 -0500 Subject: [PATCH 07/20] tryng to make a global variable --- js/csv_to_html_table.js | 3 +++ 1 file changed, 3 insertions(+) diff --git a/js/csv_to_html_table.js b/js/csv_to_html_table.js index 7d31bf3b..f08921fd 100644 --- a/js/csv_to_html_table.js +++ b/js/csv_to_html_table.js @@ -1,4 +1,5 @@ var CsvToHtmlTable = CsvToHtmlTable || {}; +var data_table_g = {}; CsvToHtmlTable = { init: function (options) { @@ -71,6 +72,8 @@ CsvToHtmlTable = { $table.DataTable(datatables_options); + data_table_g = $table; + if (allow_download) { $containerElement.append("

Download as CSV

"); } From 41c059f06799655d19fcab64f69828c1f5b6fadd Mon Sep 17 00:00:00 2001 From: Roberto Velasco Segura Date: Fri, 20 Jul 2018 11:24:14 -0500 Subject: [PATCH 08/20] another try --- js/csv_to_html_table.js | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/js/csv_to_html_table.js b/js/csv_to_html_table.js index f08921fd..471772ad 100644 --- a/js/csv_to_html_table.js +++ b/js/csv_to_html_table.js @@ -70,9 +70,7 @@ CsvToHtmlTable = { } $table.append($tableBody); - $table.DataTable(datatables_options); - - data_table_g = $table; + data_table_g = $table.DataTable(datatables_options); if (allow_download) { $containerElement.append("

Download as CSV

"); From fd0ce9d25b4da2f7d44690787eb7c4f510e28c49 Mon Sep 17 00:00:00 2001 From: Roberto Velasco Segura Date: Fri, 20 Jul 2018 11:26:37 -0500 Subject: [PATCH 09/20] using the global variable --- js/csv_to_html_table.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/js/csv_to_html_table.js b/js/csv_to_html_table.js index 471772ad..7cf219da 100644 --- a/js/csv_to_html_table.js +++ b/js/csv_to_html_table.js @@ -39,8 +39,8 @@ CsvToHtmlTable = { console.log("column filter") console.log(headerIdx) console.log(this.value) - if ( $table.column(headerIdx).search() !== this.value ) { - $table + if ( data_table_g.column(headerIdx).search() !== this.value ) { + data_table_g .column(headerIdx) .search( this.value ) .draw(); From d99d225526518284316db1cc560c2f830d9ae83b Mon Sep 17 00:00:00 2001 From: Roberto Velasco Segura Date: Fri, 20 Jul 2018 12:14:42 -0500 Subject: [PATCH 10/20] column number --- js/csv_to_html_table.js | 13 +++++++------ 1 file changed, 7 insertions(+), 6 deletions(-) diff --git a/js/csv_to_html_table.js b/js/csv_to_html_table.js index 7cf219da..447afc88 100644 --- a/js/csv_to_html_table.js +++ b/js/csv_to_html_table.js @@ -36,14 +36,15 @@ CsvToHtmlTable = { for (var headerIdx = 0; headerIdx < csvHeaderRow.length; headerIdx++) { $tableHeadRow_filter.append($("").html('')); $tableHeadRow_filter[0].childNodes[headerIdx].childNodes[0].onchange = function() { + // Thanks to https://stackoverflow.com/questions/5913927 + // get column number + var i = 0; + var th_e = this.parentNode; + while( (th_e = th_e.previousSibling) != null ) { i++ } console.log("column filter") - console.log(headerIdx) + console.log(i) console.log(this.value) - if ( data_table_g.column(headerIdx).search() !== this.value ) { - data_table_g - .column(headerIdx) - .search( this.value ) - .draw(); + data_table_g.column(i).search( this.value ).draw(); } } } From 92664fc4d72eb4bc1ce9b4fdb7682985a44ae060 Mon Sep 17 00:00:00 2001 From: Roberto Velasco Segura Date: Fri, 20 Jul 2018 12:17:17 -0500 Subject: [PATCH 11/20] bugfix --- js/csv_to_html_table.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/js/csv_to_html_table.js b/js/csv_to_html_table.js index 447afc88..35560b52 100644 --- a/js/csv_to_html_table.js +++ b/js/csv_to_html_table.js @@ -44,8 +44,7 @@ CsvToHtmlTable = { console.log("column filter") console.log(i) console.log(this.value) - data_table_g.column(i).search( this.value ).draw(); - } + data_table_g.column(i).search(this.value).draw(); } } From 149291337d81263fc034e89659f982394bfae12e Mon Sep 17 00:00:00 2001 From: Roberto Velasco Segura Date: Fri, 20 Jul 2018 12:34:09 -0500 Subject: [PATCH 12/20] trynig to move sorting funtionality to column header --- js/csv_to_html_table.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/js/csv_to_html_table.js b/js/csv_to_html_table.js index 35560b52..23959713 100644 --- a/js/csv_to_html_table.js +++ b/js/csv_to_html_table.js @@ -30,7 +30,6 @@ CsvToHtmlTable = { for (var headerIdx = 0; headerIdx < csvHeaderRow.length; headerIdx++) { $tableHeadRow.append($("").text(csvHeaderRow[headerIdx])); } - $tableHead.append($tableHeadRow); var $tableHeadRow_filter = $(""); for (var headerIdx = 0; headerIdx < csvHeaderRow.length; headerIdx++) { @@ -50,6 +49,8 @@ CsvToHtmlTable = { $tableHead.append($tableHeadRow_filter); + $tableHead.append($tableHeadRow); + $table.append($tableHead); var $tableBody = $(""); From 0aa71c258b18483d799610ccf48f6288994144aa Mon Sep 17 00:00:00 2001 From: Roberto Velasco Segura Date: Fri, 20 Jul 2018 12:34:34 -0500 Subject: [PATCH 13/20] declare another event --- js/csv_to_html_table.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/js/csv_to_html_table.js b/js/csv_to_html_table.js index 23959713..198b2dda 100644 --- a/js/csv_to_html_table.js +++ b/js/csv_to_html_table.js @@ -45,6 +45,8 @@ CsvToHtmlTable = { console.log(this.value) data_table_g.column(i).search(this.value).draw(); } + $tableHeadRow_filter[0].childNodes[headerIdx].childNodes[0].onkeyup = + $tableHeadRow_filter[0].childNodes[headerIdx].childNodes[0].onchange } $tableHead.append($tableHeadRow_filter); From 169e624a19c8e4fb992143127a53da1202b4719e Mon Sep 17 00:00:00 2001 From: Roberto Velasco Segura Date: Fri, 20 Jul 2018 12:45:20 -0500 Subject: [PATCH 14/20] tryin to get the right column number --- js/csv_to_html_table.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/js/csv_to_html_table.js b/js/csv_to_html_table.js index 198b2dda..697ef9fe 100644 --- a/js/csv_to_html_table.js +++ b/js/csv_to_html_table.js @@ -34,7 +34,7 @@ CsvToHtmlTable = { var $tableHeadRow_filter = $(""); for (var headerIdx = 0; headerIdx < csvHeaderRow.length; headerIdx++) { $tableHeadRow_filter.append($("").html('')); - $tableHeadRow_filter[0].childNodes[headerIdx].childNodes[0].onchange = function() { + $tableHeadRow_filter[0].childNodes[headerIdx].childNodes[0].onchange = function(headerIdx) { // Thanks to https://stackoverflow.com/questions/5913927 // get column number var i = 0; @@ -42,6 +42,7 @@ CsvToHtmlTable = { while( (th_e = th_e.previousSibling) != null ) { i++ } console.log("column filter") console.log(i) + console.log(headerIdx) console.log(this.value) data_table_g.column(i).search(this.value).draw(); } From 4caab947aff8700f14c05dab3c8b10b77165ee40 Mon Sep 17 00:00:00 2001 From: Roberto Velasco Segura Date: Fri, 20 Jul 2018 13:00:41 -0500 Subject: [PATCH 15/20] get more info --- js/csv_to_html_table.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/js/csv_to_html_table.js b/js/csv_to_html_table.js index 697ef9fe..d922341a 100644 --- a/js/csv_to_html_table.js +++ b/js/csv_to_html_table.js @@ -34,7 +34,7 @@ CsvToHtmlTable = { var $tableHeadRow_filter = $(""); for (var headerIdx = 0; headerIdx < csvHeaderRow.length; headerIdx++) { $tableHeadRow_filter.append($("").html('')); - $tableHeadRow_filter[0].childNodes[headerIdx].childNodes[0].onchange = function(headerIdx) { + $tableHeadRow_filter[0].childNodes[headerIdx].childNodes[0].onchange = function(arg1, arg2, arg3) { // Thanks to https://stackoverflow.com/questions/5913927 // get column number var i = 0; @@ -43,6 +43,9 @@ CsvToHtmlTable = { console.log("column filter") console.log(i) console.log(headerIdx) + console.log(arg1) + console.log(arg2) + console.log(arg3) console.log(this.value) data_table_g.column(i).search(this.value).draw(); } From ccab38ea94d29a65f9523add5b43dfb2d72bfd56 Mon Sep 17 00:00:00 2001 From: Roberto Velasco Segura Date: Fri, 20 Jul 2018 13:08:41 -0500 Subject: [PATCH 16/20] using the tag id --- js/csv_to_html_table.js | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/js/csv_to_html_table.js b/js/csv_to_html_table.js index d922341a..59d0df29 100644 --- a/js/csv_to_html_table.js +++ b/js/csv_to_html_table.js @@ -33,7 +33,8 @@ CsvToHtmlTable = { var $tableHeadRow_filter = $(""); for (var headerIdx = 0; headerIdx < csvHeaderRow.length; headerIdx++) { - $tableHeadRow_filter.append($("").html('')); + $tableHeadRow_filter.append($("").html( + '')); $tableHeadRow_filter[0].childNodes[headerIdx].childNodes[0].onchange = function(arg1, arg2, arg3) { // Thanks to https://stackoverflow.com/questions/5913927 // get column number @@ -43,9 +44,9 @@ CsvToHtmlTable = { console.log("column filter") console.log(i) console.log(headerIdx) - console.log(arg1) - console.log(arg2) - console.log(arg3) + console.log(arg1.target.id) + console.log(arg1.target.id.substr(6)) + console.log(parseInt(arg1.target.id.substr(6))) console.log(this.value) data_table_g.column(i).search(this.value).draw(); } From 8e50c96b53b7c8f72edae00baa2bbc403442eb04 Mon Sep 17 00:00:00 2001 From: Roberto Velasco Segura Date: Fri, 20 Jul 2018 13:10:11 -0500 Subject: [PATCH 17/20] bugfix --- js/csv_to_html_table.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/csv_to_html_table.js b/js/csv_to_html_table.js index 59d0df29..ddbb98b7 100644 --- a/js/csv_to_html_table.js +++ b/js/csv_to_html_table.js @@ -34,7 +34,7 @@ CsvToHtmlTable = { var $tableHeadRow_filter = $(""); for (var headerIdx = 0; headerIdx < csvHeaderRow.length; headerIdx++) { $tableHeadRow_filter.append($("").html( - '')); + '')); $tableHeadRow_filter[0].childNodes[headerIdx].childNodes[0].onchange = function(arg1, arg2, arg3) { // Thanks to https://stackoverflow.com/questions/5913927 // get column number From c81eeee2c98c6a375d2da133299ba8604bc5d79a Mon Sep 17 00:00:00 2001 From: Roberto Velasco Segura Date: Fri, 20 Jul 2018 13:12:31 -0500 Subject: [PATCH 18/20] housekeeping --- js/csv_to_html_table.js | 8 +------- 1 file changed, 1 insertion(+), 7 deletions(-) diff --git a/js/csv_to_html_table.js b/js/csv_to_html_table.js index ddbb98b7..e279485b 100644 --- a/js/csv_to_html_table.js +++ b/js/csv_to_html_table.js @@ -38,15 +38,9 @@ CsvToHtmlTable = { $tableHeadRow_filter[0].childNodes[headerIdx].childNodes[0].onchange = function(arg1, arg2, arg3) { // Thanks to https://stackoverflow.com/questions/5913927 // get column number - var i = 0; - var th_e = this.parentNode; - while( (th_e = th_e.previousSibling) != null ) { i++ } + var i = parseInt(arg1.target.id.substr(6)); console.log("column filter") console.log(i) - console.log(headerIdx) - console.log(arg1.target.id) - console.log(arg1.target.id.substr(6)) - console.log(parseInt(arg1.target.id.substr(6))) console.log(this.value) data_table_g.column(i).search(this.value).draw(); } From 06b09ec0515349ed9ebc49d58bc2bdb14cce5146 Mon Sep 17 00:00:00 2001 From: Roberto Velasco Segura Date: Fri, 20 Jul 2018 16:04:21 -0500 Subject: [PATCH 19/20] option added to add column filters --- js/csv_to_html_table.js | 33 +++++++++++++++------------------ 1 file changed, 15 insertions(+), 18 deletions(-) diff --git a/js/csv_to_html_table.js b/js/csv_to_html_table.js index e279485b..5cd6e98f 100644 --- a/js/csv_to_html_table.js +++ b/js/csv_to_html_table.js @@ -1,5 +1,5 @@ var CsvToHtmlTable = CsvToHtmlTable || {}; -var data_table_g = {}; +var CsvToHtmlTable_DataTable = {}; CsvToHtmlTable = { init: function (options) { @@ -9,6 +9,7 @@ CsvToHtmlTable = { var allow_download = options.allow_download || false; var csv_options = options.csv_options || {}; var datatables_options = options.datatables_options || {}; + var column_filters = options.column_filters || false; var custom_formatting = options.custom_formatting || []; var customTemplates = {}; $.each(custom_formatting, function (i, v) { @@ -31,25 +32,21 @@ CsvToHtmlTable = { $tableHeadRow.append($("").text(csvHeaderRow[headerIdx])); } - var $tableHeadRow_filter = $(""); - for (var headerIdx = 0; headerIdx < csvHeaderRow.length; headerIdx++) { - $tableHeadRow_filter.append($("").html( - '')); - $tableHeadRow_filter[0].childNodes[headerIdx].childNodes[0].onchange = function(arg1, arg2, arg3) { - // Thanks to https://stackoverflow.com/questions/5913927 - // get column number - var i = parseInt(arg1.target.id.substr(6)); - console.log("column filter") - console.log(i) - console.log(this.value) - data_table_g.column(i).search(this.value).draw(); + if (column_filters) { + var $tableHeadRow_filter = $(""); + for (var headerIdx = 0; headerIdx < csvHeaderRow.length; headerIdx++) { + $tableHeadRow_filter.append($("").html( + '')); + $tableHeadRow_filter[0].childNodes[headerIdx].childNodes[0].onchange = function(ee) { + var i = parseInt(ee.target.id.substr(6)); + CsvToHtmlTable_DataTable.column(i).search(this.value).draw(); + } + $tableHeadRow_filter[0].childNodes[headerIdx].childNodes[0].onkeyup = + $tableHeadRow_filter[0].childNodes[headerIdx].childNodes[0].onchange } - $tableHeadRow_filter[0].childNodes[headerIdx].childNodes[0].onkeyup = - $tableHeadRow_filter[0].childNodes[headerIdx].childNodes[0].onchange + $tableHead.append($tableHeadRow_filter); } - $tableHead.append($tableHeadRow_filter); - $tableHead.append($tableHeadRow); $table.append($tableHead); @@ -72,7 +69,7 @@ CsvToHtmlTable = { } $table.append($tableBody); - data_table_g = $table.DataTable(datatables_options); + CsvToHtmlTable_DataTable = $table.DataTable(datatables_options); if (allow_download) { $containerElement.append("

Download as CSV

"); From 8f6c708975888037010be766fa6542cf0f31b453 Mon Sep 17 00:00:00 2001 From: Roberto Velasco Segura Date: Fri, 20 Jul 2018 17:23:39 -0500 Subject: [PATCH 20/20] housekeeping --- js/csv_to_html_table.js | 1 - 1 file changed, 1 deletion(-) diff --git a/js/csv_to_html_table.js b/js/csv_to_html_table.js index 5cd6e98f..8e6d6184 100644 --- a/js/csv_to_html_table.js +++ b/js/csv_to_html_table.js @@ -50,7 +50,6 @@ CsvToHtmlTable = { $tableHead.append($tableHeadRow); $table.append($tableHead); - var $tableBody = $(""); for (var rowIdx = 1; rowIdx < csvData.length; rowIdx++) {