-1
Pq is only working the last function of the addeventlistener method in my script. I’m developing filters in a Datatable that when I click the search button it filters the information in the table. Filter functions are working, but only work individually.
HTML:
<label for="proto">Protocolo</label>
<input type="text" class="form-control" name="proto" id="proto"
placeholder="Pesquisar...">
<label for="nome">Nome</label>
<input type="text" class="form-control" name="nome" id="nome"
placeholder="Pesquisar...">
<label for="doc">Documento</label>
<input type="text" class="form-control" name="doc" id="doc"
placeholder="Pesquisar...">
<button class="btn btn-primary btn-block" id="btnBuscar">Buscar</button>
Script:
function proto() {
var proto, filter, table, tr, td, i;
proto = document.getElementById("proto");
filter = proto.value.toUpperCase();
table = document.getElementById("table");
tr = table.getElementsByTagName("tr");
for (i = 0; i < tr.length; i++) {
td = tr[i].getElementsByTagName("td")[0];
if (td) {
if (td.innerHTML.toUpperCase().indexOf(filter) > -1) {
tr[i].style.display = "";
} else {
tr[i].style.display = "none";
}
}
}
}
function nome() {
var nome, filter, table, tr, td, i;
nome = document.getElementById("nome");
filter = nome.value.toUpperCase();
table = document.getElementById("table");
tr = table.getElementsByTagName("tr");
for (i = 0; i < tr.length; i++) {
td = tr[i].getElementsByTagName("td")[3];
if (td) {
if (td.innerHTML.toUpperCase().indexOf(filter) > -1) {
tr[i].style.display = "";
} else {
tr[i].style.display = "none";
}
}
}
}
function doc() {
var doc, filter, table, tr, td, i;
doc = document.getElementById("doc");
filter = doc.value.toUpperCase();
table = document.getElementById("table");
tr = table.getElementsByTagName("tr");
for (i = 0; i < tr.length; i++) {
td = tr[i].getElementsByTagName("td")[4];
if (td) {
if (td.innerHTML.toUpperCase().indexOf(filter) > -1) {
tr[i].style.display = "";
} else {
tr[i].style.display = "none";
}
}
}
}
document.getElementById("btnBuscar").addEventListener("click", function(){
proto();
doc();
nome();
});
Leandro the call for the 3 functions is correct, check the console of your browser if no error is displayed, try adding html to your question so we can test the functions :)
– Caique Romero
@Caiqueromero I inserted Html, in the console shows no error.
– LeAndrade
explain exactly your mistake and what is happening, add the question, if possible attach an image with what is happening and what should happen please
– Costamilam
@Guilhermecostamilam Then I have no way to inform you the error because not the error in the console, simply the button does not filter the table with the click of the button.
– LeAndrade
There is an error in the console?
– Guilherme Nascimento
@Guilhermecostamilam It didn’t happen No, it’s the same thing.
– LeAndrade