Forums → Offtopic Discussion →

Table Delete Row

 
10 Jan, 2012 12:51 AM
faisalmustaffa 1
What happen to this code...It's doesn't work...







// tabledeleterow.js version 1.2 2006-02-21
// mredkj.com

// CONFIG notes. Below are some comments that point to where this script can be customized.
// Note: Make sure to include a in your table's HTML

var a = 'a'; // this is being set via script
var RADIO_NAME = 'totallyrad'; // this is being set via script
var TABLE_NAME = 'tblSample'; // this should be named in the HTML
var ROW_BASE = 1; // first number (for display)
var hasLoaded = false;

window.onload=fillInRows;

/*
function debug(msg) {
var debug = document.getElementById('txtdebug')
var d = new Date();
var tempTimestamp =
(d.getHours() < 10 ? '0' + d.getHours() : d.getHours())
+ ':' +
(d.getMinutes() < 10 ? '0' + d.getMinutes() : d.getMinutes())
+ ':' +
(d.getSeconds() < 10 ? '0' + d.getSeconds() : d.getSeconds())
debug.value = tempTimestamp + ':' + msg + '\n' + debug.value ;
}
*/

function fillInRows() {
hasLoaded = true;
addRowToTable();
addRowToTable();
}

// CONFIG:
// myRowObject is an object for storing information about the table rows
function myRowObject(one, two, three, four, five, six, seven, eight) {
this.one = one; // text object
this.two = two; // input text object
this.three = three;
this.four = four;
this.five = five; //just added - faisal
this.six = six;
this.seven = seven; // input checkbox object
this.eight = eight; // input radio object
}

/*
* insertRowToTable
* Insert and reorder
*/
function insertRowToTable()
{
if (hasLoaded) {
var tbl = document.getElementById(TABLE_NAME);
var rowToInsertAt = tbl.tBodies[0].rows.length;
for (var i=0; i0&&!isNaN(parseInt(cellval))) total+=parseInt(cellval);
if (cellval.length>0&&!isNaN(parseFloat(cellval))) total+=parseFloat(cellval); //change to float number
}
//frm.SUM.value=total;
frm.SUM.value = parseFloat(total).toFixed(2); //set to 2 decimal points
}

/*
* addRowToTable
* Inserts at row 'num', or appends to the end if no arguments are passed in. Don't pass in empty strings.
*/
function addRowToTable(num)
{
if (hasLoaded) {
var tbl = document.getElementById(TABLE_NAME);
var nextRow = tbl.tBodies[0].rows.length;
var iteration = nextRow + ROW_BASE;
if (num == null) {
num = nextRow;
} else {
iteration = num + ROW_BASE;
}

// add the row
var row = tbl.tBodies[0].insertRow(num);

// CONFIG: requires classes named classy0 and classy1
row.className = 'classy' + (iteration % 2);

// CONFIG: This whole section can be configured

// cell 0 - text
var cell0 = row.insertCell(0);
var textNode = document.createTextNode(iteration);
cell0.appendChild(textNode);

// cell 1 - input text
var cell1 = row.insertCell(1);
var txtInp1 = document.createElement('input');
txtInp1.setAttribute('type', 'text');
//txtInp1.setAttribute('name', 'a' + iteration + '_1'); //commented by faisal - 09012012
txtInp1.setAttribute('name', 'claim'); //modified by faisal - 09012012
txtInp1.setAttribute('size', '40');
//txtInp1.setAttribute('value', iteration); // iteration included for debug purposes //commented by faisal - 09012012
txtInp1.value = '';
cell1.appendChild(txtInp1);

var cell1a = row.insertCell(2);
var txtInp2 = document.createElement('input');
txtInp2.type = 'text';
txtInp2.value = '';
txtInp2.setAttribute('name', 'a' + iteration + '_2');
txtInp2.size = 10;
txtInp2.setAttribute("onChange", "Calc()");
txtInp2.setAttribute("onBlur", "Calc()");
txtInp2.setAttribute("onFocus", "Calc()");
txtInp2.setAttribute("onClick", "Calc()");
txtInp2.setAttribute("onKeydown", "Calc()");
txtInp2.setAttribute("onKeyup", "Calc()");
cell1a.appendChild(txtInp2);

// new arrangement by faisal - 09012012

//cell 3 - input text
var cell1b = row.insertCell(3);
var txtInp3 = document.createElement('input');
txtInp3.type = 'text';
txtInp3.value = '';
txtInp3.setAttribute('name', 'item');
txtInp3.size = 4;
cell1b.appendChild(txtInp3);

//cell 4 - input text
var cell1c = row.insertCell(4);
var txtInp4 = document.createElement('input');
txtInp4.type = 'text';
txtInp4.value = '';
txtInp4.setAttribute('name', 'petrol_mileage');
txtInp4.size = 11;
cell1c.appendChild(txtInp4);

// cell 1d - input text
var cell1d = row.insertCell(5);
var txtInp5 = document.createElement('input');
txtInp5.type = 'text';
txtInp5.name = INPUT_NAME_PREFIX + iteration;
// Don't refer to ids
//txtInp.id = INPUT_NAME_PREFIX + iteration;
txtInp5.size = 40;
txtInp5.value = '';
cell1d.appendChild(txtInp5);

// cell 2 - input button
var cell2 = row.insertCell(6);
var btnEl = document.createElement('input');
btnEl.setAttribute('type', 'button');
btnEl.setAttribute('value', 'Delete');
btnEl.onclick = function () {deleteCurrentRow(this)};
cell2.appendChild(btnEl);

// cell 4 - input checkbox
var cell3 = row.insertCell(7);
var cbEl = document.createElement('input');
cbEl.setAttribute('type', 'checkbox');
cell3.appendChild(cbEl);

// cell 5 - input radio
var cell4 = row.insertCell(8);
var raEl;
try {
raEl = document.createElement('');
var failIfNotIE = raEl.name.length;
} catch(ex) {
raEl = document.createElement('input');
raEl.setAttribute('type', 'radio');
raEl.setAttribute('name', RADIO_NAME);
raEl.setAttribute('value', iteration);
}
cell4.appendChild(raEl);

// Pass in the elements you want to reference later
// Store the myRow object in each row
row.myRow = new myRowObject(textNode, txtInp1, txtInp2, txtInp3, txtInp4, txtInp5, cbEl, raEl);
}
}

