PHP + MYSQL + AJAX trocar fotos

[cadife]

Boas tardes,

Ainda sou novo em ajax, e a minha atual dificuldade é ,a seguinte, pretendo através do php fazer uma chamada ao banco de dados mysql de um nome ( tou usar o option) , e preciso que retorne a imagem desse nome, ou seja se eu selecionar a maria aparece a foto da maria, se eu selecionar o manel aparece a foto manel.

Obrigado

[Ivo Vicente]

Viva, 

Só com essa descrição não vamos conseguir ajudar muito, pois parece (para mim) que algo está ainda confuso a implementação.

Já tens alguma coisa desenvolvida? 

Em resumo, do que percebo devias ter algo deste gênero:

• View (página) PHP onde eu assumo que terás um processo para gerar e preencher o select com as options das imagens
• Esta view, deverá ter uma implementação com Javascript que irá gerir o onChange da select, que irá ser responsavel por requisitar um endereço para outro endpoint ou ficheiro php que irá retornar a imagem. Este bloco de JS deverá depois fazer o replace/criar o elemento img na view
• Endpoint/Ficheiro PHP que irá receber por POST/GET o pedido da view via JS em que a resposta é a imagem

É isto, ou tens outra solução me marcha?

[cadife]

Boas, até onde consegui chegar consigo escolher o nome e depois ir buscar a diretoria da foto mas o que eu pretendo é que em vez de mostrar a diretoria da foto no Option me mostre a foto.

 

Em baixo envio o código

PHP

<label>Modelo :</label><select name="modelo" class="modelo">
<option value="0">Seleciona modelo</option>
<?php
$con = mysqli_connect("localhost", "Login", "Pass","BD");
$sql = mysqli_query($con,"SELECT * FROM tb_preco_97");
while($row=mysqli_fetch_array($sql))
{
echo '<option value="'.$row['codigo'].'">  '.$row['modelo'].'</option>';


} ?>

</select><br/><br/>
<label>Foto :</label> <select name="foto" class="foto">
<option>Foto</option>
</select>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js">
</script>
<script type="text/javascript">
$(document).ready(function()
{
$(".modelo").change(function()
{
var codigo=$(this).val();
var post_id = 'id='+ codigo;



$.ajax
({
type: "POST",
url: "verificar.php",
data: post_id,
cache: false,
success: function(fotos)
{
$(".foto").html(fotos);
} 
});
});
});
</script>

verificar.php

<?php
$con = mysqli_connect("localhost", "Login", "Pass","BD");
if($_POST['id']){
$id=$_POST['id'];
if($id==0){
	
}else{
	$sql = mysqli_query($con,"SELECT foto_painel FROM tb_preco_97 WHERE codigo='$id'");
	while($row = mysqli_fetch_array($sql)){
		echo '<option value="'.$row['foto_painel'].'">'.$row['foto_painel'].'</option>';
                  
           
        }       
	}
         
}

?>

 

[Ivo Vicente]

Viva,

Então tu não vais querer usar tag select > option, tens que usar dropdowns que não são nativos de html.

De resto, a estrutura parece estar toda alinhada para efeitos de experiência.

Vê este exemplo

[cadife]

Boas, 

Não é bem com o dropdowns que necessito é mesmo escolher o nome por option recorrendo a base dados mysql e de seguida retornar o directorio  da foto numa img

Já consegui resolver maior parte dos problemas, mas esta-me a escapar alguma coisa, agradecia a vossa ajuda.

PHP
  
<label>Modelo :</label><select name="modelo" class="modelo">
<option value="0">Seleciona modelo</option>
<?php
$con = mysqli_connect("localhost", "", "","bd");
$sql = mysqli_query($con,"SELECT * FROM tb_preco_97");
while($row=mysqli_fetch_array($sql))
{
echo '<option value="'.$row['codigo'].'">  '.$row['modelo'].'</option>';


} ?>


</select><br/><br/>

<img  id="foto" name="foto" width=125 height=250 src="images/paineis/Technicdoor/CD01.jpg">


<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js">
</script>
<script type="text/javascript">
$(document).ready(function()
{
$(".modelo").change(function()
{
var codigo=$(this).val();
var post_id = 'id='+ codigo;

$.ajax
({
type: "POST",
url: "verificar.php",
data: post_id,
cache: false,
success: function(fotos)
{

$('.foto').append('<img src="'+fotos+'">');

      });
} 
});
});
});
</script>
  
  
  verificar.php
  
  <?php
$con = mysqli_connect("localhost", "", "","bd");
if($_POST['id']){
$id=$_POST['id'];
if($id==0){
	
}else{
	$sql = mysqli_query($con,"SELECT foto_painel FROM tb_preco_97 WHERE codigo='$id'");
	while($row = mysqli_fetch_array($sql)){
		echo '<option value="'.$row['foto_painel'].'">'.$row['foto_painel'].'</option>';

        }       

	}  
}
     
?>