table is creating new rows when submitting a question

[carlbrooks]

I have a table which has the number of rows depended on what the number is in the spinner. This does work e.g If I enter 25 in spinner it comes up with 25 rows, if I enter 7 in spinner comes with 7 rows.

So my problem is this:

What I have is a textarea where the user enters in their question and then submits the question, the question should be inserted and appear under the "Question" column.

The problem is that everytime I submit a question into the table, it creates a new row. So if I had 20 empty rows in the table because I stated in the spinner I wanted 20 questions, then what happens is everytime I submit a question, it adds a new row every time, I want the question to be inserted in a current row starting from 1st row add going down 1 row every time a question is submitted.

I have attached a document with this question which will show you how I want it to be displayed and what is displays currently and would hopefully explain it better for you if you are a bit confused.

Below is my javascript code:

function insertQuestion() {   
var table = document.getElementById("qandatbl");
var tableBody = table.tBodies[0];
var textarea = document.getElementById("questionTxt");

var row = document.createElement("tr");
tableBody.appendChild(row);

var enumeratorCell = document.createElement("td");
enumeratorCell.className = "qid";
row.appendChild(enumeratorCell);

var questionCell = document.createElement("td");
questionCell.className = "question";
row.appendChild(questionCell);

var weightCell = document.createElement("td");
weightCell.className = "weight";
row.appendChild(weightCell);

var answerCell = document.createElement("td");
answerCell.className = "answer";
row.appendChild(answerCell);

var questionText = textarea.value;
var questionContent = document.createTextNode(questionText);
questionCell.appendChild(questionContent);

            }

Html code of table and text area with submit button:

// table where questions will be inserted into

     <table>

    <?php
    $spinnerCount = $_POST['textQuestion'];
if($spinnerCount > 0) {
   for($i = 1; $i <= $spinnerCount; $i++) {?> // this get the number of questions from the spinner

        <tr>
            <td class="qid"><?php echo $i; ?></td>
            <td class="question"></td>
            <td class="weight"></td>
            <td class="answer"></td>
        </tr>

    </table>

//Text Area and submit button to submit questions

<form id="enter" action="<?php echo htmlentities($_SERVER['PHP_SELF']); ?>" method="post">
<table id='middleDetails' border='1'>
<tr>
<th class='tblheading' colspan='2'>SESSION DETAILS</th>
</tr>
<tr>
<td id="questionNum">Question No </td>
</tr>
<tr>
<td id="questionContent">Question:</td> 
<td id="questionTextarea"><textarea rows="5" cols="40" id="questionTxt" name="questionText"></textarea></td>
</tr>
<tr>
<td id="addQuestionRow" colspan='2'><input id="addQuestion" type="button" value="Add Question" name="addQuestionBtn" onClick="insertQuestion()" /></td>
</tr>
</table>
</form>

[urtrivedi]

is it php or jsp?

[peter_budo]

Moved to PHP section as this has nothing to do with JSP - Java Server Pages