// CONFIG: this entire function is affected by myRowObject settings
// If there isn't a checkbox in your row, then this function can't be used.
function deleteChecked()
{
if (hasLoaded) {
var checkedObjArray = new Array();
var cCount = 0;

var tbl = document.getElementById(TABLE_NAME);
for (var i=0; i 0) {
var rIndex = checkedObjArray[0].sectionRowIndex;
deleteRows(checkedObjArray);
reorderRows(tbl, rIndex);
}
}
}

// If there isn't an element with an onclick event in your row, then this function can't be used.
function deleteCurrentRow(obj)
{
if (hasLoaded) {
var delRow = obj.parentNode.parentNode;
var tbl = delRow.parentNode.parentNode;
var rIndex = delRow.sectionRowIndex;
var rowArray = new Array(delRow);
deleteRows(rowArray);
reorderRows(tbl, rIndex);
}
}

function editCurrentRow(obj)
{
if (hasLoaded) {
var editRow = obj.parentNode.parentNode;
var tbl = editRow.parentNode.parentNode;
var rIndex = editRow.sectionRowIndex;
var rowArray = new Array(editRow);
callPrompt(rowArray);
}
}

function reorderRows(tbl, startingIndex)
{
if (hasLoaded) {
if (tbl.tBodies[0].rows[startingIndex]) {
var count = startingIndex + ROW_BASE;
for (var i=startingIndex; i













Claim Form


#ClaimAmountItemPetrol MileageDeleteDI





Total














Thanks & regards,

Faisal Mustaffa
 
14 Jan, 2012 03:51 AM
splendAd Admin keith 526 		In reply to: faisalmustaffa
For anyone else reading this, the original code is located at http://www.mredkj.com/tutorials/tabledeleterow.js

Our forums don't display html/javascript too well, so looks like what you pasted got garbled.

Unfortunately we're not providing much support to mredkj.com scripts, but I will say that when I went to the test page - http://www.mredkj.com/tutorials/tabledeleterow.html - in Firefox 9.0.1 it was working fine. Also tried it in Chrome 16.0 and IE 8.

If you want to delete a row using the example, you need to check off a box in the D column then click Delete [D].
Terms & Conditions | Privacy Policy |
Feedback
|
Submit Info