Ir para conteúdo

Arquivado

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

Sergio Murilo Cabral

Ajuda com loop em Javascript

Recommended Posts

Olá, estou com esse código abaixo:

------------------------------------------------------ INÍCIO DO CÓDIGO -----------------------------------------

<div class="" style="background:<?php echo $res['fundosite_cor']; ?>; width:588px; float:left;">

<script>
jssor_slider20_starter = function (containerId) {
var options = {
$DragOrientation: 3,
$BulletNavigatorOptions: {
$Class: $JssorBulletNavigator$,
$ChanceToShow: 2,
$ActionMode: 1,
$AutoCenter: 0,
$Steps: 1,
$Lanes: 1,
$SpacingX: 0,
$SpacingY: 0,
$Orientation: 1
}
};
var jssor_slider20 = new $JssorSlider$(containerId, options);
};
</script>
<?php
include
"conexao.php";
$codigo = $_POST['codigo'];
$img01 = $_POST['img01'];
$img02 = $_POST['img02'];
$img03 = $_POST['img03'];
$img04 = $_POST['img04'];
$titulo = $_POST['titulo'];
$preco = $_POST['preco'];
$query = mysql_query("SELECT * FROM produto ORDER BY RAND() LIMIT 9");

while($res = mysql_fetch_array($query)){
?>

<div style="background-color:<?php echo $res['fundosite_cor']; ?>;; padding:11px;" class="center_prod_box">

<div id="titulo" class="product_title">
<?php echo $res['titulo']; ?>
</div>
<!-- Jssor Slider Begin -->
<!-- To move inline styles to css file/block, please specify a class name for each element. -->
<div id="slider20_container" style="position: relative; top: 0px; left: 0px; width: 173px;
height: 173px; background-color:
<?php echo $res['fundosite_cor']; ?>;">

<!-- Loading Screen -->
<div u="loading" style="position: absolute; top: 0px; left: 0px;">
<div style="filter: alpha(opacity=70); opacity:0.7; position: absolute; display: block;
background-color: #000000; top: 0px; left: 0px;width: 100%;height:100%;">
</div>
<div style="position: absolute; display: block; background: url(img/loading.gif) no-repeat center center;
top: 0px; left: 0px;width: 100%;height:100%;">
</div>
</div>

<!-- Slides Container -->
<div u="slides" style="background-color:<?php echo $res['fundosite_cor']; ?>;cursor: move; position: absolute; left: 0px; top: 2px; height:150px; width:173px; text-align:center;
overflow: hidden;">

<div>
<a href="prod_detalhe.php?codigo=<?php echo $res['codigo']; ?>">
<img style="position:relative; top:50%; transform:translateY(-50%);"width="100" src="img_produtos/
<?php echo $res['img01']; ?>" />
</a>
</div>
<div>
<a href="prod_detalhe.php?codigo=<?php echo $res['codigo']; ?>">
<img style="position:relative; top:50%; transform:translateY(-50%);"width="100" src="img_produtos/
<?php echo $res['img02']; ?>" />
</a>
</div>
<div>
<a href="prod_detalhe.php?codigo=<?php echo $res['codigo']; ?>">
<img style="position:relative; top:50%; transform:translateY(-50%);"width="100" src="img_produtos/
<?php echo $res['img03']; ?>" />
</a>
</div>
<div>
<a href="prod_detalhe.php?codigo=<?php echo $res['codigo']; ?>">
<img style="position:relative; top:50%; transform:translateY(-50%);"width="100" src="img_produtos/
<?php echo $res['img04']; ?>" />
</a>
</div>
</div>

<!--#region Bullet Navigator Skin Begin -->
<!-- Help: http://www.jssor.com/development/slider-with-bullet-navigator-jquery.html -->
<style>
/* jssor slider bullet navigator skin 03 css */
/*
.jssorb03 div (normal)
.jssorb03 div:hover (normal mouseover)
.jssorb03 .av (active)
.jssorb03 .av:hover (active mouseover)
.jssorb03 .dn (mousedown)
*/

.jssorb03 {
position: absolute;
}
.jssorb03 div, .jssorb03 div:hover, .jssorb03 .av {
position: absolute;
/* size of bullet elment */
width: 21px;
height: 21px;
text-align: center;
line-height: 21px;
color: white;
font-size: 12px;
background: url(img/b03.png) no-repeat;
overflow: hidden;
cursor: pointer;
}
.jssorb03 div { background-position: -5px -4px; }
.jssorb03 div:hover, .jssorb03 .av:hover { background-position: -35px -4px; }
.jssorb03 .av { background-position: -65px -4px; }
.jssorb03 .dn, .jssorb03 .dn:hover { background-position: -95px -4px; }
</style>
<!-- bullet navigator container -->
<div u="navigator" class="jssorb03" style="bottom: 1px; left: 40px;">
<!-- bullet navigator item prototype -->
<div u="prototype"><div u="numbertemplate"></div></div>
</div>
<!--#endregion Bullet Navigator Skin End -->

<!-- Trigger -->
</div>
<!-- Jssor Slider End -->
<div id="preco" class="prod_price">
<span style="">
R$ <?php echo $res['preco']; ?>
</span>
</div>

<div id="carrinho" class=""><br />
<a href="prod_carrinho.php?acao=add&codigo=<?php echo $res['codigo']; ?>">
<img style="position:relative;top:50%;transform:translateY(-50%); "width="20" src="img/carrinho.png" title="Por no Carrinho" />
</a>
</div>
<hr id="linha1" />
<hr id="linha2" />
</div>
<?php
}
?>

