SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    Resident Boozehound simontheak's Avatar
    Join Date
    Jun 2003
    Location
    _root.europe.uk.london
    Posts
    965
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Adding new fields to a form on the fly

    Hiya - thanks for taking the time to read this.

    I'm working on what is currently a simple form, which will include a list of the users friends. However, seeing as everyone's going to have a different number of friends to submit, I'd really like to just have 1 "Friend" field and a button to "Add another friend" next to it.

    The idea is that when someone clicks on the "Add Friend" button, another text field will appear (with another Add button), allowing the user to input more contact details.

    I think I'm right in saying that I'd need JavaScript to do this, but other than that I really don't have any idea.

    Would somebody be able to let me or know? Or post up a link to a relvant tutorial?

    Thanks very much,

  2. #2
    .* draziW tnioPetiS *. bronze trophy
    Join Date
    Jun 2004
    Location
    "Then I figure the most good good guy will win."
    Posts
    1,666
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi,

    Maybe something like this?

    I am sure that script could be updated to be less obtrusive, but it should be a good starting point for your needs.

    Good luck!
    Cheers,
    M

  3. #3
    SitePoint Addict
    Join Date
    May 2005
    Location
    London, ON
    Posts
    360
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That example does describe it in a more complicated way. The idea here is that you're using the Document Object Model (DOM) to add more fields.

    It may take a bit of reading on your part to get familiar with is. Here is a good spot to start: http://www.w3schools.com/htmldom/dom_reference.asp

    Also, an article from here at Sitepoint: http://www.sitepoint.com/article/dht...ern-web-design
    Ryan Price
    Subscribe to my blog for regular tips and tricks

  4. #4
    SitePoint Guru
    Join Date
    Apr 2007
    Posts
    813
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    maybe something like

    Code:
    input = document.createElement('INPUT');
    input.type = 'text';
    input.name = 'form-name';
    $('formid').appendChild(input)


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
  •