calculating in table made by createElement and appendChild

Giganews Newsgroups
Subject: calculating in table made by createElement and appendChild
Posted by:  kiedr…@yahoo.com (kie)
Date: 9 Sep 2003

hello,

i have a table that creates and deletes rows dynamically using
createElement, appendChild, removeChild.
when i have added the required amount of rows and input my data, i
would like to calculate the totals in each row.

when i try however, i receive the error:

"Error: 'elements[...]' is null or not an object"

i have tried looping through all elements in the form and this gives
me the name & value of each element.
when i call the element by name however, i receive the above error.

it is easier to explain by cuting and pasting the source of my html
file below:

i'd greatly appreciate any pointers, here's the code.

<script language="JavaScript" type="text/JavaScript" >
<!--

var InternetExplorer = navigator.appName.indexOf("Microsoft") != -1;
var globalChanged = false;
var globalNewRowChanged = false;
var globalClaimLnsRowNum = 1;

function ex_amount(s_cur){                                                            
switch (s_cur)                                                                
    {                                                                        
case '1':                                    
return '1.2';                                    
break;                                                                    
case '2':                                    
return '0.6';                                    
break;                                                                    
case '3':                                    
return '1.5';                                    
break;                                                                    
case '4':                                    
return '2';                                    
break;                                                                    
case '5':                                    
return '1';                                    
break;                                                                    
default:                                                                    
return 0;                                                                    
    }                                                                        
}                                                                                                                                                
                                                                            
