CODEWITHSUNDEEP
phpjqueryhtmlcssforms
nielsv
nielsv

Reputation: 6810

Form elements outside of form

This is what I need:

<form>
   input field
   <form>
       input field
       submit
   </form>
   input field
   input field
   <form>
       input field
       submit
   </form>
   submit
</form>

I need the forms in the forms because I work with transloadit to upload files to my amazon bucket.They work like this:

<form id="MyForm" action="http://example.org/upload" enctype="multipart/form-data" method="POST">
  <input type="file" name="my_file" />
  <input type="submit" value="Upload">
</form>

So I need an overall form with form elements to submit and the other forms submit differently. But I can't place forms in forms .. How can I do this?

Upvotes: 0

Views: 375

Answers (2)

mand
mand

Reputation: 432

You can use the form attribute to specify which form an input belongs to. For example:

  <form id="form2" action="/download.html"  method="POST"></form>
  <form id="form1" action="/upload.html" method="POST">

    <input type="file" name="my_file" form="form1" />
    <input type="submit" value="Upload" form="form1">


    <input type="text" name="my_file" form="form2" />
    <input type="submit" value="Download" form="form2">

  </form>

This should work for your problem but the form attribute is not supported on all browsers and you cant actually nest form elements inside each other. Browsers like Chrome will remove the child form elements, that is why the second form element is outside the first one but you can put all the fields in one form element.

Read more about the form attribute here: http://www.impressivewebs.com/html5-form-attribute/

Not to pass judgment but, although I found this interesting, this is a very odd thing to do.

Upvotes: 0

Ben D
Ben D

Reputation: 14479

You cannot have forms within forms.

If you need to trigger "formlet" submissions (like your transloadit example) I recommend you do so using Javascript, though I'm guessing that Transloadit has a mechanism for doing whatever it is that you're attempting (if you clarify this in your question I might be able to suggest a specific approach).

Upvotes: 2

Related Questions