Ir para o conteúdo
  • Revista PROGRAMAR: Já está disponível a edição #60 da revista programar. Faz já o download aqui!

DRS

Encontrar o valor da célula de uma tabela

Mensagens Recomendadas

DRS

Estou fazendo uma aplicação web em javascript que escolhe um produto contido num menu e acrescenta esse produto numa tabela

acrescentando uma linha com o produto.

O problema é que agora gostaria de ir buscar o o valor de alguma celula da tabela como por exemplo, a quantidade de um certo produto, já tentei de varias maneiras e nenhuma das que vi na net parece funcionar.

Código Javascript:

var input;
var conta = 1;
var n = 0;
var i = 1;
var x = 0;
function novaLinha() {

 var linhas = document.getElementById("tabela_produto").rows;
 input = document.getElementById("menu").value;

 /*----------PROBLEMA AQUI-------------------------------------------------*/
 var row = document.getElementById("tabela_row_1");

 var element = row.getElementsByTagName("td");

 var cell = element[0].innerText;

 alert(cell);
 /*-----------------------------------------------------------------------------*/

 var parte1 = "<tr id='tabela_row_" + conta +  "'><td>"+ input + "</td><td><input size='2' value='" + conta + "'></input></td>" + "<td>Total</td>";
 var parte2 = "<td  id='tabela_linha_" + conta + "'><input type='button' ";
 var parte3 = "value='X' onclick=\"javascript:removeLinha('tabela_linha_"+conta+"')\"></input>";
 document.getElementById("tabela_produto").innerHTML += parte1 + parte2 + parte3;
 document.getElementById("tabela_produto").innerHTML += "</td></tr>";
 }

Código HTML:

<body>
<select id="menu" multiple name="Menu">
 <option onclick="javascript:novaLinha()" id="Vodka" value="Vodka">Vodka</option>
 <option onclick="javascript:novaLinha()" id="Caipirinha" value="Caipirinha">Caipirinha</option>
 <option onclick="javascript:novaLinha()" id="Vinho Tinto" value="Vinho Tinto">Vinho Tinto</option>
 <option onclick="javascript:novaLinha()" id="Cerveja" value="Cerveja">Cerveja</option>
</select><p>

<!-- TABELA QUE RECEBE PEDIDOS  -->

<table id="tabela_produto" >
 <tr>
  <td>Produto</td><td>Qtd</td><td>Preco total</td><td></td>
 </tr>
 <tr>
 </tr>
</table><p>

<h5>Pedidos realizados</h5><p>
<textarea id="msg" name="Area de texto" rows="10" cols="10" style="resize: none;" data-role="none" disabled>
</textarea><p>
</body>

Neste momento, a aplicação só acrescenta e elimina produto e tal como disse preciso saber como buscar os valores de uma celula e penso que apartir dai conseguirei continuarmais rapidamente.

EU acho que o problema só esta no codigo javascript onde eu comentei "PROBLEMA AQUI".

Agradeço quaisquer ajudas! Obrigado :)

Editado por DRS

Partilhar esta mensagem


Ligação para a mensagem
Partilhar noutros sites
HappyHippyHippo

Neste momento, a aplicação só acrescenta e elimina produto

como é que faz isso se tens erro no javascript ?? tem um } a mais !!!


IRC : sim, é algo que ainda existe >> #p@p

Partilhar esta mensagem


Ligação para a mensagem
Partilhar noutros sites
DRS

como é que faz isso se tens erro no javascript ?? tem um } a mais !!!

Nâo tem, eu é que apaguei todos os comentarios e sem querer deixei ai um } a mais mas funciona, o meu problema esta em retirar o valor da celula desejada.

Pelo que testei, buscar a linha desejada esta correcto mas se eu deixar o resto do codigo, o programa deixa de adicionar produtos portanto algo esta muito mal :s.

Parte do código que me refiro:

 var row = document.getElementById("tabela_row_1");
 var element = row.getElementsByTagName("td");
 var cell = element[0].innerText;
 alert(cell);

Editado por DRS

Partilhar esta mensagem


Ligação para a mensagem
Partilhar noutros sites
HappyHippyHippo
   var rows = document.getElementById("tabela_produto").getElementsByTagName("tr");

   for (row = 0; row < rows.length; row++) {
     var cells = rows[row].getElementsByTagName("td");

     var name     = cells[0].innerHTML;
     var quantity = cells[1].innerHTML;
     var price    = cells[2].innerHTML;
     var last     = cells[3].innerHTML;

     if (name == input) {
       alert("Already selected");
     }
   }


IRC : sim, é algo que ainda existe >> #p@p

Partilhar esta mensagem


Ligação para a mensagem
Partilhar noutros sites
DRS

var rows = document.getElementById("tabela_produto").getElementsByTagName("tr");

for (row = 0; row < rows.length; row++) {
  var cells = rows[row].getElementsByTagName("td");

  var name	 = cells[0].innerHTML;
  var quantity = cells[1].innerHTML;
  var price	= cells[2].innerHTML;
  var last	 = cells[3].innerHTML;

  if (name == input) {
	alert("Already selected");
  }
}

