I am new to jquery, especially this kind work.. Please help in my work.
I need to insert a row onclick a button, 'add'.
Inside that table I am having another table, which has options(three column) of the parent table.
And I am having another button called 'add options' which onclick I need to add a new row to the options table appropriate to that parent row.
This is the screeshot of the actual.
This is my HTML
<STARTS HERE>
<div id="fourthDynField" class="fieldType" style="font-family: arial; cursor: pointer; background-color: gainsboro; height: 10px; padding: 10px; font-size: 12px;">Field type : Radio button
<img style="float: right; padding-right:10px; cursor: pointer;" src="../img/expand.png" alt="" />
<input type="button" value="Add" name="addCheckBox" id="addCheckBox" onclick="javascript:addNewCheckBox()">
</div>
<div id="table">
<div id="tableDyn4">
<table id="NewCheckBox" border='1'>
<tr align="center" style="background: #f2f2f2;">
<th rowspan="2">Label</th>
<th rowspan="2">Order</th>
<th rowspan="2">Name</th>
<th colspan="4">Options</th>
<td rowspan="2"><input type="button" value="add option" onclick="addNewOption()"></td>
</tr>
<tr align="center">
<td>
<table id="testingTable1" border="1">
<tr align="center" style="background: #f2f2f2;">
<td>ID</td>
<td>Value</td>
<td>Text</td>
<td></td>
</tr>
</table>
</td>
</tr>
<<THE TEXT BOX DETAILS COMING FROM JAVA LAYER, I NEED EMPTY TEXT BOXES IN NEW ROWS>>
</table>
</div>
</div>
<ENDS HERE>
I am confused how to start itself.
Please help me in this issue.
Thanks in advance
Surendar