I need to show specific array data from my global array.
var objSport = ['Football', 'Rugby', 'Tennis', 'Badminton', 'Hiking', 'Fishing']; //Global Array Sport var objTime = ['10:00', '12:00', '14:00', '16:00', '19:00', '18:00']; //Global Array Sport Time var wantToShow = ['Football', 'Rugby', 'Tennis', 'Badminton', 'Fishing']; //Without Hiking 19:00
So on that code above, I need to take out/hide Hiking with time 19:00.
Here is the loop JS:
for(var i in objSport)
{
var newOption = $('<th class="th"><div class="name">'+wantToShow[i]+'</div><div class="time">'+objTime[i]+'</div></th>');
$('.tblSport').append(newOption);
}
and table HTML:
<table class="tblSport"></table>
I tried to run the code, Hiking is hide now but the time is not hide.
var wantToShow = ['Football', 'Rugby', 'Tennis', 'Badminton', 'Fishing']; //without hiking
var objSport = ['Football', 'Rugby', 'Tennis', 'Badminton', 'Hiking', 'Fishing'];
var objTime = ['10:00', '12:00', '14:00', '16:00', '19:00', '18:00'];
for(var i in objSport)
{
var newOption = $('<th class="th"><div class="name">'+wantToShow[i]+'</div><div class="time">'+objTime[i]+'</div></th>');
$('.tblSport').append(newOption);
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script> <table class="tblSport"></table>
Advertisement
Answer
Here is the code, one more if statement check.
var wantToShow = ['Football', 'Rugby', 'Tennis', 'Badminton', 'Fishing']; //without hiking
var objSport = ['Football', 'Rugby', 'Tennis', 'Badminton', 'Hiking', 'Fishing'];
var objTime = ['10:00', '12:00', '14:00', '16:00', '19:00', '18:00'];
for(var i in objSport)
{
if(wantToShow.indexOf(objSport[i]) > -1) {
var newOption = $('<th class="th"><div class="name">'+objSport[i]+'</div><div class="time">'+objTime[i]+'</div></th>');
$('.tblSport').append(newOption);
}
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script> <table class="tblSport"></table>