Dynamically create table for seating arrangement

[nadiam]

hi guys. i have this one page that is for graphical seating arrangement. u know like for say a wedding u assign who is seating where, what table is used, where is the table placed and stuff like that. right now i just have drop down list of the number of seats like :

<ul  class="navbar">
     <li>
        <a href="#">Rectangle Table</a>
        <ul>
           <li><a href="#" id="6seater">6 Seater</a> </li>
           <li><a href="#" id="8seater">8 Seater</a></li>
           <li><a href="#" id="10seater">10 Seater</a></li>
        </ul>
     </li>
</ul>

and there are images that go with the links. 6 seater round table is just an image. so its all fixed.

now i want to go further and add an option for a person to be able to customiz a table. so i add <li><a href="#" id="customseat">Custom Seat</a></li> and when I clicked maybe a popup appears:

number of seats: <input type="text" id="num-seat">

Then the table will be created dynamically. coz right now I only have up to 10 seater right but say user wants it up to 24 then a rectangular 24 seater table will be shown. how do I that? where should I start? is that possible? TIA!

[mc3330418]

I'm not sure I totally understand the question. But you could create different divs with all of the table and then hide them when the page loads. Ask the user for how many poeple and the use jquery if statement to show the div with the number of people entered.

if (10 seater){
$('#div10seater').show();
}