Problemas para o contador funcionar buscando do banco de dados.

Jakson Fischer · 20 de junho de 2017

Boa tarde galera...

Vamos lá... Estou com o seguinte problema no momento...

Eu uso um plugin para contador, estou tendo que buscar dados no banco e fazer o insert pelo WHILE do PHP, mas estou com um problema... Por mais que ele interprete e coloque o valor das variáveis, ele não consegue iniciar o contador...

O meu código PHP está assim:

<?php
			
			$busca = "SELECT * FROM `anuncio` WHERE `id` != '0'";
			$sql = mysql_query($busca);
			while($row = mysql_fetch_array($sql)){
				
				$id = $row['id'];
				$nome = $row['nome'];
				$img = $row['img'];
				$localizacao = $row['localizacao'];
				$avaliado = $row['avaliado'];
				$inicial = $row['inicial'];
				$data = $row['data'];
				$link = $row['link'];
				$destaque = $row['destaque'];
				$vendido = $row['vendido'];
				$ativo = $row['ativo'];
				$desconto = $row['desconto'];
				$contador = 1;
				$data = date($data);
				
				
				if ($destaque == 1) {
					$destaque = "
									<div class='destaque-leilao'>
										<img src='./img/destaque.gif' />
									</div>
								";
				} else {
					$destaque = "
									<div class='destaque-leilao' style='display: none;'>
										<img src='./img/destaque.gif' />
									</div>
								";
				}
				
				if ($vendido == 1) {
					$vendido = "
									<div class='faixa'>
										<span class='faixa-texto'>ARREMATADO</span>
									</div>
								";
				} else {
					$vendido = "
									<div class='faixa' style='display: none;'>
										<span class='faixa-texto'>ARREMATADO</span>
									</div>
								";
				}
				
				
				echo("
<!-- Início coluna -->
            <div class='col-md-4 col-sm-6 hero-feature'>
                <div class='col-md-12 col-sm-1 hero-feature'>
                    <div class='modal-sup'>
                <h4>&nbsp;</h4>
                    <h4 class='fonte' style='font-size: 20px;'><b>" . $nome . "</b></h4>
                    </div>
                </div>
                <div class='quebrar'></div>
                <div class='thumbnail'>
                <a href='#openModal1'>
				<!-- COLOCA O DESTAQUE SE FOR NECESSÁRIO -->
                    " . $destaque . "
				</a>
				<!-- COLOCA A FAIXA DE VENDIDO SE NECESSÁRIO -->
                " . $vendido . "
                    <img src='img/" . $img . "' alt='" . $nome . "' title='" . $nome . "'>
                    
                <div class='quebrar'></div>
                <div class='quebrar'></div>
                <div class='quebrar'></div>
                    <div class='modulos'>
                    	<div class='lhe'>
                        </div>
                    	<div class='marker-img'>
                        	<img src='img/map-marker.png' width='35%' />
                        </div>
                    	<div class='lhd'>
                        </div>
                        	<div class='separator'>
                            </div>
                        <h3>&nbsp;</h3>
                        <p>" . $localizacao . "</p>
                    </div>
                <div class='quebrar'></div>
                    <div class='quebrar'></div>
                    <div class='caption'>
                    <div class='caixabg'>
                        <p class='avaliado'>Avaliado em:</p>
                        <div class='valor-aval'>
                            <p class='texto'>R$ " . $avaliado . "</p>
                        </div>
                        <div class='circulo'>
                        	<span class='texto-circulo'><b>" . $desconto . "%</b></span>
                        </div>
                        <p class='inicial'>Segundo Leilão:</p>
                        <div class='valor-lance'>
                            <p class='texto-metade'>R$ " . $inicial . "</p>
                        </div>
                    </div>
                    </div>
                    <div class='quebrar'></div>
                    <div class='caption'>
                    	<span class='termino'><h5><b>Termina em:</b></h5></span>
                        <div class='contador'>
                        	<div class='timer-label'>
                            	<div class='label-timer'>
                                	DIAS
                                </div>
                            	<div class='label-timer'>
                                	HORAS
                                </div>
                            	<div class='label-timer'>
                                	MINUTOS
                                </div>
                            	<div class='label-timer'>
                                	SEGUNDOS
                                </div>
                            </div>
                          <div class='counter" . $id . "'>
                            </div>
								<script type=\"text/javascript\">
                                        
                                        $('.counter" . $id . "').countdown('" . $data . "', {elapse: true}).on('update.countdown', function(event) {
                                          if (event.elapsed) {
										  
										  var $this = $(this).html(event.strftime(''
										  	+ '<div class=\"encerrado\">'
											+ '<span class=\"tex_enc\">ENCERRADO</span>'
											+ '</div>'));
										  } else {
										  
										  var $this = $(this).html(event.strftime(''
										  	+ '<div class=\"tempo\"> '
                                            	+ '<span class=\"tempo-texto\">%-D</span> '
											+ '</div>'
                                            + '<span class=\"pontos\">:</span>'
										  	+ '<div class=\"tempo\"> '
                                            	+ '<span class=\"tempo-texto\">%H</span> '
											+ '</div>'
                                            + '<span class=\"pontos\">:</span>'
										  	+ '<div class=\"tempo\"> '
                                            	+ '<span class=\"tempo-texto\">%M</span>  '
											+ '</div>'
                                            + '<span class=\"pontos\">:</span>'
										  	+ '<div class=\"tempo\"> '
                                            	+ '<span class=\"tempo-texto\">%S</span> '
											+ '</div>'));
										  }
                                        });
                                </script>
                        </div>
                        <a href='#openModal1' class='linkpopup' onClick=''>
                        <div class='bt-ver' onclick='document.getElementById('pop').style.display='block';'>
                            <span class='texto-bt'>VER MAIS</span>
                        </div>
                        </a>
                    </div>
                </div>
            </div>
            <!-- FIM DA COLUNA -->
			
			");
			}
			
			?>

Os dados são retornados normalmente... Verificando com o velho e bom inspetor ou com o CTRL + U, o código está aparecendo normalmente, mas não está iniciando o maldito contador...

Segue imagem no post...

Estou enviando também a imagem de como fica no HTML...

Sabem me dizer o porque de não estar iniciando o contador? Eu imagino que possa ser alguma coisa que o javascript não esteja conseguindo interpretar, mas não tenho certeza, infelizmente

Fico no aguardo.

Abraços.

Jakson Fischer · 21 de junho de 2017

@DiF me salva hahahaha

DiF · 21 de junho de 2017

@Jakson Fischer Olá, inicialmente olhando seu código, vi que está carregando o jquery dentro do echo no php.

Creio que ele precisa estar fora. O que você pode fazer é retirar essa parte de dentro do php, fazer uma consulta somente para a data e colocar o jquery lá onde deve ficar... no head ou antes de fechar o body.

Além disso, o plugin jQuery deve ser carregado antes, do plugin countdown.

Jakson Fischer · 21 de junho de 2017

Olá @DiF

Então... Eu tentei criar um arquivo js com todos os contadores, são mais ou menos uns 30 contadores, cada um sendo referenciado pela sua classe (counter1, counter2, counter3, etc...), Cada um deles tem o seu parâmetro, tudo certinho, mas eu não consigo fazer a chamada dele...

O JQuery está sendo chamado no header, este .js eu tentei colocar depois da DIV, dentro do PHP, no fim do documento, mas ele não consegue entrar lá e pegar estes dados, continua como se nada estivesse acontecendo lá =/

Não sei mais o que fazer para isso funcionar...

Jakson Fischer · 22 de junho de 2017

Fala galera,

@DiF Obrigado mais uma vez pela sua ajuda meu conterrâneo hahaha

Seguinte...

Resolvi da seguinte forma:

O PHP quando insere alguma coisa ele simplesmente pega o dado, envia pro servidor que por sua vez faz o trabalho cliente side, sendo assim, quando eu mando algo pelo ECHO ou pelo PRINT do PHP ele vai interpretar da forma com a qual ele leu, PORÉM... Quando eu estou trabalhando com alguma função de outra linguagem que tenha caracteres que são usados no PHP, tais como $ ou uma simples " ele vai tentar interpretar isso como se fosse uma variável ou início de string dele, pra resolver esse problema toda vez que eu encontrei algum elemento que ele utilize eu usei a \ na frente para que ele soubesse que aquilo não era pro PHP, mas sim era pra escrever dessa forma....

Ficou assim:

echo("
<script>
  \$('.counter" . $id . "').countdown('" . $data . "', {elapse: true}).on('update.countdown', function(event) {
      if (event.elapsed) {

      var \$this = \$(this).html(event.strftime(''
      + '<div class=\"encerrado\">'
      + '<span class=\"tex_enc\">ENCERRADO</span>'
      + '</div>'));
      } else {

      var \$this = \$(this).html(event.strftime(''
      + '<div class=\"tempo\"> '
      + '<span class=\"tempo-texto\">%-D</span> '
      + '</div>'
      + '<span class=\"pontos\">:</span>'
      + '<div class=\"tempo\"> '
      + '<span class=\"tempo-texto\">%H</span> '
      + '</div>'
      + '<span class=\"pontos\">:</span>'
      + '<div class=\"tempo\"> '
      + '<span class=\"tempo-texto\">%M</span>  '
      + '</div>'
      + '<span class=\"pontos\">:</span>'
      + '<div class=\"tempo\"> '
      + '<span class=\"tempo-texto\">%S</span> '
      + '</div>'));
  }
  });
</script>
");

Sempre que tinha um $ eu colocava no código \$, quando tinha uma " (aspa dupla ou double quote) eu colocava \", assim o PHP entende que aquilo não é pra ele, mas sim para ele escrever aquilo.

Eu só descobri isso depois que li sobre as convenções do PHP...

@DiF, obrigado novamente pela ajuda cara haha

Abraço.

DiF · 22 de junho de 2017

@Jakson Fischer Haaha poxa, me esqueci completamente dos "escapes" pois geralmente não uso isso, alias, eu sempre evito usar caractere de escape!

PS: não fiz nada de mais! Fiz comentários pertinentes ao que eu vi. Porém me esqueci completamente desses escapes!

No caso do seu, você poderia ter substituido o $ do jquery pela própria palavra!

exemplo:

$(document).ready(function(){
   $('#div_box').show();
  
});


Para


jQuery(document).ready(function(){
   jQuery('#div_box').show();
  
});

Mas como você já resolveu, não precisa realterar, de novo! deixe como está mesmo rsrsrs

Entrar

Problemas para o contador funcionar buscando do banco de dados.

Posts recomendados

Jakson Fischer

Link para o comentário

Compartilhar em outros sites

Jakson Fischer

Link para o comentário

Compartilhar em outros sites

DiF

Link para o comentário

Compartilhar em outros sites

Jakson Fischer

Link para o comentário

Compartilhar em outros sites

Jakson Fischer

Link para o comentário

Compartilhar em outros sites

DiF

Link para o comentário

Compartilhar em outros sites

Quem está navegando aqui 0 usuários estão online

Últimos tópicos

Livros

Cursos

Conteúdo recente

Sobre o Clube do Hardware

Direitos autorais

Mais

Fórum

Atividades

Artigos

Análises

Livros

Cursos