</div>
<script>
jssor_slider20_starter('slider20_container');
</script>
</div>

 

-------------------------------------------------------- FIM DO CÓDIGO -------------------------------------------

A finalidade é ao acessar a página gostaria que aparecesse 9 produtos aleatórios (No momento tenho apenas 02 produtos listados). Para isso achei que somente dando um WHILE no código php funcionaria, mas puro engano, pois somente consigo dar loop nos arquivos que estão na tabela produtos, mas não consigo fazer com que o script funcione no segundo produto listado.

Não estou sabendo fazer com que o script se repita (LOOP). Já pesquisei alguns poster ate mesmo no W3schools, mas não consegui aplicar a logica em meu script, talvez por ser muito leigo em JavaScript.

Estou anexando abaixo o endereço de acesso para que os amigos possam dar uma analisada e me dizer o que esta faltando ou como posso faze-lo funcionar.


Página com o Problema - http://lccinformatica.com.br/prod_index.php


Espero ter conseguido me expressar ao modo que os amigos possam entender a minha necessidade.

Abraços à todos e no aguardo se possível de respostas positivas.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Não sei o que é mas bati o olho e:

<!-- Slides Container -->
<div u="slides"... 

O correto não seria id="slides" ou class="slides" algo do gênero?

 

Quantos produtos você tem nessa tabela produto?

Compartilhar este post


Link para o post
Compartilhar em outros sites

Em relação a DIV eu mantive do jeito que esta no projeto da JQuery, e tenho apenas dois produtos cadastrados na tabela produto, Placa Mãe e Geladeira, ambos somente para testar.

Me parece que o problema estar em dar um loop no script que organiza e da movimento na escolha dos botões enumerados para mudar a imagem. Pode reparar que o primeiro item sempre esta funcionando.

Já pesquisei ate mesmo na W3schools - http://www.w3schools.com/js/js_loop_while.asp, que me oferece algumas dicas mas como sou muito leigo em JavaScript não consegui entender a logica para implantar no meu script.

Se tiveres alguma ideia de como devo proceder para coloca-lo funcionando, ficarei agradecido.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Consegui resolver o problema!!!

A solução foi iniciar o loop antes do Script, inserir o código de cada produto cadastrado na tabela produtos na linha do script referente ao mesmo, na <div id="slider<?php echo $res['codigo']; ?>_container" e lá no final do código passei o segundo script para dentro do Loop com o código dos produtos inserido nele tambem, ficando assim o código:

 

--------------------------- Início do Código ----------------------------------------

 

<?php

