Hidden Form File POST In Javascript

Because of a Flex bug uploading files in a secure environment, I'm attempting to hack together a workaround for this in javascript. To do so, I'm attempting to create a hidden form

Solution 1:

For security reasons, you cannot set the value attribute of an input[type=file]. Your current code doesn't need JavaScript, and can be written using pure HTML:

<form method="post" enctype="multipart/form-data" action="myurl">
    <input type="file" value="Click to create select file" name="selectedFile" />
    <input type="hidden" name="xml" value="my xml" />
    <input type="submit" value="Click to create form and submit" />
</form>

If you want to, it's possible to dynamically add additional non-file form elements, by binding an event to the onsubmit handler.

<form ... onsubmit="addMoreinputs();" id="aForm">
...
<script>
function addMoreInputs(){
    var form = document.getElementById("aForm");
    // ...create and append extra elements.
    // once the function has finished, the form will be submitted, because
    //  the input[type=submit] element has been clicked.
}

Solution 2:

add var dom=document.getElementById("formdiv"); dom.appendChild(submitForm);

in your createFormAndSubmit function. and add <div id="formdiv" /> on your page.