<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript" class="init">
function estado(uf) {
var est = uf;
switch (est) {
case 'rs':
alert(uf);
break;
case 'sp':
alert(uf);
break;
default:
alert(uf);
break;
}
}
function getSettings()
{
var settings={
"scrollY": "200px",
"scrollCollapse": true,
"paging": false,
"sPaginationType": "full_numbers",
"bAutoWidth": false, //Desativa tamanho automático da tabela
"bFilter":true,
"bLengthChange": true,
"bPaginate": true, //Ativa paginação
"bSort": true,
"iDisplayLength": 10, //Trará os 10 primeiros itens
"processing": true,
"serverSide": true,
"bInfo": true,
"lengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]],
"language": { "url": "http://cdn.datatables.net/plug-ins/9dcbecd42ad/i18n/Portuguese-Brasil.json"},
"ajax": getUrl(),
"order": [[1, 'asc']],
"columns": [
{ "data": "idcliente","sWidth": "23%" },
{ "data": "nome", "sWidth": "23%" },
{ "data": "nomeestado", "sWidth": "10%" },
{ "data": "img_color", "sWidth": "20%" },
{ "data": "img_gray", "sWidth": "20%" },
{ "data": "link", "sWidth": "25%" }
],
'dom': 'lfrtip'
};
return settings;
}
function getUrl()
{
var url = 'http://portal171.hospedagemdesites.ws/Database/cview.php?view=vwclientes'+'&estados='+$('#campoestados').val();
alert(url);
return url;
}
function populaestados()
{
$.ajax({
type: 'get',
url: 'http://portal171.hospedagemdesites.ws/Database/campoestados.php',
success: function (response) {
document.getElementById("campoestados").innerHTML=response;
}
});
}
function preparatabela()
{
populaestados();
dt.columns( '.select-filter' ).every( function ()
{
var that = this;
// Create the select list and search operation
var select = $('<select />')
.appendTo(this.footer())
.on( 'change', function ()
{
that.search( $(this).val() ).draw();
}
);
// Get the search data for the first column and add to the select list
this
.cache( 'search' )
.sort()
.unique()
.each( function ( d ) {
select.append( $('<option value="'+d+'">'+d+'</option>') );
} );
} );
// Array to track the ids of the details displayed rows
var detailRows = [];
$('#example tbody').on( 'click', 'tr td.details-control', function () {
var tr = $(this).closest('tr');
var row = dt.row( tr );
var idx = $.inArray( tr.attr('idcliente'), detailRows );
if ( row.child.isShown() ) {
tr.removeClass( 'details' );
row.child.hide();
// Remove from the 'open' array
detailRows.splice( idx, 1 );
}
else {
tr.addClass( 'details' );
row.child( format( row.data() ) ).show();
// Add to the 'open' array
if ( idx === -1 ) {
detailRows.push( tr.attr('idcliente') );
}
}
} );
// On each draw, loop over the `detailRows` array and show any child rows
dt.on( 'draw', function () {
$.each( detailRows, function ( i, id ) {
$('#'+id+' td.details-control').trigger( 'click' );
} );
} );
}
$(document).ready(function() {
$('#global_smart').change(function ()
{
if ($("#global_smart").is(":checked"))
{
}
else
{
alert('aaaanao');
}
dt.ajax.url(getUrl()).load();
});
$('#campoestados').change(function ()
{
dt.ajax.url(getUrl()).load();
});
dt = $('#example').DataTable( getSettings() );
$.ajax({
type: 'get',
url: 'http://igorgouvea.com.br/database/gettipousuario.php',
success: function (response) {
response=response.replace(/(\r\n|\n|\r)/gm,"")
if(response=='administrator')
{
var tt = new $.fn.dataTable.TableTools( dt );
$( tt.fnContainer() ).insertBefore('div.fw-container2');
}
else
{
}
}
});
preparatabela();
} );
</script>
</head>
<body class="wide comments example dt-example-bootstrap">
<select name="ContactSelect" onchange="estado(this.value)">
<option value="">- Selecione o Estado -</option>
<option value="rs">Rio Grande do Sul</option>
<option value="sp">São Paulo</option>
</select>
<td>
Estados:<br>
<select id="campoestados" name="campoestados" style="width: 10%">
<option value="%">TODOS</option>
</select>
</td>
<div class="fw-container">
<section>
<table id="example" class="table table-striped table-bordered dataTable" cellspacing="0" width="100%" role="grid" aria-describedby="example_info" style="width: 100%;">
<thead>
<tr>
<th>CÓD.</th>
<th>NOME</th>
<th>ESTADO</th>
<th>IMG_COLOR</th>
<th>IMG_GRAY</th>
<th>LINK</th>
</tr>
</thead>
</table>
<table border="0" cellpadding="0" cellspacing="0" style="width: 100%" align="right">
<tr><td width="33%">
</td>
</tr>
</table>
</section>
</div>
<div class="fw-container2">
</div>
</body>
</html>
Clientes
Todos os direitos reservados