Dynamically adding and editing rows in a table with HTML & JAVASCRIPT

[nedu]

Hi All,

Please find the below scenario.

In a html page there are three things, two text boxes and one drop down list and one ADD button. My requirement is when the user enters the value in the text boxes and select some option in the drop down list and if he clicks add means a new html table must be displayed in the same page. If he clicks the entered table row meant that the row need to be edited. The table value must be focused in the relevant text boxes and in the drop down list.

Could any one please help me for this scenario . . . .


Regards,
Nedu. M

[dmjpro]

Hi All,

Please find the below scenario.

In a html page there are three things, two text boxes and one drop down list and one ADD button. My requirement is when the user enters the value in the text boxes and select some option in the drop down list and if he clicks add means a new html table must be displayed in the same page. If he clicks the entered table row meant that the row need to be edited. The table value must be focused in the relevant text boxes and in the drop down list.

Could any one please help me for this scenario . . . .


Regards,
Nedu. M

You can find out the solution here :-)

var tab = document.createElement("table");
var tbody = document.createElement("tobdy");
var row = document.createElement("tr");
var cell = document.createElement("td");
var element = document.createElement("<input>");
tab.appendChild(tbody);
tbody.appendChild(row);
row.appendChild(cell);
cell.setAttribute("atr_name","attr_value");
 

Good Luck!

Kind regards,
Dmjpro.