vacances2000
Gebruiker
- Lid geworden
- 28 jan 2013
- Berichten
- 113
Beste,
Ik heb een filter table die op zich prima werkt, maar naast mijn andere vraag (sorteerfunctie), zou ik ook graag standaard zoekwoorden willen instellen...
Ik heb 200 rijen. Wat ik wil, is er vooraf bijvoorbeeld restaurants uit filteren om zo dit op een category page "restaurants" te kunnen plaatsen.
Wanneer ik bij het <input></input> attribuut het extra element "value" toevoegt met als waarden "restaurant" invoer, zie ik wel "restaurant" in het filter veld verschijnen, maar de resultaten zijn er niet naar. Waarschijnlijk moet er iets bij de javascript gebeuren... Maar daar heb ik geen kennis van.
Iemand hiervoor een oplossing toevallig?
Dank voor de hulp.
Vriendelijke groeten,
Jonathan
Ik heb een filter table die op zich prima werkt, maar naast mijn andere vraag (sorteerfunctie), zou ik ook graag standaard zoekwoorden willen instellen...
Ik heb 200 rijen. Wat ik wil, is er vooraf bijvoorbeeld restaurants uit filteren om zo dit op een category page "restaurants" te kunnen plaatsen.
HTML:
<script>
(function(document) {
'use strict';
var LightTableFilter = (function(Arr) {
var _input;
function _onInputEvent(e) {
_input = e.target;
var tables = document.getElementsByClassName(_input.getAttribute('data-table'));
Arr.forEach.call(tables, function(table) {
Arr.forEach.call(table.tBodies, function(tbody) {
Arr.forEach.call(tbody.rows, _filter);
});
});
}
function _filter(row) {
var text = row.textContent.toLowerCase(), val = _input.value.toLowerCase();
row.style.display = text.indexOf(val) === -1 ? 'none' : 'table-row';
}
return {
init: function() {
var inputs = document.getElementsByClassName('light-table-filter');
Arr.forEach.call(inputs, function(input) {
input.oninput = _onInputEvent;
});
}
};
})(Array.prototype);
document.addEventListener('readystatechange', function() {
if (document.readyState === 'complete') {
LightTableFilter.init();
}
});
})(document);
</script>
HTML:
<input type="search" class="light-table-filter" data-table="order-table" placeholder="Filter">
<table>
</table>
Wanneer ik bij het <input></input> attribuut het extra element "value" toevoegt met als waarden "restaurant" invoer, zie ik wel "restaurant" in het filter veld verschijnen, maar de resultaten zijn er niet naar. Waarschijnlijk moet er iets bij de javascript gebeuren... Maar daar heb ik geen kennis van.
Iemand hiervoor een oplossing toevallig?
Dank voor de hulp.
Vriendelijke groeten,
Jonathan