website form

[Schoolies]

I need to make a form that will allow a user to enter a group of people's names in. BUT I need it to auto adjust to the number of people that a user will enter. For example. I have a form that has 3 blanks, but I have 10 people coming. I want the user to be able to enter 10, and 7 more blanks will appear.

There is an example of this done on this page:
Link

Thanks

 

[jonmullen]

It just some simple JavaScript. Just write a function that takes and arg for how many dancers and puts that into a for statement. Than each time through it just adds the HTML for each dancer entered into a variable than at the end you adjust the innerHTML of the div where you want it to go.

 

[Schoolies]

Thanks jon

 

[bunker]

Formatting's gonna look screwy here but here is the code from the page you linked (view source is your friend 🙂)

function adjustDancerCount(n)
{
var item_disp = "";

for(var i=1; i<=n; i++)
{
item_disp += '<table width="100%"><tr><td style="border: 0px solid white;" width="35%">';
item_disp += (i) + '.
<input type="text" size="32" name="Name ' + i + '">';
item_disp += '</td><td style="border: 0px solid white;" width="50%">';
item_disp += 'Age:
<input type="text" name="Age ' + i + '" size="15">';
item_disp += '</td></tr></table>';
}
document.getElementById( 'dancers' ).innerHTML = item_disp;

if(1 == n)
{
if(document.getElementById('Nationals').checked)
{
document.getElementById('Fee').innerHTML = "$75.00";
}
else
{
document.getElementById('Fee').innerHTML = "$65.00";
}
}
else if(2 <= n && 3 >= n)
{
if(document.getElementById('Nationals').checked)
{
document.getElementById('Fee').innerHTML = "$85.00";
}
else
{
document.getElementById('Fee').innerHTML = "$75.00";
}
}
else
{
if(document.getElementById('Nationals').checked)
{
document.getElementById('Fee').innerHTML = "$" + (27*n) + ".00";
}
else
{
document.getElementById('Fee').innerHTML = "$" + (23*n) + ".00";
}
}
}