- In
boostrapTable()
the first argument is method that we want to apply. In this case we were using"filterBy"
- The second argument is the filters that we want to apply and filter the records. In this case we were giving
"tags"
that has been selected. - The third argument we had given is filterAlgorithm which can be customized by giving own function instead of
"and"
&"or"
.
function checkTags(filterTags, rowTags) {
for (var i = 0; i < filterTags.length; i++) {
if (!rowTags.includes(filterTags[i])) {
return false;
}
}
return true;
}
The above code will returns true
in two cases:
- when no tags selected and
filterTags
array is empty. - if all filters tags are included in
rowTags
(this is what we want)
The loop will iterate according to the length of filterTags
(the tags that are given from the checked checkboxes).
true: If whole array is iterated and !rowTags.includes(filterTags[i])
condition (which means i
tag is not found in rowTags
array) not satisfy for all the elements in an array, then obviously it will returns true
. That means rowTags
contains all the elements that are in filterTags
array.
false: If element (tag in this case) at position i
of filterTags
array is not included in the rowTags
array (the tags that are in the table row), it will return false and stop the loop and does not iterate the rest of the element in the filterTags
array, if there are some remaining to iterate.
The second scenario is if filterTags
array is empty, means no tags are provided to filter then no loop will be iterated because of the condition i < filterTags.length
. And return true
will be executed.
Lets figure it out with some examples
var filterTags1 = ["Tag 1", "Tag 2"];
var rowTags1 = ["Tag 1", "Tag 2", "Tag 3"];
console.log(checkTags(filterTags1, rowTags1)); // Output: true
var filterTags2 = ["Tag 1", "Tag 2", "Tag3"];
var rowTags2 = ["Tag 1", "Tag 2", "Tag 3", "Tag3"];
console.log(checkTags(filterTags2, rowTags2)); // Output: true
var filterTags3 = ["Tag 1", "Tag 2"];
var rowTags3 = ["Tag 1", "Tag 3", "Tag 4"];
console.log(checkTags(filterTags3, rowTags3)); // Output: false
var filterTags4 = ["Tag 1", "Tag 2", "Tag 3"];
var rowTags4 = ["Tag 1", "Tag 2", "Tag 4"];
console.log(checkTags(filterTags4, rowTags4)); // Output: false
var filterTags5 = ["Tag 1", "Tag 2", "Tag 3"];
var rowTags5 = ["Tag 1", "Tag 2"];
console.log(checkTags(filterTags5, rowTags5)); // Output: false
var filterTags6 = [];
var rowTags6 = ["Tag 1", "Tag 2"];
console.log(checkTags(filterTags6, rowTags6)); // Output: true
function checkTags(filterTags, rowTags) {
return filterTags.every(tag => rowTags.includes(tag));
}
In the above code, we use the every()
method, which checks if every element in the filterTags
array satisfies a given condition. The condition, in this case, is whether each tag in filterTags
is present in rowTags
using the includes()
method.
If all tags in filterTags
are found in rowTags
, the every()
method returns true
. Otherwise, it returns false
.
for (var i = 0; i < filterTags.length; i++) {
if (rowTags.includes(filterTags[i])) {
return true;
}
}
return false;
The above code will returns false
in two cases:
- when no tags selected and
filterTags
array is empty. (this is the issue you may not like) - if all filters tags are not included in
rowTags
array
The loop will iterate according to the length of filterTags
(the tags that are given from the checked checkboxes).
true: If any of the element (tag in this case) at position i
of filterTags
array is included in the array of rowTags
(the tags that are in the table row), it will returns "true".
false: If whole array is iterated and rowTags.includes(filterTags[i])
condition not satisfy for all the elements in an array, then obviously it will returns fase
. That means rowTags
array does not contains any of the element that is in filterTags
array.
The second scenario is if filterTags
array is empty, means no tags are provided to filter then no loop will be iterated because of the condition i < filterTags.length
. And return false
will be executed.
Lets figure it out with some examples
var filterTags1 = ["Tag 1", "Tag 2", "Tag 3"];
var rowTags1 = ["Tag 1", "Tag 2"];
console.log(checkTags(filterTags1, rowTags1)); // Output: true
var filterTags2 = ["Tag 1"];
var rowTags2 = ["Tag 1", "Tag 2"];
console.log(checkTags(filterTags2, rowTags2)); // Output: true
var filterTags3 = ["Tag 3", "Tag 4", "Tag 5"];
var rowTags3 = ["Tag 1", "Tag 2"];
console.log(checkTags(filterTags3, rowTags3)); // Output: false
var filterTags4 = [];
var rowTags4 = ["Tag 1", "Tag 2"];
console.log(checkTags(filterTags4, rowTags4)); // Output: false
function checkTags(filterTags, rowTags) {
return filterTags.some((tag) => rowTags.includes(tag));
}
In the above code, the some()
method checks if at least one element in the array satisfies a given condition. In this case, it iterates over each element (tag) in the filterTags
array and checks if rowTags
includes that particular tag. If rowTags
includes at least one tag from filterTags
, the some()
method returns true
. Otherwise, it returns false
.
It returns true
if at least one tag from filterTags
is found in rowTags
. If no tags match, it returns false
.