Przepraszam, jeśli używam złej terminologii.
Mam działający kod javascript w pliku php, który filtruje dane wyświetlane w tabeli pozycji magazynowych w interfejsie strony WordPress.
Tj. wyszukiwanie według numeru seryjnego i im więcej wpisujesz, tym mniej elementów jest wyświetlanych na interfejsie WordPress, aż do znalezienia jednego unikalnego elementu.
Klient chce mieć możliwość wyszukiwania na różne sposoby - a ja mogę zmienić, który pojedynczy temat jest przeszukiwany, np. Mogę sprawić, że będzie wyszukiwać według numeru wysyłki, numeru seryjnego, rodzaju aktywów, opisu itp., Ale nie mogę uzyskać wyszukiwania obejmującego wszystkie tematy. czyli id w kodzie pozwala mi wybrać tylko jeden z elementów
Jeśli zmienię tutaj „1” na „2” lub „3” itp., Zmieni to fokus wyszukiwania z kolumny 1 na 2 na 3 itd.
td = tr[i].getElementsByTagName("td")[1];
Czy ktoś może podpowiedzieć, jak przeszukiwać wszystkie dane w tym samym czasie?
<script>
function helloWorld() {
var input, filter, table, tr, td, sn, ty, own, i, id;
input = document.getElementById("myInput");
filter = input.value.toUpperCase();
table = document.getElementById("adminTable");
tr = table.getElementsByTagName("tr");
var data = new Array();
// Loop through all table rows, and hide those who don't match the search query
for (i = 0; i < tr.length; i++) {
td = tr[i].getElementsByTagName("td")[0];
if (td) {
if(td.children[0].checked) {
sn = tr[i].getElementsByTagName("td")[4];
ty = tr[i].getElementsByTagName("td")[9];
id = tr[i].getElementsByTagName("td")[10];
own = tr[i].getElementsByTagName("td")[11];
var record = {serial: sn.textContent || sn.innerText, type: ty.textContent || ty.innerText, id: id.textContent || id.innerText, owner: own.textContent || own.innerText};
data.push(record);
}
}
}
if(data.length > 0) {
var uri = JSON.stringify(data);
var res = encodeURIComponent(uri);
window.location.href = '../stock?transferData='.concat(res);
}
}
function myFunction() {
// Declare variables
var input, filter, table, tr, td, i, txtValue;
input = document.getElementById("myInput");
filter = input.value.toUpperCase();
table = document.getElementById("adminTable");
tr = table.getElementsByTagName("tr");
// Loop through all table rows, and hide those who don't match the search query
for (i = 0; i < tr.length; i++) {
td = tr[i].getElementsByTagName("td")[1];
if (td) {
txtValue = td.textContent || td.innerText;
if (txtValue.toUpperCase().indexOf(filter) > -1) {
tr[i].style.display = "";
} else {
tr[i].style.display = "none";
}
}
}
}
</script>
2 odpowiedzi
Ta biblioteka wyszukiwania javascript https://fusejs.io/ może być wszystkim, czego potrzebujesz. Być może będziesz musiał najpierw zmapować dane WP, ale pozwoli ci to wyszukać wszystko, co chcesz.
Spróbuj tego:
Zastąpić
for (i = 0; i < tr.length; i++) {
td = tr[i].getElementsByTagName("td")[1];
if (td) {
txtValue = td.textContent || td.innerText;
if (txtValue.toUpperCase().indexOf(filter) > -1) {
tr[i].style.display = "";
} else {
tr[i].style.display = "none";
}
}
}
Przez to
(Ustaw potrzebne numery kolumn na liście [1,4,5])
var columns = [1,4,5];
// Loop through all table rows, and hide those who don't match the search query
for (var j=0, lenj=columns.length; j < lenj; j++) {
for (i = 0; i < tr.length; i++) {
td = tr[i].getElementsByTagName("td")[columns[j]];
if (td) {
txtValue = td.textContent || td.innerText;
if (txtValue.toUpperCase().indexOf(filter) > -1) {
tr[i].style.display = "";
} else {
tr[i].style.display = "none";
}
}
}
}
Ctrl+Shift+i), a następnie kartę Konsola i wkleić tutaj czerwony tekst/błąd? Zakładam również, że wpisałeś prawidłowe numery kolumn na liście [1,4,5].
}, podczas gdy poprzedni kod miał 3 }. Tak więc po wklejeniu jest na końcu 5 }, tuż przed tagiem </script>.