Clever Geek Handbook

How can I add a row below the currently selected row (based on dropdown input) using jQuery?

I have a table with a bunch of rows. The last column of each row has a drop down list. When the dropdown changes, I need a new table row to appear below the row where the user selected the dropdown. However, I also need a new row for different data depending on what was selected in the dropdown.

Is it possible to use this with jQuery only?

Please note that I am using ASP.NET to do back-end development, so if a solution can be found without using an ID that will be great.

+2


source to share


2 answers 


$("table select").live("click",function(){
 var row=$(this).parent().parent();//add some .parent() untill you get the TR element
 var val=$(this).val(); //<select> value if you want to use it for some conditions
 $("<tr><td>....</td></tr>").insertAfter(row);
})


+4


source


It's easy enough to add HTML using JQuery. However, if you intend to store this data on the server, the ASP.NET process by default (using ViewState) will ignore newlines. Instead, you will need to read the properties of the provided form directly.



To see how to add a row, consider the suggestions here: How to add a new row to a specified table using jQuery?

0


source






More articles:


All Articles