Boa tarde malta! Tenho estado a tentar resolver isto e já me fartei de pesquisar mas não encontrei solução!
Tenho este código:
Código :
A função show é chamada e cria normalmente a tabela, mas apenas quando não tenha a função onclick="'+removeQuantity(i)+'"
A função "removeQuantity" é iniciada normamente mas dá erro pois o document.getElementById('remove') retorna null.
Se eu aplicar estilos css sobr o id='remove' ele funciona perfeitamente!
Mas nesta sitção dá erro!
Preciso mesmo de umas luzes ....
Tenho este código:
Código :
<script>
function show() {
if (document.getElementById('cart').style.display == 'none' || document.getElementById('cart').style.display == ''){
document.getElementById('cart').style.display = 'block';
var num_rows = localStorage.length;
var num_cols = 6;
var theader = "<table id='table1'>";
var tbody = "";
theader = theader+"<th width = 150>Código</th>"+"<th width = 250>Produto</th>"+"<th width = 100>Quantidade</th>"+"<th width = 150>Preço Unidade</th>"+"<th width = 150>Preço Total</th>"+"<th width = 150>Remover</th>";
for(var i = 0; i < num_rows; i++)
{
tbody += "<tr>";
for(var j = 0; j < num_cols; j++)
{
tbody += "<td>";
if(j < num_cols-1)
{
var string = localStorage.getItem(i).split(',');
tbody += string[j];
}
else
{
tbody += "<label>";alert('a');
tbody += '<input type="number" id="remove" value="1" min="1" max="parseInt(string[2])">';alert('a');
tbody += '<button onclick="'+removeQuantity(i)+'"> X </button>';alert('a');
tbody += '</label>';
}
tbody += "</td>"
}
tbody += "</tr><br />";
}
var tfooter = "</table>";
document.getElementById('cartProducts').innerHTML = theader + tbody + tfooter;
}else{
document.getElementById('cart').style.display = 'none';
}
}
</script>
<script>
function removeQuantity(i)
{
var string = localStorage.getItem(i).split(',');
var quantityNow = string[2];
alert('a');
var quantityToRemove = document.getElementById('remove').value;
alert("b");
var key = localStorage.key(i);
localStorage.removeItem(key);
alert(parseInt(quantityNow));alert(parseInt(quantityToRemove));
cartitem=new Array();
cartitem[0] = string[0];
cartitem[1] = string[1];
cartitem[2] = parseInt(quantityNow) - parseInt(quantityToRemove);
cartitem[3] = string[3];
cartitem[4] = parseInt(string[3])*parseInt(cartitem[2]);
alert(cartitem[2]);alert(cartitem[4]);
localStorage.setItem(key, cartitem);
}
</script>
function show() {
if (document.getElementById('cart').style.display == 'none' || document.getElementById('cart').style.display == ''){
document.getElementById('cart').style.display = 'block';
var num_rows = localStorage.length;
var num_cols = 6;
var theader = "<table id='table1'>";
var tbody = "";
theader = theader+"<th width = 150>Código</th>"+"<th width = 250>Produto</th>"+"<th width = 100>Quantidade</th>"+"<th width = 150>Preço Unidade</th>"+"<th width = 150>Preço Total</th>"+"<th width = 150>Remover</th>";
for(var i = 0; i < num_rows; i++)
{
tbody += "<tr>";
for(var j = 0; j < num_cols; j++)
{
tbody += "<td>";
if(j < num_cols-1)
{
var string = localStorage.getItem(i).split(',');
tbody += string[j];
}
else
{
tbody += "<label>";alert('a');
tbody += '<input type="number" id="remove" value="1" min="1" max="parseInt(string[2])">';alert('a');
tbody += '<button onclick="'+removeQuantity(i)+'"> X </button>';alert('a');
tbody += '</label>';
}
tbody += "</td>"
}
tbody += "</tr><br />";
}
var tfooter = "</table>";
document.getElementById('cartProducts').innerHTML = theader + tbody + tfooter;
}else{
document.getElementById('cart').style.display = 'none';
}
}
</script>
<script>
function removeQuantity(i)
{
var string = localStorage.getItem(i).split(',');
var quantityNow = string[2];
alert('a');
var quantityToRemove = document.getElementById('remove').value;
alert("b");
var key = localStorage.key(i);
localStorage.removeItem(key);
alert(parseInt(quantityNow));alert(parseInt(quantityToRemove));
cartitem=new Array();
cartitem[0] = string[0];
cartitem[1] = string[1];
cartitem[2] = parseInt(quantityNow) - parseInt(quantityToRemove);
cartitem[3] = string[3];
cartitem[4] = parseInt(string[3])*parseInt(cartitem[2]);
alert(cartitem[2]);alert(cartitem[4]);
localStorage.setItem(key, cartitem);
}
</script>
A função show é chamada e cria normalmente a tabela, mas apenas quando não tenha a função onclick="'+removeQuantity(i)+'"
A função "removeQuantity" é iniciada normamente mas dá erro pois o document.getElementById('remove') retorna null.
Se eu aplicar estilos css sobr o id='remove' ele funciona perfeitamente!
Mas nesta sitção dá erro!
Preciso mesmo de umas luzes ....