Create a Form element using javascript and submit it without redirecting/refreshing

Question

I am using a Form in a LightBox which contains some input element.

<form name="imageUploadForm" action="uploadImage.do" method="post" enctype="multipart/form-data">
<input type="text"  id="id" name="id" style="display: none;" value="">
<div id="fileUploaderDiv">
     <input type='file' name="file0" id ="file0"  />
</div>
<button onclick="javascript:ImageUploader.attachImage();">Upload</button>
</form>

can anybody tell me how to copy this form in new one and submit it without redirecting user or knowing him about form submission using javascript or jquery?

How do you mean 'copy this form'? To submit without redirect/refresh use AJAX. — Rory McCrossan, Aug 04 '12 at 20:03
Do you want the form to be submitted automatically or only when a button is clicked? — amiregelz, Aug 04 '12 at 20:05
@RoryMcCrossan Copy this for means create a new form element and add all filled input element in that form and that new one form will submitted . — Ashish Panery, Aug 04 '12 at 20:12
Are you looking for something [like this](http://www.simonerodriguez.com/ajax-form-submit-example/)? — amiregelz, Aug 04 '12 at 20:14
Why do you want to copy the form and then submit that - why not just submit the existing form? — Rory McCrossan, Aug 04 '12 at 20:17

score 0 · Answer 1 · answered Aug 04 '12 at 20:04

0

In order to send data to a server (through submitting a form or otherwise) one can use AJAX. The user does not need to be informed (but I'd recommend letting the user know somehow).

answered Aug 04 '12 at 20:04

SomeKittens

38,868
19
114
143

score 0 · Accepted Answer · answered Aug 04 '12 at 20:09

0

http://api.jquery.com/serialize/

$('#yourbutton_notintheexample_you_provided').click(function(){ 
    var myForm = $('form[name=imageUploadForm]')
    var data = myForm.serialize();
    $.ajax({
       url: myForm.attr('action'),
       type: myForm.attr('method'),
       data: data, 
       success: function(){
           window.alert("write your form handling code here")
        }
    });
});

or something along the lines.

In prototype, there was a single convenience method, called Form.request, read about it here.

answered Aug 04 '12 at 20:09

Aadaam

3,579
1
14
9

I have tried it but it does not work with contentType: 'multipart/form-data',. I need to send multipart . at server side i am getting error in my java code http://stackoverflow.com/questions/11811232/the-request-was-rejected-because-no-multipart-boundary-was-found#comment15697710_11811232 – Ashish Panery Aug 04 '12 at 20:19

Create a Form element using javascript and submit it without redirecting/refreshing

2 Answers2