Eu substitui por esse codigo, mas não funciona, quando comento o codigo ele adiciona produtos, quando deixo o codigo deixa de funcionar.

O que me irrita porque eu olho para o codigo e parece-me estar todo certo...

Além disso a minha intenção é buscar o valor da quantidade através do id da linha "<tr id='tabela_row_" + conta "'></tr>...

Partilhar esta mensagem


Ligação para a mensagem
Partilhar noutros sites
HappyHippyHippo

Eu substitui por esse codigo, mas não funciona

o problema está noutro local, o código está 100% correcto para o HTML apresentado

Além disso a minha intenção é buscar o valor da quantidade através do id da linha "<tr id='tabela_row_" + conta "'></tr>...

não podes, não sabes o valor de conta na chamada da função


IRC : sim, é algo que ainda existe >> #p@p

Partilhar esta mensagem


Ligação para a mensagem
Partilhar noutros sites
DRS

o problema está noutro local, o código está 100% correcto para o HTML apresentado

não podes, não sabes o valor de conta na chamada da função

Também me parece estar 100% certo mas não consigo perceber então donde vem o erro, vou deixar 100% do código a ver se consegues ver algo que eu n vejo lol....

Código HTML:

<!DOCTYPE html>
<html>
<head>
 <title> JQuery Lesson 4  </title>
 <h1> JQuery Lesson 4 </h1>

 <link rel="stylesheet" type="text/css" href="css1.css"/>

 <script type="text/javascript" src="jquery-1.10.2.min.js"></script>
 <script type="text/javascript" src="custom2.js"></script>

</head>
<body>
<select id="menu" multiple name="Menu">
 <option onclick="javascript:novaLinha()" id="Vodka" value="Vodka">Vodka</option>
 <option onclick="javascript:novaLinha()" id="Caipirinha" value="Caipirinha">Caipirinha</option>
 <option onclick="javascript:novaLinha()" id="Vinho Tinto" value="Vinho Tinto">Vinho Tinto</option>
 <option onclick="javascript:novaLinha()" id="Cerveja" value="Cerveja">Cerveja</option>
</select><p>

<!-- TABELA QUE RECEBE PEDIDOS  -->

<table id="tabela_produto" >
 <tr>
  <td>Produto</td><td>Qtd</td><td>Preco total</td><td></td>
 </tr>
 <tr>
 </tr>
</table><p>

<h5>Pedidos realizados</h5><p>
<textarea id="msg" name="Area de texto" rows="10" cols="10" style="resize: none;" data-role="none" disabled>
</textarea><p>

</body>
</html>

Código Javascript:

var input;
var conta = 1;
function novaLinha() {

var introduziu = 0;
var linhas = document.getElementById("tabela_produto").rows;
input = document.getElementById("menu").value;

var rows = document.getElementById("tabela_produto").getElementsByTagName("tr");
for (row = 0; row < rows.length; row++) {
var cells = rows[row].getElementsByTagName("td");
var name	 = cells[0].innerHTML;
var quantity = cells[1].innerHTML;
var price = cells[2].innerHTML;
var last	 = cells[3].innerHTML;
if (name == input) {
alert("Already selected");
}
}

var parte1 = "<tr id='tabela_row_" + conta + "'><td>"+ input + "</td><td><input size='2' value='" + conta + "'></input></td>" + "<td>Total</td>";
var parte2 = "<td id='tabela_linha_" + conta + "'><input type='button' ";
var parte3 = "value='X' onclick=\"javascript:removeLinha('tabela_linha_"+conta+"')\"></input>";
document.getElementById("tabela_produto").innerHTML += parte1 + parte2 + parte3;
document.getElementById("tabela_produto").innerHTML += "</td></tr>";

conta++;
}

function removeLinha(id){
teste = document.getElementById(id);
teste.parentNode.parentNode.removeChild(teste.parentNode);
}

Editado por DRS

Partilhar esta mensagem


Ligação para a mensagem
Partilhar noutros sites
HappyHippyHippo

epa... então andas a usar jquery, além da página ter o título JQuery Lesson 4 e andas a escrever javascript simples ???

Editado por HappyHippyHippo

IRC : sim, é algo que ainda existe >> #p@p

Partilhar esta mensagem


Ligação para a mensagem
Partilhar noutros sites
DRS

epa... então andas a usar jquery, além da página ter o título JQuery Lesson 4 e andas a escrever javascript simples ???

Podemos dizer que estou a experimentar de todo já que estou apenas há alguns dias a aprender esta linguagem e como as soluções que encontrei na net era com javascript simples, foi isso que usei.

Mas o problema esta no JQuery ou que??

Editado por DRS

Partilhar esta mensagem


Ligação para a mensagem
Partilhar noutros sites

Crie uma conta ou ligue-se para comentar

Só membros podem comentar

Criar nova conta

Registe para ter uma conta na nossa comunidade. É fácil!

Registar nova conta

Entra

Já tem conta? Inicie sessão aqui.

Entrar Agora

×

Aviso Sobre Cookies

Ao usar este site você aceita os nossos Termos de Uso e Política de Privacidade. Este site usa cookies para disponibilizar funcionalidades personalizadas. Para mais informações visite esta página.