-2
This is the code of my HTML page, it’s 90% translated to table, but when I select an item, it doesn’t translate, and I don’t even know how to translate.
<?php
session_start();
$pagTitle = "Clientes";
require_once ("../tools/conexao.php");
include_once ("../tools/head.php");
$clientes = "active";
$openClient = "open";
?>
<body>
<?php
include_once ("../tools/header.php");
include_once ("../tools/slidebar.php");
?>
<!--content area start-->
<div id="content" class="pmd-content inner-page">
<!--tab start-->
<div class="container-fluid full-width-container data-tables">
<!-- Title -->
<h1 class="section-title" id="services">
<span></span>
</h1><!-- End Title -->
<script type="text/javascript">
document.addEventListener('DOMContentLoaded', function(){
setTimeout(function() {
$("#hideNotify").fadeOut().empty();
}, 6000);
}, false);
</script>
<button type="button" data-positionX="right"data-positionY="top"data-effect="fadeInUp"data-message="Well done! You successfully read this important alert message."data-type="success" class="btn pmd-ripple-effect btn-success pmd-z-depth pmd-alert-toggle">Alert Success</button>
<?php if(isset($_SESSION['msg'])){echo $_SESSION['msg'];unset($_SESSION['msg']);}?>
<!--breadcrum start-->
<ol class="breadcrumb text-left">
<li><a href="<?php echo $baseUrl;?>app/">Dashboard</a></li>
<li class="active">Clientes</li>
</ol><!--breadcrum end-->
<!-- table card -->
<!--Primary button with a ripple effect-->
<a data-target="#addCliente" data-toggle="modal" class="subir btn pmd-ripple-effect btn-primary rounded"> Adicionar <i class="fa sp fa-user-plus"></i></a>
<section class="row component-section">
<div class="col-md-12">
<div class="component-box">
<!-- table card example -->
<div class="pmd-card pmd-z-depth pmd-card-custom-view">
<div class="table-responsive">
<table id="example-checkbox" class="table pmd-table table-hover table-striped display responsive nowrap" cellspacing="0" width="100%">
<thead>
<tr>
<th>#</th>
<th>ID</th>
<th>Nome</th>
<th>CPF</th>
<th>Telefone</th>
<th>Email</th>
<th>Estado</th>
<th>Cidade</th>
<th>Endereço</th>
<th>CEP</th>
<th>Sexo</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<?php
/*Pegar dados no bd*/
$sql = "SELECT * FROM clientes";
$dados = mysqli_query($conn, $sql);
$count = mysqli_num_rows($dados);
while($rows = mysqli_fetch_assoc($dados)) {
?> <!-- verificar se esta ativo e dar cor -->
<?php
if ($rows['ativo'] == "Desativado") {echo "";}
?>
<tr class="noActive">
<td></td>
<td><?php echo $rows['idCliente']; ?></td>
<td><?php echo $rows['nome']; ?></td>
<td><?php echo $rows['cpf']; ?></td>
<td><?php echo $rows['telefone']; ?></td>
<td><?php echo $rows['email']; ?></td>
<td><?php echo $rows['estado']; ?></td>
<td><?php echo $rows['cidade']; ?></td>
<td><?php echo $rows['endereco']; ?></td>
<td><?php echo $rows['cep']; ?></td>
<td><?php echo $rows['sexo']; ?></td>
<td><?php echo $rows['ativo']; ?></td>
</tr>
<!--Fechar laço While -->
<?php } ?>
</tbody>
</table>
</div>
</div> <!-- table card example end -->
</div>
</div> <!-- table card code and example end -->
<!-- table card title and description -->
</section>
</div>
<!--tab start-->
<!--content area end-->
<div class="col-md-6 col-sm-6">
<div tabindex="-1" class="modal fade" id="addCliente" style="display: none;" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header bordered">
<button aria-hidden="true" data-dismiss="modal" class="close" type="button">×</button>
<h2 class="pmd-card-title-text">Adicionar Cliente</h2>
</div>
<div class="modal-body">
<form autocomplete="false" method="post" action="addCliente.php" class="form-horizontal">
<div class="form-group pmd-textfield pmd-textfield-floating-label">
<label for="first-name">Nome</label>
<input type="text" class="mat-input form-control" name="nome" id="nome" value="">
</div>
<div class="form-group pmd-textfield pmd-textfield-floating-label">
<label for="first-name">CPF</label>
<input type="text" class="mat-input form-control" name="cpf" id="cpf" value="">
</div>
<div class="form-group pmd-textfield pmd-textfield-floating-label">
<label for="first-name">Telefone</label>
<input type="text" class="mat-input form-control" name="telefone" id="telefone" value="">
</div>
<div class="form-group pmd-textfield pmd-textfield-floating-label">
<label for="first-name">Email</label>
<input type="text" class="mat-input form-control" name="email" id="email" value="">
</div>
<div class="form-group pmd-textfield pmd-textfield-floating-label">
<label for="first-name">Estado</label>
<input type="text" class="mat-input form-control" name="estado" id="estado" value="">
</div>
<div class="form-group pmd-textfield pmd-textfield-floating-label">
<label for="first-name">Cidade</label>
<input type="text" class="mat-input form-control" name="cidade" id="cidade" value="">
</div>
<div class="form-group pmd-textfield pmd-textfield-floating-label">
<label for="first-name">Endereço</label>
<input type="text" class="mat-input form-control" name="endereco" id="endereco" value="">
</div>
<div class="form-group pmd-textfield pmd-textfield-floating-label">
<label for="first-name">CEP</label>
<input type="text" class="mat-input form-control" name="cep" id="cep" value="">
</div>
<div class="form-group pmd-textfield pmd-textfield-floating-label">
<div class="form-group pmd-textfield pmd-textfield-floating-label">
<label>Sexo</label>
<select name="sexo" class="select-simple form-control pmd-select2">
<option>Masculino</option>
<option>Feminino</option>
<option>Outro</option>
</select>
</div>
</div>
<div class="form-group pmd-textfield pmd-textfield-floating-label">
<label>Status</label>
<select name="ativo" class="select-simple form-control pmd-select2">
<option>Ativo</option>
<option>Desativado</option>
</select>
</div>
</div>
<div class="pmd-modal-action">
<button class="rounded btn pmd-ripple-effect btn-success" type="submit">Cadastrar</button>
<button data-dismiss="modal" class="rounded btn pmd-ripple-effect btn-danger" type="button">Fechar</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<?php include_once("../tools/footer.php"); ?>
<!-- Scripts Starts -->
<script src="<?php echo $baseUrl;?>assets/js/jquery-1.12.2.min.js"></script>
<script src="<?php echo $baseUrl;?>assets/js/bootstrap.min.js"></script>
<script src="<?php echo $baseUrl;?>assets/js/propeller.min.js"></script>
<script>
$(document).ready(function() {
var sPath=window.location.pathname;
var sPage = sPath.substring(sPath.lastIndexOf('/') + 1);
$(".pmd-sidebar-nav").each(function(){
$(this).find("a[href='"+sPage+"']").parents(".dropdown").addClass("open");
$(this).find("a[href='"+sPage+"']").parents(".dropdown").find('.dropdown-menu').css("display", "block");
$(this).find("a[href='"+sPage+"']").parents(".dropdown").find('a.dropdown-toggle').addClass("active");
$(this).find("a[href='"+sPage+"']").addClass("active");
});
$(".auto-update-year").html(new Date().getFullYear());
});
</script>
<!-- Scripts Ends -->
<!-- Datatable js -->
<script type="text/javascript" language="javascript" src="<?php echo $baseUrl;?>assets/js/jquery.dataTables.min.js"></script>
<!-- Datatable Bootstrap -->
<script type="text/javascript" language="javascript" src="<?php echo $baseUrl;?>assets/js/dataTables.bootstrap.min.js"></script>
<!-- Datatable responsive js-->
<script type="text/javascript" language="javascript" src="<?php echo $baseUrl;?>assets/js/dataTables.responsive.min.js"></script>
<!-- Datatable select js-->
<script type="text/javascript" language="javascript" src="<?php echo $baseUrl;?>assets/js/dataTables.select.min.js"></script>
<!-- Propeller Data table js-->
<script>
//Propeller Customised Javascript code
$(document).ready(function() {
$('#example-checkbox').DataTable({
responsive: false,
columnDefs: [ {
orderable: false,
className: 'select-checkbox',
targets:0,
} ],
select: {
style: 'multi',
selector: 'td:first-child'
},
order: [ 1, 'asc' ],
bFilter: true,
bLengthChange: true,
pagingType: "simple",
paging: true,
searching: true,
"language": {
"sInfo": "Mostrando de _START_ até _END_ de _TOTAL_ registros",
"sInfoEmpty":" ",
"sLengthMenu": "_MENU_ resultados por página",
"sSearch": "",
"sEmptyTable": "Nenhum registro encontrado",
"sInfoFiltered": "Filtrados de _MAX_ registros",
"sLoadingRecords": "Carregando...",
"sProcessing": "Processando...",
"sInfoPostFix": "",
"sInfoThousands": ".",
"sSearchPlaceholder": "Pesquisar..",
"sZeroRecords": "Nenhum registro encontrado <i class='far fa-frown'></i>",
"paginate": {
"sNext": " ",
"sPrevious": " "
},
},
dom:
"<'pmd-card-title'<'data-table-title'><'search-paper pmd-textfield'f>>" +
"<'custom-select-info'<'custom-select-item'><'custom-select-action'>>" +
"<'row'<'col-sm-12'tr>>" +
"<'pmd-card-footer' <'pmd-datatable-pagination' l i p>>",
});
/// Select value
$('.custom-select-info').hide();
$('#example-checkbox tbody').on( 'click', 'tr', function () {
if ( $(this).hasClass('selected') ) {
var rowinfo = $(this).closest('.dataTables_wrapper').find('.select-info').text();
$(this).closest('.dataTables_wrapper').find('.custom-select-info .custom-select-item').text(rowinfo);
if ($(this).closest('.dataTables_wrapper').find('.custom-select-info .custom-select-item').text() != null){
$(this).closest('.dataTables_wrapper').find('.custom-select-info').show();
//show delet button
} else{
$(this).closest('.dataTables_wrapper').find('.custom-select-info').hide();
}
}
else {
var rowinfo = $(this).closest('.dataTables_wrapper').find('.select-info').text();
$(this).closest('.dataTables_wrapper').find('.custom-select-info .custom-select-item').text(rowinfo);
}
if($('#example-checkbox').find('.selected').length == 0){
$(this).closest('.dataTables_wrapper').find('.custom-select-info').hide();
}
} );
$("div.data-table-title").html('<h2 class="pmd-card-title-text"><?php echo $pagTitle;?></h2>');
$(".custom-select-action").html('<button class="btn btn-sm pmd-btn-fab pmd-btn-flat pmd-ripple-effect btn-primary" type="button"><i class="material-icons pmd-sm">delete</i></button><button class="btn btn-sm pmd-btn-fab pmd-btn-flat pmd-ripple-effect btn-primary" type="button"><i class="material-icons pmd-sm">more_vert</button>');
} );
</body>
</html>
Great, thank you so much.
– Pedro Henrique