Question

I have a Jsfiddle application here. If you type in a question in the textarea, and then click on the “Add Question” button, it appends the question and a question number in the table below (you can teest this a couple of times if you wish).

Now below the table is a file input which is stored in another form. My question is that how can I put the form code which contains the file input in the table so that everytime a question is added, it appends the question number and question but it also appends the file input for each row?

Answer 1

You can do it the same way you have been doing it. Just remember to change these lines accordingly to whatever you expect at server side such as file input’s name.

var $image = $("<td class='image'></td>"); 
var $fileImage = '<p id="f1_upload_form"><br/><label>File: <input name="fileImage" type="file" id="fileImage" /></label></p>';
$image.append($fileImage);
$tr.append($image);

Now you just need to move the upload button to the bottom of the table still inside the form wrapping the table.

Here is a working jsfiddle.