Ir para conteúdo

POWERED BY:

Biel.

for

Recommended Posts

Olá pessoal. Temos EX1 e EX2. Como fazer EX2 imprimir o mesmo resultado que EX1?

EX1
<select  size="6">
  <option> tete1 </option>
  <option> green </option>
  <option> blue </option>
  <option> tete2 </option>
  <option> red </option>
  <option> orange</option>
</select>

...

EX2
<select  size="6">
  <?php for($i=1; $i<=6; $i++){?>
  <option> tete<?=$i?> </option>
  <?php }?>
</select>


 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie as opções em um array no php.

Dentro da tag <select> 1 e 2 faça um loop percorrendo o array usando o comando echo para compor cada tag <option> em ambos seletores.

Compartilhar este post


Link para o post
Compartilhar em outros sites
6 minutos atrás, Omar~ disse:

Crie as opções em um array no php.

Dentro da tag <select> 1 e 2 faça um loop percorrendo o array usando o comando echo para compor cada tag <option> em ambos seletores.

Fazer com array é inviável tem que ser com if dentro do for criando alguma regra, mas não conseguir fazer .

Compartilhar este post


Link para o post
Compartilhar em outros sites

Até onde eu sei, o PHP não é capaz de ver o que tem na página HTML, quem faz isso é o JavaScript.

No código a seguir, eu pedi para o JavaScript fazer auditoria no elemento select e mandar todas as opções para o PHP, e o PHP monta o select à imagem e semelhança do que o JavaScript encontrou.

<?php
if(isset($_GET['gambiarra'])){
    $gambiarra=$_GET['gambiarra'];
    $opcoes=explode(',',$gambiarra);
    echo "<select id=phpSelect>"; 
    foreach($opcoes as $opcao){
        echo "<option>$opcao</option>";}
    echo "</select>";
    exit;}
?>
<select  id=meuSelect>
  <option>teste</option>
  <option>green</option>
  <option>blue</option>
  <option>teste2</option>
  <option>red</option>
  <option>orange</option>
</select>

<form id=frmgambiarra>
    <input type=hidden name=gambiarra id=inpgambiarra>
</form>

<script>
select = document.getElementById("meuSelect")
array=select.children
opcoes=[]
for(i=0;i<=array.length-1;i++){opcoes.push(array[i].outerText)}
inpgambiarra.value=opcoes
frmgambiarra.submit()
</script>

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Uma simples ideia com php

 

 

<label class="form-label">EXEMPLO1</label>
        <select class="form-control" onchange="this.form.submit()" name="ex1">
            <?php 
                $select = SELECT("*", "tbl_ex1", "");
                foreach ($select as $dados) { ?>
                    <option value="<?php echo $dados['ex1name']; ?>" <?php if($Ex1Select == $dados['ex1name']){ echo "selected"; } ?>><?php echo $dados['ex1name']; ?></option>
                <?php } ?>
        </select>  


        <label class="form-label">EXEMPLO2</label>
        <select class="form-control" onchange="this.form.submit()" name="ex2">
            <?php 
                $select = SELECT("*", "tbl_ex2", " WHERE ex2name = '$Ex1Select");
                foreach ($select as $dados) { ?>
                    <option value="<?php echo $dados['ex2name']; ?>" <?php if($ex2 == $dados['ex2name']){ echo "selected"; } ?>><?php echo $dados['ex2name']; ?></option>
                <?php } ?>
        </select>

 

Compartilhar este post


Link para o post
Compartilhar em outros sites
4 horas atrás, Jack Oliveira disse:

Uma simples ideia com php

 

 



<label class="form-label">EXEMPLO1</label>
        <select class="form-control" onchange="this.form.submit()" name="ex1">
            <?php 
                $select = SELECT("*", "tbl_ex1", "");
                foreach ($select as $dados) { ?>
                    <option value="<?php echo $dados['ex1name']; ?>" <?php if($Ex1Select == $dados['ex1name']){ echo "selected"; } ?>><?php echo $dados['ex1name']; ?></option>
                <?php } ?>
        </select>  


        <label class="form-label">EXEMPLO2</label>
        <select class="form-control" onchange="this.form.submit()" name="ex2">
            <?php 
                $select = SELECT("*", "tbl_ex2", " WHERE ex2name = '$Ex1Select");
                foreach ($select as $dados) { ?>
                    <option value="<?php echo $dados['ex2name']; ?>" <?php if($ex2 == $dados['ex2name']){ echo "selected"; } ?>><?php echo $dados['cidade_nome']; ?></option>
                <?php } ?>
        </select>

 

 

 

