FILTRADO DE TABLA MEDIANTE DOS SELECT OPTION
Publicado por Jessica (6 intervenciones) el 25/10/2017 17:15:36
Hola a todos, soy nueva en este foro pero ya anduve buscando por todos lados información y no logro encontrar nada. Estoy buscando filtrar una tabla que me arroja los resultados de equipos de computo con sus respectivas caracteristicas, tengo dos SELECT OPTION en mi web y trato de filtrar mediante ambas ya sea por Tipo de equipo (ESCRITORIO, LAPTOP O THIN CLIENT) o Marca(ACER, HP, GENERICO, ..... ETC), mi función js si lo hace, solo que cuando selecciono por ejemplo el tipo de equipo (LAPTOP) y despues la marca (HP) me filtra todo de nuevo, no me trae las laptop HP si no, todos los equipo HP. les dejo el codigo de mi funcion y espero puedan ayudarme a resolver sobre la misma funcion la forma en que deberia codificar para que ambos select esten relacionados. Gracias!.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
// FUNCION PARA FILTRAR POR SELECT TIPO EQUIPO
$(document).ready(function($) {
$('table').show();
$('#tipo_equipo').change(function() {
$('table').show();
var selection = $(this).val();
if (selection === '-Todos-') {
$('tr').show();
} else {var dataset = $('#teq .contenidobusqueda').find('tr');
// show all rows first
dataset.show();
} // filter the rows that should be hidden
dataset.filter(function(index, item) {
return $(item).find('#third-child').text().split(',').indexOf(selection) === -1;
}).hide();
});
});
// FUNCION PARA FILTRAR POR SELECT MARCA
$(document).ready(function($) {
$('table').show();
$('#marca_eq').change(function() {
$('table').show();
var selection = $(this).val();
if (selection === '-Todas-') {
$('tr').show();
} else {var dataset = $('#teq .contenidobusqueda').find('tr');
// show all rows first
dataset.show();
} // filter the rows that should be hidden
dataset.filter(function(index, item) {
return $(item).find('#fourth-child').text().split(',').indexOf(selection) === -1;
}).hide();
});
});
<!-- SELECT TIPO DE EQUIPO --><div class="form-group">
<label for="tipo_equipo" class="col-sm-2 control-label">Tipo Equipo:</label>
<div class="col-sm-10">
<div class="input-group input-group-sm">
<select id="tipo_equipo" name="tipo_equipo" class="form-control">
<option value="-Todos-">-Todos-</option>
<option value="DE ESCRITORIO">DE ESCRITORIO</option>
<option value="LAPTOP">LAPTOP</option>
<option value="THIN CLIENT">THIN CLIENT</option>
</select>
</div>
</div>
</div>
<!-- SELECT MARCA --><div class="form-group">
<label for="marca_eq" class="col-sm-2 control-label">Marca:</label>
<div class="col-sm-10">
<div class="input-group input-group-sm">
<select id="marca_eq" name="marca_eq" class="form-control">
<option value="-Todas-">-Todas-</option>
<option value="3COM">3COM</option>
<option value="ACER">ACER</option>
<option value="ACTEK">ACTEK</option>
<option value="ADATA">ADATA</option>
<option value="BENQ">BENQ</option>
<option value="BROTHER">BROTHER</option>
<option value="CANON">CANON</option>
<option value="CNET">CNET</option>
<option value="COMPAQ">COMPAQ</option>
<option value="DELL">DELL</option>
<option value="EME">EME</option>
<option value="EPSON">EPSON</option>
<option value="GENERICO">GENERICO</option>
<option value="HP">HP</option>
<option value="IBM">IBM</option>
<option value="IUSACELL">IUSACELL</option>
<option value="KODAK">KODAK</option>
<option value="KONICA MINOLTA">KONICA MINOLTA</option>
<option value="LENOVO">LENOVO</option>
<option value="LEXMARK">LEXMARK</option>
<option value="LG">LG</option>
<option value="MANHATTAN">MANHATTAN</option>
<option value="MARKVISION">MARKVISION</option>
<option value="MICROSOFT">MICROSOFT</option>
<option value="MICROTEK">MICROTEK</option>
<option value="MOTOROLA">MOTOROLA</option>
<option value="OLIVETTI">OLIVETTI</option>
<option value="PERFECT CHOICE">PERFECT CHOICE</option>
<option value="PRINTAFORM">PRINTAFORM</option>
<option value="PROTEUS">PROTEUS</option>
<option value="SAMSUNG">SAMSUNG</option>
<option value="SEAGATE">SEAGATE</option>
<option value="SHARP">SHARP</option>
<option value="SOLA BASIC">SOLA BASIC</option>
<option value="SONY">SONY</option>
<option value="TDE">TDE</option>
<option value="TOSHIBA">TOSHIBA</option>
<option value="VIEWSONIC">VIEWSONIC</option>
<option value="VOLTELECT">VOLTELECT</option>
<option value="XEROX">XEROX</option>
</select>
</div>
</div>
</div>
<!-- AQUI IMPIRMO LA TABLA --><div id="tablaEq" class="form-group" style="display:none;" >
<div class="col-md-6 col-md-offset-3" style="overflow-y:scroll; height: 350px; width: 830px;">
<!--MOSTRAR TODOS LOS EQUIPOS EN LA TABLA--> <!-- CONSULTA --><?php
$sql1 = "SELECT numControl, numContraloria, dbo.tipoEquipo.descripcion as 'tipoEquipo', dbo.marca.nombreMarca as 'marca', serie, dbo.area.nombreArea as 'NombreArea' from dbo.equipo INNER JOIN dbo.tipoEquipo ON dbo.equipo.idTipoEquipo = dbo.tipoEquipo.idTipoEquipo
INNER JOIN dbo.marca ON dbo.equipo.idMarca = dbo.marca.idMarca INNER JOIN dbo.area ON dbo.equipo.idArea = dbo.area.idArea where dbo.equipo.idArea= '" . $_SESSION['idArea'] . "' order by numControl asc";
$result1 = sqlsrv_query($conn, $sql1);
?>
<table id="teq">
<thead>
<tr>
<th id = "nce">N° Control</th>
<th id = "nie">N° Inventario</th>
<th id = "te">Tipo Equipo</th>
<th id = "me">Marca</th>
<th id = "nse">N° Serie</th>
<th id = "ae">Área</th>
<th id = "acce">Acción</th>
</tr>
</thead>
<?php while ($row1 = sqlsrv_fetch_array($result1)) {
?>
<tbody class="contenidobusqueda">
<tr>
<td><?php echo $row1['numControl']; ?></td>
<td><?php echo $row1['numContraloria']; ?></td>
<td id="third-child"><?php echo $row1['tipoEquipo']; ?></td>
<td id="fourth-child"><?php echo $row1['marca']; ?></td>
<td><?php echo $row1['serie']; ?></td>
<td><?php echo $row1['NombreArea']; ?></td>
<td><input type="button" value="Seleccionar" /></td>
</tr>
</tbody>
<?php } ?>
</table>
</div>
<?
echo $mensaje;
?>
</div>
</div>
Valora esta pregunta
0