Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Bom dia, alguem me ajude a fazer funcionar este pequeno script usando ajax. Preciso pegar a resposta do console e colocar na tela na id buscar2
Resposta do console:
{"valor_hr_viagem":"10","valor_por_km":"8","valor_apos_18":"7","valor_sabado":"6","valor_domingo":"5","id":"834"}
teste_ajax.html
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
</head>
<body>
<button class="btn btn-default" id="buscar3" type="button">Buscar2</button>
<div id="dados2">Aqui será inserindo o resultado da consulta...</div>
<div id="valor_fixo_cliente">teste</div>
<!-- SCRIPT NECESSARIO PARA O AJAX FUNCIONAR // <script src="jquery.2.1.3.min.js"></script> !-->
<script src="jquery.2.1.3.min.js"></script>
<script>
function buscar3($id_cliente)
{
//O método $.ajax(); é o responsável pela requisição
$.ajax
({
//Configurações
type: "POST",//Método que está sendo utilizado.
dataType: "json",//É o tipo de dado que a página vai retornar.
url: "busca3.php",//Indica a página que está sendo solicitada.
//função que vai ser executada assim que a requisição for enviada
beforeSend: function (mensagem_retorno) {
$("#dados2").html("Carregando...");
$("#valor_fixo_cliente").html("Carregando...");
},
data: {id_cliente: "834"},//Dados para consulta
//função que será executada quando a solicitação for finalizada.
success: function (mensagem_retorno) {
console.log (mensagem_retorno);
$("#dados2").html(mensagem_retorno.conteudo);
}
});
}
$('#buscar3').click(function () {
buscar3($("#id_cliente").val())
});
</script>
</body>
</html>
buscar3.php
<?php
require('conexao_dbo.php');
include('error_report.php');
$id_procurar = $_POST['id_cliente'];
$sql = "SELECT * FROM clientes WHERE id='$id_procurar'";
$sql = $arquivo->query($sql);
if($sql->rowCount()>0) {
$linha = $sql->fetch();
$conteudo = json_encode(
array ("valor_hr_viagem" => $linha['valor_hr_viagem'],
"valor_por_km" => $linha['valor_por_km'],
"valor_apos_18" => $linha['valor_apos_18'],
"valor_sabado" => $linha['valor_sabado'],
"valor_domingo" => $linha['valor_domingo'],
"id" =>$linha['id']
)
);
echo $conteudo;
}
?>
estrutura da tabela clientes em anexo
Muito obrigado pela ajuda, vou estudar o link que voce me passou.
Agora o retorno esta preenchendo algumas divs como a $("#dados2") mas os campos de input nao com a mesma id. vou tentar entender o motivo.
Em VFP existe comandos que atualizam campos individuais da tela por ex. thisform.pageframe1.page2.nomedolabel.refresh
Imagino que deva existir algo assim para html ou no proprio ajax mas desconheço.
Grato mais uma vez pelo suporte
Se você deseja usar uma mesma funcionalidade
para mais de um elemento, então deverá utilizar
"classe", não "id".
Isso ocorre porque os IDs devem ser exclusivos
na página, e por sua vez, se houver mais que
um, o JQuery, selecionará o primeiro e ignorar
o restante.
Segue teste, abaixo:
CÓDIGO:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title> EXAMPLE </title>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
</head>
<body>
<h2>DOIS ELEMENTOS COM O MESMO ID</h2>
<input type="text" id="f_test" />
<input type="text" id="f_test" />
<button id="btn_1">Preencher</button>
<br />
<h2>DOIS ELEMENTOS COM A MESMA CLASSE</h2>
<input type="text" class="s_test" />
<input type="text" class="s_test" />
<button id="btn_2">Preencher</button>
<br />
<script type="text/javascript">
// PARA OS ID's
$ ('#btn_1').on ('click',function()
{
$("#f_test").val ('Preenchido!');
});
// PARA AS CLASSES
$ ('#btn_2').on ('click',function()
{
$(".s_test").val ('Preenchido!');
});
</script>
</body>
</html>Muito obrigado, vou estudar suas informacoes.
Disponível ^^
Vamos lá!
Repare que você tenta "chamar" o atributo
"conteudo" em "mensagem_retorno", porém
o mesmo não foi definido...
Chamada do atributo:
$conteudo = json_encode(
array (
// AQUI ESTAO OS ATRIBUTOS QUE VOCE DEFINIU
// ATRIBUTO => "VALOR DO ATRIBUTO"
"valor_hr_viagem" => $linha['valor_hr_viagem'],
"valor_por_km" => $linha['valor_por_km'],
"valor_apos_18" => $linha['valor_apos_18'],
"valor_sabado" => $linha['valor_sabado'],
"valor_domingo" => $linha['valor_domingo'],
"id" =>$linha['id']
)
$conteudo = json_encode(
array (
"valor_hr_viagem" => $linha['valor_hr_viagem'],
"valor_por_km" => $linha['valor_por_km'],
"valor_apos_18" => $linha['valor_apos_18'],
"valor_sabado" => $linha['valor_sabado'],
"valor_domingo" => $linha['valor_domingo'],
"id" =>$linha['id'],
"conteudo" => "Algo" // ADICIONADO
)