Comecei a usar AJAX
há um tempinho e estou com uma dúvida. Possuo um <select>
e estou tentando trazer o valor dele na mesma página (sem dar refresh), porém, só é exibido o valor quando eu clico no <select>
novamente, para selecionar outra opção. Como faria para mostrar assim que eu selecionasse?
Vamos supor que eu seleciono o
<select>
comvalue="4"
, só é mostrado o "4", quando eu clico no<select>
de novo...
index.php:
<select class="common_selector" id="ordenar_tabela">
<option value="1">Lançamentos</option>
<option value="2">Menor valor</option>
<option value="3">Maior valor</option>
<option value="4">A - Z</option>
<option value="5">Z - A</option>
</select>
<script>
$(document).ready(function(){
filter_data();
function filter_data()
{
var action = 'fetch_data';
var ordenacao = $('#ordenar_tabela').val();
$.ajax({
url:"verificar.php",
method:"POST",
data:{action:action, ordenacao:ordenacao},
success:function(data){
$('.filter_data').html(data);
}
});
}
$('.common_selector').click(function(){
filter_data();
});
});
</script>
verificar.php:
<?php
$query = "SELECT * FROM produtos_estoque";
// Se o usuário quiser ordenar a tabela...
if(isset($_POST["ordenacao"])){
$ordenacao = $_POST["ordenacao"];
echo $ordenacao; //Estou exibindo essa variavel na página, para ver se vai funcionar os demais códigos abaixo...
// $query .= ($ordenacao == 1) ? " ORDER BY ID_produtos DESC" : "";
// $query .= ($ordenacao == 2) ? " ORDER BY ID_produtos DESC" : "";
// $query .= ($ordenacao == 3) ? " ORDER BY ID_produtos DESC" : "";
// $query .= ($ordenacao == 4) ? ' ORDER BY produto' : "";
// $query .= ($ordenacao == 5) ? ' ORDER BY produto DESC' : "";
}
?>
$query
,$('.filter_data')
apenas não foi inserido na questão.