Fóruns sobre PHP, JavaScript, HTML, MySQLi, jQuery, Banco de Dados, CSS


Moderador: web

 
Mais de 100 postagens
Mais de 100 postagens
Tópico Autor
Mensagens: 396
Nome: João Paulo
Descrição do site: Site de Ofertas de Produtos da cidade
Sexo: Masculino
Localização: Bahia Luis Eduardo Magalhães

Criar novo button

16-12-2016 01:00

Boa noite! to com o seguinte problema: e a tela do sistema que usa o websockets e a tela de fila:
no php tenho uma tabela quando quero que cada resposta va em uma td coloco dentro do while e no JS tem como eu fazer isso ?
e possivel cada codigo ele gerar uma td? oque joga a mensagem na tela e o "log(payload);"
oque recebe do serviço websockets a informação e o "function log(text)"
como eu faria isso ?

codig:
<script> var Server; function conexao(text){ $conexao = $('#conexao'); //Add text to log $conexao.append(($conexao.val()?"\n":'')+text+"<br />"); //Autoscroll $conexao[0].scrollTop = $conexao[0].scrollHeight - $conexao[0].clientHeight; } function descon(text){ $descon = $('#descon'); //Add text to log $descon.append(($descon.val()?"\n":'')+text+"<br />"); //Autoscroll $descon[0].scrollTop = $descon[0].scrollHeight - $descon[0].clientHeight; } function log(text){ $log = $('#log'); //Add text to log $log.append(($log.val()?"\n":'')+text+"<br />"); //Autoscroll $log[0].scrollTop = $log[0].scrollHeight - $log[0].clientHeight; } function send(text){ Server.send('message', text); } $(document).ready(function(){ conexao('Connecting...'); Server = new FancyWebSocket('ws://187.84.234.138:9000'); //Let the user know we're connected Server.bind('open', function(){ conexao("Connected."); }); //OH NOES! Disconnection occurred. Server.bind('close', function(data){ descon("Disconnected."); }); //Log any messages sent from server Server.bind('message', function(payload){ log(payload); }); Server.connect(); }); </script> <div class="card-header" data-background-color="purple"> <h4 class="card-title">Fila Eletrônica</h4> <p class='category' id="descon"></p> <p class='category' id="conexao"></p> </div> <table class="table"> <thead class="text-danger"> <th>Senha</th> <th>Mesa</th> </thead> <tbody> <tr> <td><button class="btn btn-default"id="log"></button></td> <td><button class="btn btn-default"id="log"></button></td> </tr> </tbody> </table>

0
 
Avatar do usuário
ADMIN
ADMIN
Mensagens: 17685
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Re: Criar novo button

16-12-2016 07:54

Segue primeiro um exemplo para você ver como funciona o uso do jQuery after

<script src="jquery.js"></script> <script> $(function() { var coluna = $("#tabela").find("td"); coluna.after("<td>coluna 1</td>"); coluna.after("<td>coluna 2</td>"); coluna.after("<td>coluna 3</td>"); }); </script> <table id="tabela" border="1"> <tr> <td>coluna um</td> </tr> </table>

Já no seu código tenta assim:

var coluna = $("#table").find("td"); Server.bind('message', function(payload){ coluna.after("<td>"+payload+"</td>"); //log(payload); });

0
A melhor hospedagem para o seu site HostGator!
 
Mais de 100 postagens
Mais de 100 postagens
Tópico Autor
Mensagens: 396
Nome: João Paulo
Descrição do site: Site de Ofertas de Produtos da cidade
Sexo: Masculino
Localização: Bahia Luis Eduardo Magalhães

Re: Criar novo button

16-12-2016 10:19

eu preciso do log(payload); pq o log e que vai joga os dados dentro da ID #log no caso eu teria que criar uma TR com TD para cada informação errei no escrever...
0
 
Avatar do usuário
ADMIN
ADMIN
Mensagens: 17685
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Re: Criar novo button

16-12-2016 10:37

Tenta

var coluna = $("#table").find("tr"); Server.bind('message', function(payload){ coluna.after("<tr><td>"+log(payload)+"</td></tr>"); //log(payload); });

0
A melhor hospedagem para o seu site HostGator!
 
Mais de 100 postagens
Mais de 100 postagens
Tópico Autor
Mensagens: 396
Nome: João Paulo
Descrição do site: Site de Ofertas de Produtos da cidade
Sexo: Masculino
Localização: Bahia Luis Eduardo Magalhães

Re: Criar novo button

16-12-2016 11:01

funciono perfeitamente coloquei ele para jogar os dados dentro da "<tbody id="log"></tbody>" como a tr e td vai aqui dentro... agora eu tenho duas th uma senha que e o payload e a mesa que vou criar a função ainda para subistituir o mesa1 porem colocquei ali dentro o outro td mesa 1 e nao foi teria alguma coisa que puz errado ?

var coluna = $("#table").find("tr"); Server.bind('message', function(payload){ coluna.after("<tr><td>"+log(payload)+"</td><td>mesa1</td></tr>"); <table class="table"> <thead class="text-danger"> <th>Senha:</th> <th>Mesa:</th> </thead> <tbody id="log"> </tbody> </table>

0
 
Avatar do usuário
ADMIN
ADMIN
Mensagens: 17685
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Re: Criar novo button

16-12-2016 11:08

Você está usando classe table na tabela e tbody. Então fica:

var coluna = $(".table").find("tbody");

0
A melhor hospedagem para o seu site HostGator!
 
Mais de 100 postagens
Mais de 100 postagens
Tópico Autor
Mensagens: 396
Nome: João Paulo
Descrição do site: Site de Ofertas de Produtos da cidade
Sexo: Masculino
Localização: Bahia Luis Eduardo Magalhães

Re: Criar novo button

16-12-2016 15:39

Olha so como ficou vou por o codigo para ver ele apareceu um nome que nao era para aparecer
ele nao pode duplicar a tdody ele tem que duplicar as tr como no exemplo a baixo criei 2 tr vou colocar a foto para ver a diferença.
Imagem
var coluna = $(".table").find("tbody"); Server.bind('message', function(payload){ coluna.after("<tr><td>"+log(payload)+"</td><td>mesa</td></tr>"); //log(payload); }); </script> <div class="col-sm-4"> <div class="form-group"> <div class="card"> <div class="card-header" data-background-color="purple"> <h4 class="card-title">Fila Eletrônica</h4> <p class='category' id="conexao"></p> <h6 class="card-title" id="descon"></h6> </div> <div class="card-content table-responsive table-full-width"> <table class="table"> <thead class="text-danger"> <th>Senha:</th> <th>Mesa:</th> </thead> <tbody id="log"> <tr> <td>senha1</td> <td>mesa1</td> </tr> <tr> <td>senha2</td> <td>mesa2</td> </tr> </tbody> </table></div></div></div></div>

0
 
Avatar do usuário
ADMIN
ADMIN
Mensagens: 17685
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Re: Criar novo button

16-12-2016 15:54

Faz assim:

Troca

var coluna = $(".table").find("tbody"); // por var coluna = $("#log").find("tr");

e

<tbody id="log"> </tbody> // por <tbody id="log"> <tr></tr> </tbody>

0
A melhor hospedagem para o seu site HostGator!
 
Mais de 100 postagens
Mais de 100 postagens
Tópico Autor
Mensagens: 396
Nome: João Paulo
Descrição do site: Site de Ofertas de Produtos da cidade
Sexo: Masculino
Localização: Bahia Luis Eduardo Magalhães

Re: Criar novo button

16-12-2016 16:26

quase. ele gero certinho um do lado do outro so que deu erro unidfined ainda... ai troco a senhaA005 de lugar...

Imagem



var coluna = $("#log").find("tr"); Server.bind('message', function(payload){ coluna.after("<tr><td>"+log(payload)+"</td><td>mesa</td></tr>"); //log(payload); }); </script> <div class="col-sm-4"> <div class="form-group"> <div class="card"> <div class="card-header" data-background-color="purple"> <h4 class="card-title">Fila Eletrônica</h4> <p class='category' id="conexao"></p> <h6 class="card-title" id="descon"></h6> </div> <div class="card-content table-responsive table-full-width"> <table class="table"> <thead class="text-danger"> <th>Senha:</th> <th>Mesa:</th> </thead> <tbody id="log"> <tr> </tr> </tbody> </table></div></div></div></div>

0

Quem está online

Usuários navegando neste fórum: Nenhum usuário registrado