Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

redmaster1337

imagem em select php

Por , em PHP

Recommended Posts

redmaster1337    0

redmaster1337
Postado

Eu criei uma pagina em php fiz as conexoes tudo ok, fiz um select onde ele faz uma consulta no banco de dados para ver determinados itens que estao cadastrados, cada item cadastrado no banco tem um atributo que possui o caminho da img dele, eu preciso fazer com que quando o usuario clique em algum item, apareça a imagem do respectivo item. me disseram que eu deveria usar jquery com metodo load, porem, eu nao sou experiente com programação e preciso aprender, caso alguem saiba e estiver à dispocição para me ajudar agradeço, obg pela atenção!

Compartilhar este post

Link para o post
Compartilhar em outros sites

Beraldo    864

Beraldo
Postado

Bem-vindo ao fórum! :)
Recomendo que leia as Regras e Orientações de participação

Comece fazendo tudo sem Javascript. Depois você melhora o sistema com Ajax (usando jQuery ou JS puro)

O Ajax nada mais é que um JS que chama um script PHP e processa o resultado. Então primeiro aprenda a fazer tudo com o PHP apenas, depois melhore a usabilidade com JS

Compartilhar este post

Link para o post
Compartilhar em outros sites

ckcesar    7

ckcesar
Postado

você precisa de algo desse tipo?

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>

<script type="text/javascript">
        function mostrar_imagem(id){
            $.ajax({
                url:'images.php',
                type:'GET',
                data:{
                    codigoItem:id
                },
                success:function(data){
                    $('.recebe_imagem').html(data);
                }
            });
        }
</script>

<style>
     h1{
         cursor:pointer;
     }
</style>

</head>

<body>

<h1 onclick="mostrar_imagem(1);" >Item 1</h1>
<h1 onclick="mostrar_imagem(2);" >Item 2</h1>
<h1 onclick="mostrar_imagem(3);" >Item 3</h1>

<div class="recebe_imagem" style="width: 200px; height: 300px;" ></div>

</body>

</html>

images.php

<?php
 $codigoItem = $_GET['codigoItem'];

 if($codigoItem == '1'){
     $mostrar = '<img style="width: 100%;" src="http://damiracle.com/wp-content/uploads/2014/04/idea_digital_marketing2-1024x522.png" />';
 }else if($codigoItem == '2'){
     $mostrar = '<img style="width: 100%;" src="http://damiracle.com/wp-content/uploads/2014/04/idea_digital_marketing-1024x576.jpg" />';
 }else{
     $mostrar = '<img style="width: 100%;" src="http://www.emarket.ppg.br/wp-content/uploads/2014/03/Fotolia_43240870_Subscription_L.jpg" />';
 }

 echo $mostrar;
?>

Compartilhar este post

Link para o post
Compartilhar em outros sites

redmaster1337    0

redmaster1337
Postado

Isso mesmo colega, muito obrigado, eu consegui aplicar o mesmo conceito no select, ficou da seguinte maneira:

<select onchange="mostrar_imagem( this.value )">

<option>Selecione</option>

<option value="1">Opção 1</option>

<option value="2">Opção 2</option>

<option value="3">Opção 3</option>

</select>

porém o caminho da imagem que eu preciso colocar está guardado em um atributo em uma tabela de produtos que está cadastrada no bd, como eu poderia colocar esse caminho?

Compartilhar este post

Link para o post
Compartilhar em outros sites

ckcesar    7

ckcesar
Postado

Mais esse seu select está trazendo esses value com os ids do banco já?

você pode fazer da mesma forma, passa o id do value para uma requisição Ajax e pega o retorno com um echo.

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>

<script type="text/javascript">
        function mostrar_imagem(id){
            $.ajax({
                url:'images.php',
                type:'GET',
                data:{
                    codigoItem:id
                },
                success:function(data){
                    $('.recebe_imagem').html(data);
                }
            });
        }
</script>

</head>

<body>

<select onchange="mostrar_imagem( this.value )">
    <option>Selecione</option>
    <option value="1">Opção 1</option>
    <option value="2">Opção 2</option>
    <option value="3">Opção 3</option>
</select>

<div class="recebe_imagem" style="width: 200px; height: 300px;" ></div>

</body>

</html>

images.php

<?php
 $codigoItem = $_GET['codigoItem'];

   //Aqui você faz um sql que pega o valor do caminho no banco com o valor do seu codigoItem 

 $mostrar = '<img style="width: 100%;" src="Aqui o caminho do banco" />';

 echo $mostrar;
?>

Compartilhar este post

Link para o post
Compartilhar em outros sites

redmaster1337    0

redmaster1337
Postado

to quase conseguindo terminar na div esta acontecendo um erro onde na verdade era pra ser o select(mysql) estou quebrando a cabeça para descobrir como é a consulta certa, mas n estou conseguindo.

Compartilhar este post

Link para o post
Compartilhar em outros sites

redmaster1337    0

redmaster1337
Postado

Eu consegui fazer, fiz desta maneira:

<p class="tituloSelect">Water Cooler[opcional]</p>
				<div class="slcBloco">
					<div class="recebe_imagem" id="img_watercooler"></div>
					<select onchange="mostrar_imagem(this.value,'img_watercooler')">
						<option>Selecione</option>
						<option>Nenhum</option>
<?php					require("conexao.php");
						$qr = mysqli_query($mysqli,"SELECT * FROM produtos where categoria='watercooler' ") or die(mysqli_error());
						while($ln = mysqli_fetch_assoc($qr)){
?>							<option data-img="<?php echo $ln['imagem']?>" value="<?php echo $ln['id']?>"><?php echo $ln['nome']?> [R$ <?php echo $ln['preco'] ?>]</option>
<?php					}
?>
					</select>
				</div>

images.php

<?php
	$codigoItem = $_GET['codigoItem'];
	//Aqui você faz um sql que pega o valor do caminho no banco com o valor do seu codigoItem

	$mysqli =  new mysqli('localhost', 'root', 'vertrigo', 'omegainfo');

	$sql = "SELECT imagem FROM produtos WHERE id = '$codigoItem'";
	$query = $mysqli->query($sql) or die();
	$itens = $query->fetch_all(MYSQLI_ASSOC);
	
	if (isset($itens[0]['imagem'])){
		$mostrar = '<img id="imgProd" src="img/'.$itens[0]['imagem'].'" />';
	} else {
		$mostrar = '';
	}
	echo $mostrar;

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos PHP
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito