Adding and removing row from table

Adding and removing row from table

  1. <table border="0" width="100%" cellspacing="10" cellpadding="20">
                                                    <tr>
                                                        <td width="100%" align="left" valign="top">
                                                            <table border="0" width="100%" cellspacing="0" cellpadding="4">
                                                                <tr>
                                                                    <td align="left" valign="top" style="width: 61%">
                                                                        <table border="0" width="100%" cellspacing="0" cellpadding="3">
                                                                            <tr id="row0">
                                                                                <td style="width: 1%">
                                                                                <input name="B3" type="reset" value="Delete"></td>
                                                                                <td style="width: 1%">
                                                                                <h3>Question</h3>
                                                                                </td>
                                                                                <td width="35%">
                                                                                <textarea cols="20" name="S1" rows="5" style="width: 100%; color: #000000; font-family: Arial; font-size: 10pt">Your question here... Your question here... Your question here... Your question here... Your question here... Your question here... Your question here... Your question here... </textarea></td>
                                                                            </tr>
                                                                            <tr>
                                                                                <td style="width: 1%">&nbsp;
                                                                                </td>
                                                                                <td colspan="2">
                                                                                <hr noshade color="#F2F2F2" size="0">
                                                                                </td>
                                                                            </tr>
                                                                            <tr>
                                                                                <td style="width: 1%">&nbsp;
                                                                                </td>
                                                                                <td style="width: 1%">
                                                                                <input name="B2" type="reset" value="Add Question" onClick="JavaScript: add_question();"></td>
                                                                                <td width="35%">
                                                                                <input name="B4" type="reset" value="Add Multiple Choice Question"></td>
                                                                            </tr>






I am trying to add rows by clicking on Add qustion but it isn't working properly




  1. <script>
             var row_count = 1;
           

            function add_question() {
               alert(row_count);
                row = row_count - 1
                $( "#row" + row).append( "&#13;&#10;<tr id='row" + row_count +  "'><td style='width: 1%''><input name='B3' type='reset' value='Delete'></td><td style='width: 1%'><h3>Question</h3></td><td width='35%'><textarea cols='20' name='S1 rows='5' style='width: 100%; color: #000000; font-family: Arial; font-size: 10pt'></textarea></td></tr>");
                alert("<tr id='row" + row_count +  "'><td style='width: 1%''><input name='B3' type='reset' value='Delete'></td><td style='width: 1%'><h3>Question</h3></td><td width='35%'><textarea cols='20' name='S1 rows='5' style='width: 100%; color: #000000; font-family: Arial; font-size: 10pt'></textarea></td></tr>");
                row_count = row_count + 1;   
               
            }
           
        </script>
Is my script


Instead of adding a row underneath the existing row0 it is adding it next to it. Also if you have typed something into any of the new texareas and then add a new row  you lose anything you have typed in. What am I doing wrong? - thanks


    • Topic Participants

    • info