Bom dia tenho uma duvida:
Em um select tenho 3 escolhas. Preciso fazer com que a escolha selecionada seja aberta na mesma página para o usuario poder excluir um item da categoria ou marca ou subcategoria mas devo estar fazendo alguma coisa errada poderiam me ajudar?
segue o arquivo:
<main class="container">
<article class="principal">
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
// Evento quando o valor da combo é alterado
$('#select-relatorio').change(function () {
// Redirecionamento por Javascript quando uma das opções com valor for selecionado
if ($(this).val()!="") {
window.location = $(this).val();
}
});
});
</script>
<br><br><br>
<main class="container">
<div id="notifications">
<div class="alert alert-success">
<div class="container">
<h3><b>Selecione para Excluir</b> </h3>
</div>
<br><br>
<article class="principal">
<div class="form-group">
<select id="select-relatorio" class="form-control">
<option>Selecione</option>
<option value="#1">Categoria</option>
<option value="#2">Sub-Categoria</option>
<option value="#3">Marca</option>
</select>
</div>
</article>
</main>
<div class="table-responsive" id="1">
<?php
$categorias = listaCategorias($conexao);
foreach ($categorias as $categoria) :
?>
<table class="table">
<thead>
<tr>
<th class="text-center">ID</th>
<th class="text-center">Nome</th>
<th class="text-right">Acões</th>
</tr>
</thead>
<tbody>
<tr>
<td class="text-center"><?=$categoria->getId() ?></td>
<td class="text-center"><?=$categoria->getNome() ?></td>
<td class="td-actions text-right">
<button type="button" rel="tooltip" title="Alterar" class="btn btn-success btn-simple btn-xs">
<i class="fa fa-edit"></i>
</button>
<button type="button" rel="tooltip" title="Remover" class="btn btn-danger btn-simple btn-
xs">
<i class="fa fa-times"></i>
</button>
</td>
</tr>
</tbody>
</table>
Usa ajax. Exemplo com a biblioteca jquery:
Documentação:
http://api.jquery.com/jquery.ajax/
https://api.jquery.com/jquery.get/ (forma simplificada usando método GET)
Sergio_Guerjik:
<main class=“container”>
<article class=“principal”>
<script type=“text/javascript” src=“js/jquery.min.js”></script>
<script type=“text/javascript”>
$(document).ready(function () {
// Evento quando o valor da combo é alterado
$(’#select-relatorio ’).change(function () {
// Redirecionamento por Javascript quando uma das opções com valor for selecionado
if ($(this).val()!="") {
window.location = $(this).val();
}
});
});
</script>
<br><br><br>
<main class=“container”>
<div id=“notifications”>
<div class=“alert alert-success”>
<div class=“container”>
<h3><b>Selecione para Excluir</b> </h3>
</div>
<br><br>
<article class=“principal”>
<div class=“form-group”>
<select id=“select-relatorio” class=“form-control”>
<option>Selecione</option>
<option value="#1 ">Categoria</option>
<option value="#2 ">Sub-Categoria</option>
<option value="#3 ">Marca</option>
</select>
</div>
</article>
</main>
<div class="table-responsive" id="1">
<?php
$categorias = listaCategorias($conexao);
foreach ($categorias as $categoria) :
?>
<table class=“table”>
<thead>
<tr>
<th class=“text-center”>ID</th>
<th class=“text-center”>Nome</th>
<th class=“text-right”>Acões</th>
</tr>
</thead>
<tbody>
<tr>
<td class="text-center"><?=$categoria->getId() ?></td>
<td class="text-center"><?=$categoria->getNome() ?></td>
<td class="td-actions text-right">
<button type="button" rel="tooltip" title="Alterar" class="btn btn-success btn-simple btn-xs">
<i class="fa fa-edit"></i>
</button>
<button type="button" rel="tooltip" title="Remover" class="btn btn-danger btn-simple btn-
xs">
<i class="fa fa-times"></i>
</button>
</td>
</tr>
</tbody>
</table>
Muito obrigado javaflex vou verificar como encaixar essas biblioteca no projeto. Valeu. Abraços
1 curtida
Aparentemente pelo seu código você já faz algum uso do jquery.
Pelo seu código, vc já usa o JQuery no projeto. Essas chamadas que começam com $(…) são do jquery, para fazer requisições com AJAX, estude sobre a função $.ajax();