CODEWITHSUNDEEP
javascriptjquery
jeni
jeni

Reputation: 983

adding rows dynamically using onclick function in javascript

Am having a task in some onclick functions.I had a table in which each column contains a dropdown list or text box. one of the column contains a button.If i click that button the row with dropdownlist,textboxes including add button have to dynamically add as the next row.how can i do this?which will be better javascript or jquery..plz help me out..

Upvotes: 1

Views: 571

Answers (2)

Peyton Crow
Peyton Crow

Reputation: 882

You can try this:

$('button-id').click(function() {
     $('container-id').after('<input /><select />');
});

Something like that, will have you added a new line with input and select boxes to the end of the container or your table.

Upvotes: 0

Archan Mishra
Archan Mishra

Reputation: 905

You can try the following

in onclick of the row add the following function

function cloneRow(event){
    var tar_ele;
    if ($.browser.msie) {
    // IE takes SRCELEMENT for event source.
    // may the force shred IE.
        tar_ele = $(event.srcElement);
    } else {
        tar_ele = $(event.target);
    }
   // Now take the parent of the clicked item as the item is a button in a row 
    var row = tar_ele.parent();
   // Now clone the row and add it to the parent.
    row.clone().appendTo(row.parent());
}

Hope this helps.

Upvotes: 2

Related Questions