function detail_row(s_goods_id,s_unit_price,s_currency_id,s_quantity,s_uplift,s_total_line,s_incl_uplift,s_incl_uplift_euro)
{                                
    var body=document.body;                            
    var Table,theRow,aCell,aTextBox,tablebody2,rowSec2;                            
    var theTable;
    var rowSec1,currenttext;
    var opt1,sel2;
    var cellSec1,cellSec2,cellSec3,cellSec4,cellSec5;
    var cellSec6,cellSec7,cellSec8,cellSec9,cellSec10;
    theTable=document.getElementById('formation').getElementsByTagName('tbody')[0];
            tablebody2 = document.createElement('TBODY');                                        
                rowSec2=document.createElement('TR');                            
                    cellSec2=document.createElement('TD');                            
                        sel2=document.createElement('select');                            
                        sel2.name='2d_cmb_goods__' + globalClaimLnsRowNum;                            
                        opt1=document.createElement('option');                            
                        opt1.value='9';                            
                        if (opt1.value==s_goods_id){opt1.setAttribute('selected',
true);}
                        opt1.innerHTML='Airconditioners';                            
                        sel2.appendChild(opt1);                            
                        opt1=document.createElement('option');                            
                        opt1.value='5';                            
                        if (opt1.value==s_goods_id){opt1.setAttribute('selected',
true);}
                        opt1.innerHTML='Audio Goods';                            
                        sel2.appendChild(opt1);                            
                        opt1=document.createElement('option');                            
                        opt1.value='13';                
                        if (opt1.value==s_goods_id){opt1.setAttribute('selected',
true);}
                        opt1.innerHTML='Video Recorder';                            
                        sel2.appendChild(opt1);                            
                        cellSec2.appendChild(sel2);                            
                        rowSec2.appendChild(cellSec2);
                                                    
                    cellSec3=document.createElement('TD');                            
                        aTextBox=document.createElement('input');                            
                        aTextBox.type = 'text';                            
                        aTextBox.value = nz(s_unit_price);                            
                        aTextBox.size = '10';                            
                        aTextBox.name = '2d_txt_unit_price__' + globalClaimLnsRowNum;
                        cellSec3.appendChild(aTextBox);                             
                        rowSec2.appendChild(cellSec3);
                                                    
                    cellSec4=document.createElement('TD');                            
                        sel2=document.createElement('select');                            
                        sel2.name='2d_cmb_currency__' + globalClaimLnsRowNum;                            
                        opt1=document.createElement('option');                            
                        opt1.value='1';                            
                        if (opt1.value==s_currency_id){opt1.setAttribute('selected',
true);}
                        opt1.innerHTML='US$';                            
                        sel2.appendChild(opt1);                            
                        opt1=document.createElement('option');                            
                        opt1.value='2';                            
                        if (opt1.value==s_currency_id){opt1.setAttribute('selected',
true);}
                        opt1.innerHTML='&#65379;STG';                            
                        sel2.appendChild(opt1);                            
                        opt1=document.createElement('option');                            
                        opt1.value='3';                            
                        if (opt1.value==s_currency_id){opt1.setAttribute('selected',
true);}
                        opt1.innerHTML='A$';                            
                        sel2.appendChild(opt1);                            
                        opt1=document.createElement('option');                            
                        opt1.value='4';                            
                        if (opt1.value==s_currency_id){opt1.setAttribute('selected',
true);}
                        opt1.innerHTML='NZ$';                            
                        sel2.appendChild(opt1);                            
                        opt1=document.createElement('option');                            
                        opt1.value='5';                            
                        if (opt1.value==s_currency_id){opt1.setAttribute('selected',
true);}
                        opt1.innerHTML='BHAT';                            
                        sel2.appendChild(opt1);                            
                        cellSec4.appendChild(sel2);                            
                        rowSec2.appendChild(cellSec4);
                                                    
                    cellSec5=document.createElement('TD');                            
                        aTextBox=document.createElement('input');                            
                        aTextBox.type = 'text';                            
                        aTextBox.value = nz(s_quantity);                            
                        aTextBox.size = '5';                            
                        aTextBox.name = '2d_txt_quantity__' + globalClaimLnsRowNum;
                        cellSec5.appendChild(aTextBox);                             
                        rowSec2.appendChild(cellSec5);
                                                    
                    cellSec6=document.createElement('TD');                            
                        aTextBox=document.createElement('input');                            
                        aTextBox.type = 'text';                            
                        aTextBox.value = nz(s_total_line);                            
                        aTextBox.size = '5';                            
                        aTextBox.name = '2d_txt_total_line__' + globalClaimLnsRowNum;
                        cellSec6.appendChild(aTextBox);                             
                        rowSec2.appendChild(cellSec6);
                                                    
                    cellSec7=document.createElement('TD');                            
                        sel2=document.createElement('select');                            
                        sel2.name='2d_cmb_uplift__' + globalClaimLnsRowNum;                            
                        opt1=document.createElement('option');                            
                        opt1.value='100';                            
                        if (opt1.value==s_uplift){opt1.setAttribute('selected', true);}
                        opt1.innerHTML='100%';                            
                        sel2.appendChild(opt1);                            
                        opt1=document.createElement('option');                            
                        opt1.value='105';                            
                        if (opt1.value==s_uplift){opt1.setAttribute('selected', true);}
                        opt1.innerHTML='105%';                            
                        sel2.appendChild(opt1);                            
                        opt1=document.createElement('option');                            
                        opt1.value='110';                            
                        if (opt1.value==s_uplift){opt1.setAttribute('selected', true);}
                        opt1.innerHTML='110%';                            
                        sel2.appendChild(opt1);                            
                        opt1=document.createElement('option');                            
                        opt1.value='0';                            
                        if (opt1.value==s_uplift){opt1.setAttribute('selected', true);}
                        opt1.innerHTML='other';                            
                        sel2.appendChild(opt1);                            
                        cellSec7.appendChild(sel2);                            
                        rowSec2.appendChild(cellSec7);
                                                    
                    cellSec8=document.createElement('TD');                            
                        aTextBox=document.createElement('input');                            
                        aTextBox.type = 'text';                            
                        aTextBox.value = nz(s_incl_uplift);                            
                        aTextBox.size = '3';                            
                        aTextBox.name = '2d_txt_incl_uplift__' + globalClaimLnsRowNum;
                        cellSec8.appendChild(aTextBox);                              
                        rowSec2.appendChild(cellSec8);
                                                    
                    cellSec9=document.createElement('TD');                            
                        aTextBox=document.createElement('input');                            
                        aTextBox.type = 'text';                            
                        aTextBox.value = nz(s_incl_uplift_euro);                            
                        aTextBox.name = '2d_txt_incl_uplift_euro__' +
globalClaimLnsRowNum;
                        aTextBox.size = '5';
                        aTextBox.onchange=function(){calculateTab(globalClaimLnsRowNum);}
                        cellSec9.appendChild(aTextBox);                             
                        rowSec2.appendChild(cellSec9);
                                                    
                    cellSec10=document.createElement('TD');                            
                        ButtonSupprimer=document.createElement('input');                            
                        ButtonSupprimer.type = 'button';                            
                        ButtonSupprimer.value = 'remove';                            
                        ButtonSupprimer.onclick=function(){formation.removeChild(tablebody2)}
                        cellSec10.appendChild(ButtonSupprimer);                            
                        rowSec2.appendChild(cellSec10);
                                                    
                tablebody2.appendChild(rowSec2);                            
        formation.appendChild(tablebody2);                            
        globalClaimLnsRowNum = globalClaimLnsRowNum + 1;                            
}                              

