Hi all,
I have table in Javascript and it has addrow, deleterow, submit, and functions.
when i click it automatically adds new row and it has select option to choose some of them
for ex. in added two rows one of them is Motherboard Asus and other is Motherboard Gigabyte.
What i want is when i choose motherboard Asus it added news row with select option Motherboard asus and disabled select option and second time when i click add button let it adds rows but among select options let it ejects Motherboard ASUS. and with this way at the last there will be no options to select
Here is my code.
Thanks beforehands
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head><title>dinamik sheet</title>
<script>
var i=iteration;
function addrow(){
var tbl = document.getElementById('sheet');
var iteration = tbl.rows.length;
document.getElementById('count_rows').value = iteration;
var row=tbl.insertRow(iteration);
var cellLeft = row.insertCell(0);
var textNode = document.createTextNode(iteration);
cellLeft.appendChild(textNode);
var cellRight = row.insertCell(1);
var el = document.createElement('input');
el.type = 'text';
el.name = 'txtRow'+iteration;
el.id = 'txtRow'+iteration;
el.size = 15;
el.value = '0';
el.onblur = sum;
cellRight.appendChild(el);
var cellRight = row.insertCell(2);
var elaz = document.createElement('input');
elaz.type = 'text';
elaz.name = 'txtRowaz'+iteration;
elaz.id = 'txtRowaz'+iteration;
elaz.size = 20;
elaz.value = '0';
elaz.onblur = sum;
cellRight.appendChild(elaz);
var cellRight1 = row.insertCell(3);
var ela = document.createElement('input');
ela.type = 'text';
ela.name = 'txtRowe'+iteration;
ela.id = 'txtRowe'+iteration;
ela.size = 20;
ela.value = '0';
ela.onblur = sum;
cellRight1.appendChild(ela);
var cellRightsel = row.insertCell(4);
var sel = document.createElement('select');
sel.name = 'selRow' + iteration;
sel.id = 'selRow' + iteration;
sel.onchange = sum;
sel.options[0] = new Option('MotherBoard ASUS', 'MotherBoard ASUS');
sel.options[1] = new Option('MotherBoard Gigabyte', 'MotherBoard Gigabyte');
sel.options[2] = new Option('MotherBoard MSI', 'MotherBoard MSI');
sel.options[3] = new Option('Graphiqcard ASUS', 'Graphiqcard ASUS');
sel.options[4] = new Option('GraphigCard ATI', 'GraphigCard ATI');
sel.options[5] = new Option('GraphigCard GefORCE', 'GraphigCard GefORCE');
cellRightsel.appendChild(sel);
sum();
}
function removeRowFromTable()
{
var tbl = document.getElementById('sheet');
var lastRow = tbl.rows.length;
if (lastRow > 2) tbl.deleteRow(lastRow - 1);
}
function sum(){
var s1 = 0;
var s2 = 0;
var tbl=document.getElementById('sheet');
var iteration=tbl.rows.length-1;
for(var i=1; i<=iteration; i++){//loop through table rows
var el1 = document.getElementById('txtRow'+i);//Row's Income field
var el2 = document.getElementById('selRow'+i);//Row's percentage menu
var ela = document.getElementById('txtRowe'+i);//Row's Tax cell
var elaz=document.getElementById('txtRowaz'+i);
if(!el1 || !el2 || !ela||!elaz) continue;
var txt = el1.value;
if(txt != ( '' + Number(txt) )) continue; //reject non-numeric entries
var tax = Number(txt) * Number(130);
if(el2[el2.selectedIndex].value=="MotherBoard Gigabyte"){
var tax = Number(txt) * Number(150);
}
if(el2[el2.selectedIndex].value=="MotherBoard MSI"){
var tax = Number(txt) * Number(100);
}
if(el2[el2.selectedIndex].value=="Graphiqcard ASUS"){
var tax = Number(txt) * Number(85);
}
if(el2[el2.selectedIndex].value=="GraphigCard ATI"){
var tax = Number(txt) * Number(95);
}
if (el2[el2.selectedIndex].value=="GraphigCard ATI")
{
var tax = Number(txt) * Number(88);
}
ela.value = tax.toFixed(2);
elaz.value=tax.toFixed(2)/Number(txt);
if(isNaN(elaz.value)){
elaz.value=0;
}
s1 += Number(txt);
s2 += tax;
}
var t1 = document.getElementById('total');
var t2 = document.getElementById('taxtotal');
if(t1){ t1.value = s1.toFixed(2); }
if(t2){ t2.value = s2.toFixed(2); }
}
onload = function(){
addrow();
}
</script>
</head>
<body>
<form name="eval_edit" method="POST" action="part1.php?id=iteration-1">
<table align="center" width="75%">
<tr>
<td align="center">Balance sheet</td></tr>
<tr>
<td align="center">
<table id="sheet" border="1">
<tr><td>object</td><td>Total amount</td><td>One ITEM Price</td><td name="amount">Total Item Price </td><td>Name</td></tr>
</table>
</td>
</tr>
<tr>
<td align="center">
<input type="hidden" name="count_rows" id="count_rows" />
<input type="button" value="Add" onclick="addrow()" />
<input type="button" value="Remove" onclick="removeRowFromTable()" />
<input type="button" value="SUM" onClick="sum()"/>
<input type="submit" value="Submit" /><br />
</td>
</tr>
<tr>
<td align="left">
<input id="total" name="total" type="text"/>total amount of products<br />
<input id="taxtotal" name="taxtotal" type="text"/>total price of products
</td>
</tr>
</table>
</form>
</body>
</html>