Eu recebi várias mensagens de erro na hora de testar o seu código por aqui, primeiro com a função SELECT que o VS Code não reconheceu e segundo com a variável $Ex1Select que não foi definida no primeiro bloco. Para tentar a ideia que você sugeriu, montei o seguinte código:
 


<?php
    $Ex1Select="amarelo";
    $mysqli=new mysqli("localhost","root","","astudy");
    $query=$mysqli->query("select * from tbEx1");
    $select = $query->fetch_all(MYSQLI_ASSOC);
    echo "Exemplo 01 <select>";
    foreach ($select as $dados) { 
       echo "<option value=".$dados['ex1name'].">";
       if($Ex1Select == $dados['ex1name']){echo "selected ";}
       echo $dados['ex1name']."</option>";}
    echo "</select>";
    $Ex2Select="amarelo";
    $query=$mysqli->query("select * from tbEx2 where ex2name='$Ex1Select'");
    $select=$query->fetch_all(MYSQLI_ASSOC);
    echo "Exemplo 02 <select>";
    foreach ($select as $dados) { 
        echo "<option value=".$dados['ex2name'].">"; 
        if($Ex2Select == $dados['ex2name']){echo "selected ";}
        echo $dados['ex2name']."</option>";}
    echo "</select>";

Como você pode ver, eu defini previamente a variável $Ex1Select logo no primeiro bloco, isso porque o PHP não é capaz de saber qual a opção que o usuário escolheu, isso só o JavaScript é capaz. Já a segunda caixa de combinação restringe ao valor que o usuário escolheu no primeiro bloco. Pelo que eu entendi pelo enunciado, são duas caixas de combinação com os mesmos valores, o que você faz num, o outro repete. Isso não dá para ser feito pelo PHP.

Compartilhar este post


Link para o post
Compartilhar em outros sites
4 horas atrás, Frank K Hosaka disse:

 

 

Eu recebi várias mensagens de erro na hora de testar o seu código por aqui, primeiro com a função SELECT que o VS Code não reconheceu e segundo com a variável $Ex1Select que não foi definida no primeiro bloco. Para tentar a ideia que você sugeriu, montei o seguinte código:
 



<?php
    $Ex1Select="amarelo";
    $mysqli=new mysqli("localhost","root","","astudy");
    $query=$mysqli->query("select * from tbEx1");
    $select = $query->fetch_all(MYSQLI_ASSOC);
    echo "Exemplo 01 <select>";
    foreach ($select as $dados) { 
       echo "<option value=".$dados['ex1name'].">";
       if($Ex1Select == $dados['ex1name']){echo "selected ";}
       echo $dados['ex1name']."</option>";}
    echo "</select>";
    $Ex2Select="amarelo";
    $query=$mysqli->query("select * from tbEx2 where ex2name='$Ex1Select'");
    $select=$query->fetch_all(MYSQLI_ASSOC);
    echo "Exemplo 02 <select>";
    foreach ($select as $dados) { 
        echo "<option value=".$dados['ex2name'].">"; 
        if($Ex2Select == $dados['ex2name']){echo "selected ";}
        echo $dados['ex2name']."</option>";}
    echo "</select>";

Como você pode ver, eu defini previamente a variável $Ex1Select logo no primeiro bloco, isso porque o PHP não é capaz de saber qual a opção que o usuário escolheu, isso só o JavaScript é capaz. Já a segunda caixa de combinação restringe ao valor que o usuário escolheu no primeiro bloco. Pelo que eu entendi pelo enunciado, são duas caixas de combinação com os mesmos valores, o que você faz num, o outro repete. Isso não dá para ser feito pelo PHP.

Ola bom dia!!

 

Que estou digitando pelo mobile, mais assim que tiver no notebook monto ela corretamente..

 

 

 

 

Mais por outro lado para que seja mais prático pode usar ajax

 


<script>
  $('#ex1').change(function(){
    $('.sair').remove();
    $.ajax({
        method: 'post',
        data: {id: $('#ex1').val()},
        url: 'ex2.php',
        success: function(retorno){
            for(i = 0; i < retorno.length; i++) {
                $('#ex2').append('<option class="sair" value="'+retorno[i].id+'" >'+retorno[i].nome+'</option>')
            }
        }
    });
});
  
  ?>

Esse código espera um resposta JSON

Compartilhar este post


Link para o post
Compartilhar em outros sites

Agora, eu tive essa ideia:

 