function calculateTab(n_line_no){

var oForm = document.forms[0];

alert('line number = ' + n_line_no);
        
oForm.elements['2d_txt_total_line__' + n_line_no].value =
nz(oForm.elements['2d_txt_unit_price__' + n_line_no].value) *
nz(oForm.elements['2d_txt_quantity__' + n_line_no].value);
}

function nz(s_val){
var s_datatype = "undefined";
if(s_val==null || s_val=='' || isNaN(s_val) ||
typeof(s_val)==s_datatype){
        //return isNaN(num)?0:num;
        return 0;
    }
else{
        //alert(s_val);
        return parseFloat(s_val);
    }
}

function resetForm(){
    var oForm = document.forms[0];
    for (i=0; i<oForm.elements.length; i++){
        oForm.elements[i].value = "";    
    }
}

function setLabel(s_message,s_label_name) {
  document.all(s_label_name).innerText = s_message;
}
//-->
</script>

<html>
<head>
</head>
<body>
<form method="post" action="" id="form1" name="form1">
  <table>
  <tr>
    <td width='4%'>
      <tr>
        <td colspan='6'> </td>
      </tr>
      <tr>
        <td>&nbsp;</td>
        <td><input type="button" name="Button2" value="change label"
onclick=setlabel('here is some different text','label_detail');>
      </td>
        <td><input type="button" name="Button" value="calculate"
onclick=calculateTab('1');></td>
        <td colspan='1' align='right'>&nbsp;</td>
        <td>
          <input name='cmd_detail_new' type='button' id='cmd_detail_new'
value='add row [click here]' onclick=detail_row();>
        </td>
        <td>&nbsp;</td>
        <td colspan='3' align='right'>total </td>
        <td>
          <input name='2d_txt_detail_total' type='text'
id='2d_txt_detail_total' value='' size='10'
onChange=document.forms[0].elements['txt_haschanged'].value ='yes';>
        </td>
        <td width='16%'>=EUR</td>
        <td width='30%'>
          <input name='2d_txt_detail_total_euro' type='text'
id='2d_txt_detail_total_euro' value='' size='10'
onChange=document.forms[0].elements['txt_haschanged'].value
='yes';></td>
        </td>
      </tr>
      <tr>
        <td colspan='6'></td>
      </tr>
    </table>
    </td>
  </tr>
</table>

<table>
<tr>
<td height='20' valign='top'>
  <table width='100%' border='1' cellpadding='0' cellspacing='0'
valign='top'  id='formation'>
      <tr>
        <td width='15%'>&nbsp;<b>GOODS</b></td>
        <td width='5%'>&nbsp;<b>UNIT PRICE</b></td>
        <td width='10%'>&nbsp;<b>CURRENCY</b></td>
        <td width='5%'>&nbsp;<b>QUANTITY</b></td>
        <td width='5%'>&nbsp;<b>TOTAL LINE</b></td>
        <td width='5%'>&nbsp;<b>UPLIFT (%)</b></td>
        <td width='5%'>&nbsp;<b>INCL. UPLIFT</b></td>
        <td width='5%'>&nbsp;<b>=EUR</b></td>
        <td width='5%'>&nbsp;<b>&nbsp;</b></td>
      </tr>
                <tr>
                  <td colspan='10'>
                <label id='label_detail'>NO RECORDS FOUND</label>
                  </td>
                </tr>
              <input type='text' id='2d_txt_detail_ids'
name='2d_txt_detail_ids'  value=''>
              <input type='text' id='txt_update_ids' name='txt_update_ids'
value=''>
            </table>        </td>
      </tr>
    </table>
</form>
</body>
</html>

thanks for any help, kie

p.s. the funtion setLabel that addresses: <label id='label_detail'>
fails for a reason unknown to me, any pointers on this too would be
greatly appreciated.

Replies