include "conexao.php";
$codigo = $_POST['codigo'];
$img01 = $_POST['img01'];
$img02 = $_POST['img02'];
$img03 = $_POST['img03'];
$img04 = $_POST['img04'];
$titulo = $_POST['titulo'];
$preco = $_POST['preco'];
$query = mysql_query("SELECT * FROM produto ORDER BY RAND() LIMIT 9");
while($res = mysql_fetch_array($query)){
?>

<script>
jssor_slider<?php echo $res['codigo']; ?>_starter = function (containerId) {
var options = {
$DragOrientation: 3,
$BulletNavigatorOptions: {
$Class: $JssorBulletNavigator$,
$ChanceToShow: 2,
$ActionMode: 1,
$AutoCenter: 0,
$Steps: 1,
$Lanes: 1,
$SpacingX: 0,
$SpacingY: 0,
$Orientation: 1
}
};
var jssor_slider<?php echo $res['codigo']; ?> = new $JssorSlider$(containerId, options);
};
</script>

 

<div style="background-color:<?php echo $res['fundosite_cor']; ?>;; padding:11px;" class="center_prod_box">

<div id="titulo" class="product_title">
<?php echo $res['titulo']; ?>
</div>
<!-- Jssor Slider Begin -->
<!-- To move inline styles to css file/block, please specify a class name for each element. -->
<div id="slider<?php echo $res['codigo']; ?>_container" style="position: relative; top: 0px; left: 0px; width: 173px;
height: 173px; background-color:<?php echo $res['fundosite_cor']; ?>;">
<!-- Loading Screen -->
<div u="loading" style="position: absolute; top: 0px; left: 0px;">
<div style="filter: alpha(opacity=70); opacity:0.7; position: absolute; display: block;
background-color: #000000; top: 0px; left: 0px;width: 100%;height:100%;">
</div>
<div style="position: absolute; display: block; background: url(img/loading.gif) no-repeat center center;
top: 0px; left: 0px;width: 100%;height:100%;">
</div>
</div>
<!-- Slides Container -->
<div u="slides" style="background-color:<?php echo $res['fundosite_cor']; ?>;cursor: move; position: absolute; left: 0px; top: 2px; height:150px; width:173px; text-align:center;
overflow: hidden;">
<div>
<a href="prod_detalhe.php?codigo=<?php echo $res['codigo']; ?>">
<img style="position:relative; top:50%; transform:translateY(-50%);"width="100" src="img_produtos/<?php echo $res['img01']; ?>" />
</a>
</div>
<div>
<a href="prod_detalhe.php?codigo=<?php echo $res['codigo']; ?>">
<img style="position:relative; top:50%; transform:translateY(-50%);"width="100" src="img_produtos/<?php echo $res['img02']; ?>" />
</a>
</div>
<div>
<a href="prod_detalhe.php?codigo=<?php echo $res['codigo']; ?>">
<img style="position:relative; top:50%; transform:translateY(-50%);"width="100" src="img_produtos/<?php echo $res['img03']; ?>" />
</a>
</div>
<div>
<a href="prod_detalhe.php?codigo=<?php echo $res['codigo']; ?>">
<img style="position:relative; top:50%; transform:translateY(-50%);"width="100" src="img_produtos/<?php echo $res['img04']; ?>" />
</a>
</div>
</div>
<!--#region Bullet Navigator Skin Begin -->
<style>
/* jssor slider bullet navigator skin 03 css */
/*
.jssorb03 div (normal)
.jssorb03 div:hover (normal mouseover)
.jssorb03 .av (active)
.jssorb03 .av:hover (active mouseover)
.jssorb03 .dn (mousedown)
*/
.jssorb03 {
position: absolute;
}
.jssorb03 div, .jssorb03 div:hover, .jssorb03 .av {
position: absolute;
/* size of bullet elment */
width: 21px;
height: 21px;
text-align: center;
line-height: 21px;
color: white;
font-size: 12px;
background: url(img/b03.png) no-repeat;
overflow: hidden;
cursor: pointer;
}
.jssorb03 div { background-position: -5px -4px; }
.jssorb03 div:hover, .jssorb03 .av:hover { background-position: -35px -4px; }
.jssorb03 .av { background-position: -65px -4px; }
.jssorb03 .dn, .jssorb03 .dn:hover { background-position: -95px -4px; }
</style>
<!-- bullet navigator container -->
<div u="navigator" class="jssorb03" style="bottom: 1px; left: 40px;">
<!-- bullet navigator item prototype -->
<div u="prototype"><div u="numbertemplate"></div></div>
</div>
<!--#endregion Bullet Navigator Skin End -->
<!-- Trigger -->
</div>
<!-- Jssor Slider End -->
<div id="preco" class="prod_price">
<span style="">
R$ <?php echo $res['preco']; ?>
</span>
</div>
<div id="carrinho" class=""><br />
<a href="prod_carrinho.php?acao=add&codigo=<?php echo $res['codigo']; ?>">
<img style="position:relative;top:50%;transform:translateY(-50%); "width="20" src="img/carrinho.png" title="Por no Carrinho" />
</a>
</div>
<hr id="linha1" />
<hr id="linha2" />
</div>
<script>
jssor_slider<?php echo $res['codigo']; ?>_starter('slider<?php echo $res['codigo']; ?>_container');
</script>
<?php
}
?>
</div>

