Question

I have a sitution where the user can select which test they want to enter info for.
Example:

Test1
Test2
Test3
Test4

When the select say Test1,Test3, I need to create a form with just these two textbox fields(Test1, Test2). I was thinking about looping through the options the user selected and then doing a show, hide through jquery but not sure if this is the best way of going about this. Is there a elegant way of just showing the fields that the user chose?

Answer 1

Something like this might be simple:

<ul id="textboxes">
    <li>
        <input type="checkbox" id="c1" name="c1" />                
        <input type="text" id="t1" name="t1" />
    </li>
    <li>
        <input type="checkbox" id="c2" name="c2" /> 
        <input type="text" id="t2" name="t2" style="display:none" />
    </li>
<ul>

Then your jQuery:

$('input[type="checkbox"]').click(function() {
    var id = $(this).attr('id').replace('c','');
    $('#t'+id).slideToggle(); 
});

Obviously you could have more boxes there. If you were going to go a more dynamic route, with an unlimited, I would go more of a true adding of the fields.

jsFiddle