Change multiple glyphicons with one click

304
July 22, 2017, at 11:52 AM

I am using Bootstrap glyphicons as checkboxes for multiple nodes on a folder tree. I need to toggle all glyphicon checkboxes for a given folder (but ONLY THIS folder and ONLY CHECKBOXES) when said folder's checkbox is clicked.

<li data-layerid="Analises" data-grouped="group_Analises" class="parent_li">
  <span title="Collapse this branch"><i class="glyphicon glyphicon-file"></i> Analises</span>
  <i class="glyphicon glyphicon-unchecked" id="group_Analises" data-foldername="group_Analises"></i></li>
<li data-layerid="V%" data-grouped="2014">
  <span><i class="glyphicon glyphicon-file glyphicon-check"></i> V%</span>
  <i class="glyphicon glyphicon-check" id="2014" data-foldername="2014"></i> 
</li>
<li data-layerid="Ca" data-grouped="2014">
  <span><i class="glyphicon glyphicon-file glyphicon-check"></i> Ca</span>
  <i class="glyphicon glyphicon-check" id="2014" data-foldername="2014"></i> 
</li>

If I do this, I change all glyphicons on the page.

$('i').removeClass('glyphicon-check').addClass('glyphicon-unchecked');

If I attempt to access the id directly, I only manage to change the first element with this id, not all of them:

$('#2014').removeClass('glyphicon-check').addClass('glyphicon-unchecked');

Suggestions VERY welcome.

Answer 1

Try to remove id attribute on DOM, use data-foldername attribute instead.

$('i[data-foldername="2014"]').removeClass('glyphicon-check').addClass('glyphicon-unchecked');
Rent Charter Buses Company
READ ALSO
Recommendations on a commit calender library

Recommendations on a commit calender library

I am looking for a code commit calender library like githubsLike this

211
i have element and i want to press keydown up down left right each one the element will translate to diffierent positon

i have element and i want to press keydown up down left right each one the element will translate to diffierent positon

i have a class name side-build-boxcontrol-preseve-3d and i try to make controller by pressing key up down left right so the element will go down left right left , i use translate3d property because its css in 3d , but i tried many different way , always...

292
Highlight multiple records by using button click event javascript

Highlight multiple records by using button click event javascript

I found following code at JSFiddleThis code only highlight one row at a time

353
How to encode URL parameters for REST API call?

How to encode URL parameters for REST API call?

I have to create a some url parameters that I use in a REST API callI'm using Angularjs 1

447