<div style="width: 100; height: 100; display: inline-block">
<select id=select1 onchange=select2.selectedIndex=select1.selectedIndex>
    <option>editar</option>
    <option>deletar</option>
    <option>adicionar</option>
</select>
</div>
<div style="width: 100; height: 100; display: inline-block">
<select id=select2 onchange=select1.selectedIndex=select2.selectedIndex>
    <option>editar</option>
    <option>deletar</option>
    <option>adicionar</option> 
</select>
</div>

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar Agora

  • Conteúdo Similar

    • Por Biel.
      Olá pessoal. Ao digitar um texto qualquer no input e pressionar submit o valor do atributo href é alterado temporariamente. Como alterar permanentemente no corpo do documento  o valor do atributo href, digitando um nome de link qualquer no campo input e em seguida submit ?
      <!DOCTYPE html> <html> <head> <style> input { width: 100%; font-size: 20px; } textarea { width: 100%; font-size: 16px; height: 200px; } .class88 { margin-top: 50px; padding: 10px; max-width: 100px; } </style> </head> <body> <h2> alterar valor do atributo href</h2> digite um texto qualquer <input type="text" class="class42" value=""> <a id="linkToChange" href="teste5.php" class="class43"></a> <input type="submit" class="class88" value="enviar" onclick="alterarHref()"> <script> function alterarHref() { // pega o valor da class42 var valorDaclass42 = document.querySelector('.class42').value.trim(); // altera o valor do atributo href para o valorDaclass42 sugerido document.querySelector('.class43').setAttribute('href', valorDaclass42); console.log("Href alterado:", valorDaclass42); } </script> </body> </html>  
    • Por Biel.
      Olá pessoal. BannerA está funcionando normalmente. Como usar mesmo script para bannerB e bannerC.
      <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Banner Aleatório</title> <style> /* Estilos opcionais para o banner */ #divPai { margin: auto; border: 2px solid red; } #bannerA { width: 240px; height: 480px; overflow: hidden; position: relative; } #bannerA img { width: 100%; height: auto; position: absolute; top: 0; left: 0; transition: 1.5s ease-in; } #bannerA img.active { opacity: 1; } </style> </head> <body> <div id="divPai"> <div id="bannerA" class="bannerA"> <a href="link1"><img src="image1.jpg" alt="Imagem 1"></a> <a href="link2"><img src="image2.jpg" alt="Imagem 2"></a> <a href="link3"><img src="image3.jpg" alt="Imagem 3"></a> </div> <!-- <hr> <div id="bannerB" class="bannerB"> <a href="link4"><img src="image4.jpg" alt="Imagem 4"></a> <a href="link5"><img src="image5.jpg" alt="Imagem 5"></a> <a href="link6"><img src="image6.jpg" alt="Imagem 6"></a> </div> <hr> <div id="bannerC" class="bannerC"> <a href="link7"><img src="image7.jpg" alt="Imagem 7"></a> <a href="link8"><img src="image8.jpg" alt="Imagem 8"></a> <a href="link9"><img src="image9.jpg" alt="Imagem 9"></a> </div> --> </div> <hr> <script> document.addEventListener("DOMContentLoaded", function() { // var banner = document.getElementById("divPai"); // var images = banner.querySelectorAll("img"); var images = document.querySelectorAll("#bannerA img"); // Função para exibir uma imagem aleatória function showRandomImage() { // Escolhe aleatoriamente um índice de imagem var randomIndex = Math.floor(Math.random() * images.length); // Define todas as imagens como ocultas images.forEach(function(img) { img.style.display = "none"; }); // Exibe a imagem aleatória images[randomIndex].style.display = "block"; } // Chama a função inicialmente e define um intervalo para exibir novas imagens a cada 3 segundos showRandomImage(); setInterval(showRandomImage, 1000); // makeSliderKind('.bannerA', 1000); // makeSliderKind('.bannerB', 2000); // makeSliderKind('.bannerC', 3000); }); </script> </body> </html>  
    • Por Biel.
      Olá pessoal. O banner abaixo está funcionando e o link acompanha o banner, até aqui tudo ok ! Quero muito fazer uma transição suave entre uma image e outra, colocando as propiedades e valores no css ou diretamente no javascript e nada de propiedades e valores no html através do style . Se possível coloque no código somente o que precisa . Obrigado!
      <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Banner</title> <style> /* Estilos opcionais para o banner */ .banner { width: 240px; height: 480px; overflow: hidden; position: relative; } .banner img { width: 100%; height: auto; position: absolute; top: 0; left: 0; transition: 1.5s ease-in; } .banner img.active { opacity: 1; } </style> </head> <body> <div class="banner" id="banner"> <a href="link1" class="ggg"><img src="image1.jpg" alt="Imagem 1"></a> <a href="link2" class="ggg"><img src="image2.jpg" alt="Imagem 2"></a> <a href="link3" class="ggg"><img src="image3.jpg" alt="Imagem 3"></a> <a href="link4" class="ggg"><img src="image4.jpg" alt="Imagem 4"></a> <a href="link5" class="ggg"><img src="image5.jpg" alt="Imagem 5"></a> </div> <script> document.addEventListener("DOMContentLoaded", function() { var banner = document.getElementById("banner"); var images = banner.querySelectorAll("img"); // Função para exibir uma imagem aleatória function showRandomImage() { // Escolhe aleatoriamente um índice de imagem var randomIndex = Math.floor(Math.random() * images.length); // Define todas as imagens como ocultas images.forEach(function(img) { img.style.display = "none"; }); // Exibe a imagem aleatória images[randomIndex].style.display = "block"; } // Chama a função inicialmente e define um intervalo para exibir novas imagens a cada 3 segundos showRandomImage(); setInterval(showRandomImage, 3000); }); </script> </body> </html>  
       
    • Por Biel.
      Olá pessoal. O banner abaixo está funcionando normalmente, mas a transição entre uma imagem e outra está um tanto truculenta. Quero deixar suave. Como resolver isso? Obrigado !
      <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>transition suave entre uma image e outra</title> <style> #banner { width: 240px; height: 480px; overflow: hidden; position: relative; } #bannerGG { width: 100%; height: auto; position: absolute; top: 0; left: 0; opacity: 0; transition: opacity 1s ease-in-out; } /* #tete:active { opacity: 1; } */ </style> </head> <body> <div id="banner"> <img class="bannerGG" src="imagem1.png" alt="Image 1"> <img class="bannerGG" src="imagem2.png" alt="Image 2"> <img class="bannerGG" src="imagem3.png" alt="Image 3"> <img class="bannerGG" src="imagem4.png" alt="Image 4"> <img class="bannerGG" src="imagem5.png" alt="Image 5"> </div> <script> const image = document.querySelectorAll('.bannerGG'); const banner = document.getElementById('banner'); function showRandomImage() { const randomIndex = Math.floor(Math.random() * image.length); const randomImage = image[randomIndex]; const imgElement = document.createElement('img'); imgElement.src = randomImage.src; const linkElement = document.createElement('a'); linkElement.appendChild(imgElement); banner.innerHTML = ''; banner.appendChild(linkElement); } showRandomImage(); setInterval(showRandomImage, 3000); </script> </body> </html>  
    • Por Biel.
      Olá pessoal. O banner abaixo está funcionando, mas quero que o link do banner venha da tag a  e não do javascript . Como resolver? 
      <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Mostrar link do banner que está na tag a</title> <style> #banner { width: 240px; height: 480px; overflow: hidden; position: relative; } .banner-img { width: 100%; height: 100%; object-fit: cover; position: absolute; /* opacity: 0; */ transition: opacity 0.5s ease-in-out; } .banner-link { display: block; width: 100%; height: 100%; } </style> </head> <body> <div id="banner"> <a href="link147"><img class="banner-img" src="imagem1.png" alt="Image 1"></a> <a href="link254"><img class="banner-img" src="imagem2.png" alt="Image 2"></a> <a href="link350"><img class="banner-img" src="imagem3.png" alt="Image 3"></a> <a href="link462"><img class="banner-img" src="imagem4.png" alt="Image 4"></a> <a href="link538"><img class="banner-img" src="imagem5.png" alt="Image 5"></a> </div> <script> const images = document.querySelectorAll('.banner-img'); const banner = document.getElementById('banner'); function showRandomImage() { const randomIndex = Math.floor(Math.random() * images.length); const randomImage = images[randomIndex]; const imgElement = document.createElement('img'); imgElement.src = randomImage.src; imgElement.alt = randomImage.alt; imgElement.classList.add('banner-img'); const linkElement = document.createElement('a'); // linkElement.appendChild(imgElement); linkElement.href = randomImage.href; linkElement.classList.add('banner-link'); linkElement.href = "page" + (randomIndex + 1) + ".html"; // Link para cada imagem linkElement.appendChild(imgElement); banner.innerHTML = ''; banner.appendChild(linkElement); } showRandomImage(); setInterval(showRandomImage, 1000); </script> </body> </html> Resolvido,  Obrigado a todos !
×

Informação importante

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