I have a table with several columns and rows (populated with jquery), and I wanted to filter after clicking a button, and filter according to what is written in the input. How do you do that? I'm still learning.
<!--------- CAMPOS P/ PESQUISA -------->
<div class="row">
<form class="form-horizontal" id="form-filtro">
<div class="form-group">
<label class="col-md-2 control-label">Data de Inclusão:</label>
<div class="col-md-4">
<input type="text" name="periodoInicio" id="periodoInicio" class="form-control pull-left datepicker" style="width:105px;" placeholder="01/01/2016">
<label class="control-label pull-left" style="margin:0px 10px;">Até</label>
<input type="text" name="periodoFim" id="periodoFim" class="form-control pull-left datepicker" style="width:105px;" placeholder="31/12/2016">
</div>
</div>
<div class="form-group">
<label class="col-md-2 control-label">Nome:</label>
<div class="col-md-6">
<input type="text" name="nome" id="nome" class="form-control pull-left" placeholder="Digite o Nome da Pessoa">
</div>
</div>
<div class="form-group">
<label class="col-md-2 control-label">Empresa:</label>
<div class="col-md-6">
<input type="text" name="empresa" id="empresa" class="form-control pull-left" placeholder="Digite o nome da Empresa">
</div>
</div>
<!--------- BOTÃO -------->
<div class="form-group col-md-3">
<div class="col-md-offset-7 col-md-2">
<button type="button" class="btn btn-default" id="btn-pesquisa" style="height:35px; width:100px;">Pesquisar</button>
</div>
</div>
</form>
</div>
<!--------- TABELA -------->
<div class="row">
<table id="table-questionario">
<thead>
<tr>
<th data-field="empresa">EMPRESA</th>
<th data-field="nome">NOME</th>
<th data-field="cpf">CPF</th>
<th data-field="idade">IDADE</th>
<th data-field="telefone">TELEFONE</th>
<th data-field="pergunta">PERGUNTA</th>
<th data-field="resposta">RESPOSTA</th>
<th data-field="dtpesquisa">DATA DA PESQUISA</th>
</tr>
</thead>
</table>
</div>
HOW I AM POPULATING THE TABLE ...
$(function () {
var RetornaDados = function () {
var dados = [
{
"empresa": "BRInsurance",
"nome": "Marcos",
"cpf": "12345685220",
"idade": "21",
"telefone": "4562-4562",
"pergunta": "Pergunta...",
"resposta": "Resposta...",
"dtpesquisa": "18/09/2016",
},
{
"empresa": "BRInsurance",
"nome": "Marcos",
"cpf": "12345685220",
"idade": "21",
"telefone": "4562-4562",
"pergunta": "Pergunta...",
"resposta": "Resposta...",
"dtpesquisa": "06/09/2016",
},
{
"empresa": "BRInsurance",
"nome": "Marcos",
"cpf": "12345685220",
"idade": "21",
"telefone": "4562-4562",
"pergunta": "Pergunta...",
"resposta": "Resposta...",
"dtpesquisa": "06/09/2016",
}
];
return dados;
}
$('#table-questionario').bootstrapTable({
data: RetornaDados(),
pagination: true,
pageSize: 10,
search: true,
showRefresh: true,
showExport: true,
sidePagination: 'client',
dataClickToSelect: true,
});
});