I have a folowing problem.
On click button Filter I want get entries with selected city.
SO forbid me write big code, so I show only div with data. I think you can add select with options, if you want.
(Select id = "cityFilter" , options: Dnepr, Kharkiv, Lviv)
HTML:
<div id="data">
<div>
<a class="userEmail" href="#">[email protected] </a>
<span> user1 </span>
<span> Dnepr </span>
<span><input type = "button" value = "x" /></span>
</div>
<div>
<a class="userEmail" href="#">[email protected] </a>
<span> user2 </span>
<span> Kharkiv </span>
<span><input type = "button" value = "x" /></span>
</div>
<div>
<a class="userEmail" href="#"> [email protected] </a>
<span> user3 </span>
<span> Lviv </span>
<span><input type = "button" value = "x" /></span>
</div>
<div>
<a class="userEmail" href="#"> [email protected] </a>
<span> user4 </span>
<span> Dnepr </span>
<span><input type = "button" value = "x" /></span>
</div>
<div>
<a class="userEmail" href="#"> [email protected] </a>
<span> user5 </span>
<span> Lviv </span>
<span><input type = "button" value = "x" /></span>
</div>
</div>
cityFilter.js (The description of the code in comments):
$(function() {
//click on button
$('body > input').on('click', function() {
//get selected value
var cityFilter = $('#cityFilter').val();
//sort out spans which contains city names
$('#data > div > a + span + span').each(function() {
//for check the received value
console.log($(this).text());
//compare selected value and span text
if ($(this).text() != cityFilter) {
console.log('true');
}
});
});
});
I got all true. Where is the problem ?
your spans have leading and trailing spaces
i.e. " abc " != "abc"
try the following instead:
if ($(this).text().trim() != cityFilter) {
console.log('true');
}
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments