Jump to content
DRS

Encontrar o valor da célula de uma tabela

Recommended Posts

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 :)

Edited by DRS

Share this post


Link to post
Share on other 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

Share this post


Link to post
Share on other 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);

Edited by DRS

Share this post


Link to post
Share on other 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

Share this post


Link to post
Share on other 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>...

Share this post


Link to post
Share on other 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

Share this post


Link to post
Share on other 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);
}

Edited by DRS

Share this post


Link to post
Share on other 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 ???

Edited by HappyHippyHippo

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

Share this post


Link to post
Share on other 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??

Edited by DRS

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×
×
  • Create New...

Important Information

By using this site you accept our Terms of Use and Privacy Policy. We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.