Results 1 to 6 of 6

Thread: Submitting FORM with dynamically created INPUTs?

  1. #1
    Join Date
    Apr 2008
    Posts
    15
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default Submitting FORM with dynamically created INPUTs?

    Hi.

    I'm trying to submit (to PHP) a FORM with dynamically created INPUTs, but my INPUTs do not propagate.

    What is wrong?
    Code:
     function write() {
    target = document.getElementById('formsml');
    spn = document.createElement('span');
    txt = document.createTextNode(i);
    lk = document.createElement('input');
    lk.setAttribute('type', 'button');
    lk.setAttribute('value', 'ny button');
    lk.setAttribute('name', i); i++;
    spn.appendChild(txt);
    spn.appendChild(lk);
    
    
    target.appendChild(spn);
    
    }
    HTML:
    Code:
    <form id="formsml" name="smli" method="post" action="form4.php?step=1">
       <input type="button" onclick=write() name="klikknapp" value="lkdfj">
       <div id="her"></div>
       <INPUT type="checkbox" name="Debug" CHECKED>
       <input type="submit" name="submit" VALUE="[COMMIT]>
    </form>
    No matter how many INPUTs I add via my function, the only two that comes through to the PHP file are "Debug" and "submit".

    Anyway, what I'm trying to do is to fill up a "box" (DIV) with user input (1-30+ elements) and then submit that to a DB nicely.

  2. #2
    Join Date
    Jan 2008
    Posts
    4,168
    Thanks
    28
    Thanked 628 Times in 624 Posts
    Blog Entries
    1

    Default

    In your HTML, you forgot to put in the last double quote:
    Code:
    <form id="formsml" name="smli" method="post" action="form4.php?step=1">
       <input type="button" onclick=write() name="klikknapp" value="lkdfj">
       <div id="her"></div>
       <INPUT type="checkbox" name="Debug" CHECKED>
       <input type="submit" name="submit" VALUE="[COMMIT]">
    </form>
    Jeremy | jfein.net

  3. #3
    Join Date
    Apr 2008
    Posts
    15
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    Yes, thanks for pointing that out.
    However, it's still not working.

  4. #4
    Join Date
    Dec 2007
    Location
    Ankara, Turkey
    Posts
    160
    Thanks
    2
    Thanked 2 Times in 2 Posts

    Default

    I do not think that buttons' values are submitted. Can you try setting the type to text or hidden?

  5. #5
    Join Date
    Jun 2007
    Posts
    543
    Thanks
    3
    Thanked 78 Times in 78 Posts
    Blog Entries
    1

    Default

    give your submit button an id of "submit".
    Code:
     function write() {
    target = document.getElementById('formsml');
    submit = target.getElementById("submit");
    spn = document.createElement('span');
    txt = document.createTextNode(i);
    lk = document.createElement('input');
    lk.setAttribute('type', 'button');
    lk.setAttribute('value', 'ny button');
    lk.setAttribute('name', i); i++;
    lk.setAttribute('id', "input_"+i-1);
    spn.appendChild(txt);
    //spn.appendChild(lk);
    
    //target.appendChild(spn);
    
    target.insertBefore(lk,submit);
    target.insertBefore(spn,lk);
    }
    Last edited by Master_script_maker; 04-24-2008 at 08:56 PM.
    [Jasme Library (Javascript Motion Effects)] My Site
    /\/\@§†ê® §©®¡þ† /\/\@|{ê®
    There are 10 kinds of people in the world, those that understand binary and those that don't.

  6. #6
    Join Date
    Apr 2008
    Posts
    15
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    Thanks, guys. You are absolutely right. Buttons are not submitted. I only used buttons for testing purposes (it was easy to write), and could not understand why it didn't work.

    Also, I found out that FORM is picky about where you put the INPUTs for submitting.
    A DIV inside a DIV would not work. However, a single no-fuzz DIV is allowed.

    I didn't see this anywhere when reading about FORMs.

    This did not work (target is "a-output"):
    Code:
    <form>
    ...
    <div id="fourth" class="row">
    <div class="input">
       <input type="text" id="a-input">
      </div>
      <div class="output" id="a-output">
      </div>
      <br class="clear">
    </div>
    ...
    </form>
    And this did work:
    Code:
    <form>
    ...
    <div id="content"><div>
    ...
    </form>

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
  •