Filtro a un cuadro javascript
Publicado por daiana (1 intervención) el 17/12/2021 13:57:39
hola! eh estado teniendo problemas con mi codigo para poder agregarle un checkbox y filtrar datos de una tabla que hice con javascript
Este es mi codigo javascript
mi html del apartado tabla se ve asi
y la idea es que se puedan filtrar los tipos de partido con checkbox y los estados con un menú desplegable
pueden guiarme acerca de como se puede realizar eso?
Este es mi codigo javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
let tableHeaders= document.getElementById ("table-headers");
let tableRows = document.getElementById ("table-rows");
renderTable(data);
function getRowsData(data) {
let i=0;return data.results[0].members.map(member =>{
i++;
return `
<tr>
<td>${i}</td>
<td><a href="${member.url}">${member.first_name} ${member.last_name}</a></td>
<td>${member.first_name} ${member.middle_name || ""}</td>
<td>${member.party}</td>
<td>${member.state}</td>
<td>${member.seniority}</td>
<td>${member.votes_with_party_pct}%</td>
</tr>
`
}).join("");
}function getHeadersData() {
return `
<tr>
<th></th>
<th>Senator</th>
<th>Name</th>
<th>Party affiliation</th>
<th>State</th>
<th>Seniority</th>
<th>Votes with party %</th>
</tr>
`
}function renderRows(data) {
let rows= getRowsData(data);
tableRows.innerHTML += rows;
}function renderHeaders() {
let headers = getHeadersData();
tableHeaders.innerHTML += headers;
}function renderTable(data) {
renderHeaders();
renderRows(data);
}1
2
3
4
<table id="senate-data" class="table table-striped">
<thead id="table-headers"></thead>
<tbody id="table-rows"></tbody>
</table>
y la idea es que se puedan filtrar los tipos de partido con checkbox y los estados con un menú desplegable
pueden guiarme acerca de como se puede realizar eso?
Valora esta pregunta
0