--------------------------- Início do Código ----------------------------------------

Espero que esse post venha ajudar a outros usuários com o mesmo problema.

Agradeço a atenção, e grande abraço à todos.

Compartilhar este post


Link para o post
Compartilhar em outros sites

  • Conteúdo Similar

    • Por violin101
      Caros amigos, saudações.

      Por favor, me perdoa em recorrer a ajuda dos amigos, mas preciso entender uma processo que não estou conseguindo sucesso.

      Como mencionado no Título estou escrevendo um Sistema Web para Gerenciamento de Empresa.
       
      Minha dúvida, que preciso muito entender:
      - preciso agora escrever a Rotina para Emissão de NFe e essa parte não estou conseguindo.
       
      tenho assistido alguns vídeos e leituras, mas não estou conseguindo sucesso, já fiz toda as importações das LIB da NFePhp conforme orientação.

      Preciso de ajuda.

      Algum dos amigos tem conhecimento de algum passo-a-passo explicando a criação dessa rotina ?

      tenho visto alguns vídeos com LARAVEL, mas quando tento utilizar e converter para PHP+Codeiginter, dá uma fila de erros que não entendo, mesmo informando as lib necessárias.

      Alguns do amigo tem algum vídeo, leitura explicando essa parte ?

      Grato,

      Cesar.
    • Por violin101
      Caros amigos, saudações.

      Por favor, me perdoa em recorrer ao auxílio dos amigos, mas preciso entender e resolver um problema.
       
      Tenho uma Rotina que o usuário seleciona os produtos que deseja para requerer ao setor responsável.
       
      O usuário escolhe um produto qualquer e Clicla em um button para incluir a lista.

      O problema que estou enfrentando é que após escolher o produto e teclar ENTER o Sistema já salva no BD.
       
      Gostaria de criar uma Tecla de Atalho, para quando incluir/escolher o produto na lista, o usuário tecla como exemplo:
      ALT+A  para agregar a lista
      ALT+S para salvar a lista de itens desejados.

      Assim, quando teclar enter, o sistema não dispara o GRAVAR na Base de Dados.

      Grato,

      Cesar
       
       
       
    • Por violin101
      Caros amigos, saudações.

      Estou com uma pequena dúvida se é possível ser realizado.

      Preciso passar 2 IDs para o Sistema executar a função, estou utilizando desta forma e gostaria de saber como faço via JS para passar os parâmetro que preciso.

      Observação:
      Dentro da TABELA utilizei 2 Forms, para passar os IDS que preciso, funcionou conforme código abaixo.
      <div class="card-body"> <table id="tab_clie" class="table table-bordered table-hover"> <thead> <tr> <th style="text-align:center; width:10%;">Pedido Nº</th> <th style="text-align:center; width:10%;">Data Pedido</th> <th style="text-align:center; width:32%;">Fornecedor</th> <th style="text-align:center; width:10%;">Status</th> <th style="text-align:center; width:5%;">Ação</th> </tr> </thead> <tbody> <?php foreach ($results as $r) { $dta_ped = date(('d/m/Y'), strtotime($r->dataPedido)); switch ($r->pd_status) { case '1': $status = '&nbsp;&nbsp;Aberto&nbsp;&nbsp;'; $txt = '#FFFFFF'; //Cor: Branco $cor = '#000000'; //Cor: Preta break; case '2': $status = 'Atendido Total'; $txt = '#FFFFFF'; //Cor: Branco $cor = '#086108'; //Cor: Verde break; case '3': $status = 'Atendido Parcial'; $txt = '#000000'; //Cor: Branco $cor = '#FEA118'; //Cor: Amarelo break; default: $status = 'Cancelado'; $txt = '#FFFFFF'; //Cor: Branco $cor = '#D20101'; //Cor: Vermelho break; } echo '<tr>'; echo '<td width="10%" height="10" style="text-align:center;">'.$r->pd_numero.'</td>'; echo '<td width="10%" height="10" style="text-align:center;">'.$dta_ped.'</td>'; echo '<td width="32%" height="10" style="text-align:left;">'.$r->nome.'</td>'; echo '<td width="10%" height="10" style="text-align:left;"><span class="badge" style="color:'.$txt.'; background-color:'.$cor.'; border-color:'.$cor.'">'.$status.'</span></td>'; echo '<td width="5%" style="text-align:center;">'; ?> <div class="row"> <?php if($this->permission->checkPermission($this->session->userdata('permissao'), 'vPedido')){ ?> <form action="<?= base_url() ?>compras/pedidos/visualizar" method="POST" > <input type="hidden" name="idPedido" value="<?php echo $r->idPedidos; ?>"> <input type="hidden" name="nrPedido" value="<?php echo $r->pd_numero; ?>"> <button class="btn btn-warning" title="Visualizar" style="margin-left:50%; padding: 1px 3px;"><i class="fa fa-search icon-white"></i></button> </form> <?php } if($this->permission->checkPermission($this->session->userdata('permissao'), 'ePedido')){ ?> <form action="<?= base_url() ?>compras/pedidos/editar" method="POST" > <input type="hidden" name="idPedido" value="<?php echo $r->idPedidos; ?>"> <input type="hidden" name="nrPedido" value="<?php echo $r->pd_numero; ?>"> <button class="btn btn-primary" title="Editar" style="margin-left:50%; padding: 1px 3px;"><i class="fa fa-edit icon-white"></i></button> </form> <?php } ?> </div> <?php echo '</td>'; echo '</tr>'; } ?> </tbody> </table> </div>
      Grato,

      Cesar.
    • Por violin101
      Caros amigos, saudações.

      Por favor, peço desculpa em recorrer a ajuda dos amigos referente uma dúvida.

      Tenho um Sistema que estou escrevendo em PHP + Codeigniter e a minha dúvida em Codeigniter é:
      Obs.: as tabela são em MySql

      => como faço para IMPORTAR o dado de uma Tabela para outra, as tabela são:
      ___________________Tabela de Pedido     =========== para ==========>    Tabela de Entrada de Lançamentos
      itens: codigoProduto | quantidade | valorUnitario  === importar===> itens: codigoProduto | quantidade | valorUnitario
       
      Estou tentando de várias formas, mas não estou conseguindo.

      Por favor, alguém pode me dar uma ajuda, explicação ou orientação.

      Grato,
       
      Cesar
       
    • Por violin101
      Caros amigos, saudações.
       
      Estou com uma pequena dúvida que não estou conseguindo resolver.

      Tenho 2 Tabelas, a 1ª.principal e a 2ª.secundária.

      Exemplo:
      Dados da 1ª Tabela - Peças e Equipamentos
      Dados da 2ª Tabela - Veículos.

      Seria isso:
      0010 - Pneu Aro 20
        [x] 001 - Corsa
        [_] 002 - Fusca
        [_] 003 - Palio
      Comentário:________________
       
      0100 - Óleo para Motor
         [x] 002 - Fusca
         [_] 003 - Palio
      Comentário:________________
       
      1030 - Lubrificante
         [_] 001 - Corsa
         [x] 003 - Palio
      Comentário:________________
       
      O meu problema está sendo quando preciso SALVAR/ATERAR o campo COMENTÁRIO, pois trata-se da 1ª.tabela.
       
      Gostaria salvar o COMENTÁRIO sem interferir nas seleção da 2ª. tabela.
       
      Grato,
       
      Cesar
       
       
       
       
       
×

Informação importante

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