Hugging Face's logo

Spaces:
DMTuit
/
gc_api_ra
Sleeping

App Files Community
DmitrMakeev commited on
Commit
21c4ec3
·
verified ·
1 Parent(s): a2a453d

Update data_gc_tab.html

Browse files
Files changed (1) hide show
  1. data_gc_tab.html +9 -22
data_gc_tab.html CHANGED
@@ -6,7 +6,7 @@
6
  <title>Tabulator Example</title>
7
  <link href="https://unpkg.com/[email protected]/dist/css/tabulator.min.css" rel="stylesheet">
8
  <script type="text/javascript" src="https://unpkg.com/[email protected]/dist/js/tabulator.min.js"></script>
9
- <style>
10
  body {
11
  font-family: Arial, sans-serif;
12
  text-align: center;
@@ -119,7 +119,6 @@
119
  #filter-clear:hover {
120
  background-color: #388E3C;
121
  }
122
-
123
  </style>
124
  </head>
125
  <body>
@@ -163,7 +162,7 @@
163
 
164
  <button id="filter-clear">Очистить фильтр</button>
165
 
166
- <input type="checkbox" id="select-filtered-data-checkbox"> Выбрать отфильтрованные данные для экспорта
167
  </div>
168
  <div id="example-table"></div>
169
 
@@ -235,14 +234,14 @@
235
  {title:"utm_medium", field:"pr2"},
236
  {title:"utm_campaign", field:"pr3"},
237
  {title:"utm_term", field:"pr4"},
238
- {title:"utm_content", field:"pr5"}
 
239
  ],
240
  });
241
  // Define variables for input elements
242
  var fieldEl = document.getElementById("filter-field");
243
  var typeEl = document.getElementById("filter-type");
244
  var valueEl = document.getElementById("filter-value");
245
- var selectFilteredDataCheckbox = document.getElementById("select-filtered-data-checkbox");
246
  // Trigger setFilter function with correct parameters
247
  function updateFilter() {
248
  var filterVal = fieldEl.options[fieldEl.selectedIndex].value;
@@ -250,12 +249,6 @@
250
  if (filterVal) {
251
  table.setFilter(filterVal, typeVal, valueEl.value);
252
  }
253
- if (selectFilteredDataCheckbox.checked) {
254
- var filteredData = table.getData("filtered");
255
- var jsonData = JSON.stringify(filteredData);
256
- window.filteredDataJSON = jsonData;
257
- console.log("Отфильтрованные данные преобразованы в JSON:", jsonData);
258
- }
259
  }
260
  // Update filters on value change
261
  document.getElementById("filter-field").addEventListener("change", updateFilter);
@@ -268,17 +261,11 @@
268
  valueEl.value = "";
269
  table.clearFilter();
270
  });
271
- // Handle checkbox change for exporting filtered data
272
- selectFilteredDataCheckbox.addEventListener("change", function() {
273
- if (this.checked) {
274
- var filteredData = table.getData("filtered");
275
- var jsonData = JSON.stringify(filteredData);
276
- window.filteredDataJSON = jsonData;
277
- console.log("Отфильтрованные данные преобразованы в JSON:", jsonData);
278
- } else {
279
- window.filteredDataJSON = null;
280
- console.log("Выбор отфильтрованных данных для экспорта отменен");
281
- }
282
  });
283
  })
284
  .catch(error => console.error('Error fetching data:', error));
 
6
  <title>Tabulator Example</title>
7
  <link href="https://unpkg.com/[email protected]/dist/css/tabulator.min.css" rel="stylesheet">
8
  <script type="text/javascript" src="https://unpkg.com/[email protected]/dist/js/tabulator.min.js"></script>
9
+ <style>
10
  body {
11
  font-family: Arial, sans-serif;
12
  text-align: center;
 
119
  #filter-clear:hover {
120
  background-color: #388E3C;
121
  }
 
122
  </style>
123
  </head>
124
  <body>
 
162
 
163
  <button id="filter-clear">Очистить фильтр</button>
164
 
165
+ <button id="generate-json">Сгенерировать JSON</button>
166
  </div>
167
  <div id="example-table"></div>
168
 
 
234
  {title:"utm_medium", field:"pr2"},
235
  {title:"utm_campaign", field:"pr3"},
236
  {title:"utm_term", field:"pr4"},
237
+ {title:"utm_content", field:"pr5"},
238
+ {title:"Флажок", field:"flag", formatter:"tickCross", hozAlign:"center", editor:true, width:100} // Новый столбец
239
  ],
240
  });
241
  // Define variables for input elements
242
  var fieldEl = document.getElementById("filter-field");
243
  var typeEl = document.getElementById("filter-type");
244
  var valueEl = document.getElementById("filter-value");
 
245
  // Trigger setFilter function with correct parameters
246
  function updateFilter() {
247
  var filterVal = fieldEl.options[fieldEl.selectedIndex].value;
 
249
  if (filterVal) {
250
  table.setFilter(filterVal, typeVal, valueEl.value);
251
  }
 
 
 
 
 
 
252
  }
253
  // Update filters on value change
254
  document.getElementById("filter-field").addEventListener("change", updateFilter);
 
261
  valueEl.value = "";
262
  table.clearFilter();
263
  });
264
+ // Handle button click for generating JSON
265
+ document.getElementById("generate-json").addEventListener("click", function() {
266
+ var tableData = table.getData(); // Получаем все данные таблицы
267
+ var jsonData = JSON.stringify(tableData, null, 2); // Преобразуем данные в JSON-строку
268
+ console.log(jsonData); // Выводим JSON-строку в консоль (или можете использовать другой метод для отображения)
 
 
 
 
 
 
269
  });
270
  })
271
  .catch(error => console.error('Error fetching data:', error));