I have a table with a button to add a comment about the item on that row. In this button I have a class = adicionar
that allows me to apply to all with this class the action of opening a bootstrap modal. My problem is that I can not identify which of these buttons was the modal trigger to change the style of it, which instead of being +
to add, should be an icon to view. Would anyone have a solution on how to know which .adicionar
button was triggered after the user clicked the btn_add_observacao
button?
<table>
<thead>
<tr>
<th>#</th>
<th>Aluno</th>
<th>Nota</th>
<th width="5%" title="Observação">Obs.</th>
<th width="5%">Ação</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>Rafael</td>
<td>6.58</td>
<td title="Observação">
<button type="button" class="btn btn-xs btn-success adicionar" title="Adicionar Observação" data-toggle="modal" data-target="#modal_observacao">
<span class="glyphicon glyphicon-plus"></span>
</button>
</td>
<td>
<button type="button" class="btn btn-xs btn-danger remover">
<span class="glyphicon glyphicon-remove"></span> Remover
</button>
</td>
</tr>
</tbody>
</table>
<!-- Modal Adicionar Observação -->
<div class="modal fade" id="modal_observacao" tabindex="-1" role="dialog" aria-labelledby="titulo" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h3 class="modal-title" id="titulo">Observação</h3>
</div>
<div class="modal-body">
<label for="texto_observacao" class="required">Digite no espaço abaixo a observação para esse pedido</label>
<textarea class="form-control" id="texto_observacao" name="texto_observacao" rows="5"></textarea>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary" id="btn_add_observacao" name="btn_add_observacao" >Adicionar</button>
</div>
</div>
</div>
</div>