dcsimg
www.webdeveloper.com
Results 1 to 2 of 2

Thread: how to dynamically delete a row

  1. #1
    Join Date
    Jan 2009
    Location
    Pune
    Posts
    6

    how to dynamically delete a row

    Hi,
    i am dyanamically creating rows.In which I have two columns. First column contains text box while second one contains a button. On click of this button I want to delete that row.
    The problem is my code I always deletes the first row.
    below is the code snipet:

    function apendValues()
    {
    listAttrValues=true ;
    var tbl = document.getElementById('tblAttrValues');
    var lastRow = tbl.rows.length;
    // if there's no header row in the table, then iteration = lastRow + 1
    var iteration = lastRow;
    var row = tbl.insertRow(lastRow);
    row.id='row'+iteration;
    var val = document.getElementById('newAttrVal').value;
    // left cell
    var cellLeft = row.insertCell(0);
    var el = document.createElement('input');
    el.type = 'text';
    el.id = 'attrRow' + iteration;
    el.size = 20;
    el.name='attrCol';
    // el.readonly ='readonly';
    el.setAttribute('readonly','readonly');
    el.value=val;

    cellLeft.appendChild(el);

    // right cell
    var cellRight = row.insertCell(1);
    var e2 = document.createElement('input');
    e2.type = 'button';
    e2.name = 'deleteRow';
    e2.value = '-';
    e2.onclick=deleteSelectedRow;

    e2.id = 'txtRow' + iteration;
    cellRight.appendChild(e2);

    //Clear text box
    document.getElementById("newAttrVal").value = "";

    }

    function deleteSelectedRow()
    {
    document.getElementById("tblAttrValues").deleteRow(this);
    var cols=document.getElementsByName('attrCol');
    for(var i = 0; i < cols.length; i++){
    cols[i].id='attrRow' + i;
    }
    }

    Please help.

  2. #2
    Join Date
    Oct 2008
    Posts
    349

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles