SitePoint Sponsor

User Tag List

Results 1 to 3 of 3

Thread: Correct HTML for a complex form

  1. #1
    ? ro0bear's Avatar
    Join Date
    Oct 2007
    Location
    United Kingdom
    Posts
    622
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)

    Question Correct HTML for a complex form

    Hello I have to write a form for people to submit their CV on. I have to include the schools they went to, what they studied, at each school, and the grades for each subject.

    My first thought was a table, because that's how you would usually display this data when its not a form like so...

    HTML Code:
    <table>
        <tr>
            <td></td>
            <th>School/College/University</th>
            <th>Subjects</th>
            <th>Grades</th>
        </tr>
        <tr>
            <th rowspan="3">School 1</th>
            <td rowspan="3">Hogwarts</td>
            <td>Nice Spells</td>
            <td>A</td>
        </tr>
        <tr>
            <td>Nasty Spells</td>
            <td>B</td>
        </tr>
        <tr>
            <td>Healing Spells</td>
            <td>C</td>
        </tr>
        <tr>
            <th>School 2</th>
            <td>University of Jumping</td>
            <td>Skipping</td>
            <td>2.1 Honours</td>
        </tr>
    </table>
    The problem is, as a form, I am not sure where you would put the input labels?

    Thanks, ro0bear

  2. #2
    It's all Geek to me silver trophybronze trophy
    SitePoint Award Recipient ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, Australia
    Posts
    20,297
    Mentioned
    225 Post(s)
    Tagged
    3 Thread(s)
    You can wrap the form around the table, and put the normal input and label code inside any <tr> or <td> you like.
    Facebook | Google+ | Twitter | Web Design Tips | Free Contact Form

    Try your hand at the new JavaScript Challenge!

    If you don't like getting your feet stuck in a bog, avoid Twitter BootsTrap.

  3. #3
    SitePoint Wizard rguy84's Avatar
    Join Date
    Sep 2005
    Location
    Durham, NC
    Posts
    1,657
    Mentioned
    5 Post(s)
    Tagged
    0 Thread(s)
    This is called a 'complex table' so maybe skim W3C guidelirnes. http://www.w3.org/TR/REC-html40/struct/tables.html
    You will need to use the scope element, I believe. I would wrap the label around the headers. I tried to look up examples of this, but nothing for a form.
    Ryan B | My Blog | Twitter

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •