javascript - Programatically sending data to iframe -

i adding in backup jquery function replace formdata support of i.e 9 , below. have come across post: jquery iframe file upload

i can see uploading files need have quite alot of fields in form. there way programatically text fields in form without using formdata.

i have had @ using input fields no textarea fields , include images.

$("form").each(function(){     $(this).filter(':input') //<-- should return input elements in specific form. }); 

or there better way this? don't want touch formdata works fine other browsers have included code

if(document.formdata === "undefined") 

to detect , use function instead. 1 have sugestions?

edit:

just tried following:

$(".inputfield").each(function(index,element){ form.attr("input:text",$(element).val()); }); 

but doesn't update iframe

edit:

this full code using upload form (hopefully)

if(window.formdata === undefined){                     // create iframe                     var iframe = $('<iframe name="postiframe" id="postiframe" style="display: none" />');                      $("body").append(iframe);                      var form = $('.myform');                     form.attr("action", "scripts/addtocart.php");                     form.attr("method", "post");                     form.attr("enctype", "multipart/form-data");                     form.attr("encoding", "multipart/form-data");                     form.attr("target", "postiframe");                     $(".inputfield").each(function(index,element){                         form.attr("input:text",$(element).val());                     });                      form.submit();                      $("#postiframe").load(function () {                         iframecontents = $("#postiframe")[0].contentwindow.document.body.innerhtml;                         $("#textarea").html(iframecontents);                     });                     alert("complete");             } 

edit: added form:

<form class="myform" onsubmit="return false;" enctype="multipart/form-data"> <input type="hidden" name="price" class="inputfield" value="<?php echo $price; ?>" /> <input type="hidden" class="inputfield" id="product" name="product" value="<?php echo $_get['id']; ?>"/> <input type="hidden" class="inputfield" id="sid" name="sid" value="<?php echo $_get['sid']; ?>"/> <input type="hidden" class="inputfield" id="hiddenvalue" name="label" value=""/> <input type="hidden" class="inputfield" id="quantity" name="quantity" value="1"/> <input type="hidden" class="inputfield" id="labelquantity" name="labelquantity" value=""/> <input type="hidden" class="inputfield" id="userlabel" name="userlabel" value=""/> <input type="hidden" class="inputfield" id="colourlabel" name="colourlabel" value=""/> <input type="hidden" class="inputfield" id="foillabel" name="foillabel" value=""/> 

the majority of rest of form generated depending on options chosen abit hard post code

i add class fields want validate, same rule applied want do..

<input type="text" class="req" name="forename" value="forename.." /> <textarea name="comments" class="req">comments..</textarea> 

and jquery

$(".inputfield").each(function(index,element){     form.append(element);     //form.attr("input:text",$(element).val()); }); 

example

html

<form action="scripts/addtocart.php" target="post_requests" enctype="multipart/form-data" type="post"> <input type="hidden" name="price" class="inputfield" value="<?php echo $price; ?>" /> <input type="hidden" class="inputfield" id="product" name="product" value="<?php echo $_get['id']; ?>"/> <input type="hidden" class="inputfield" id="sid" name="sid" value="<?php echo $_get['sid']; ?>"/> <input type="hidden" class="inputfield" id="hiddenvalue" name="label" value=""/> <input type="hidden" class="inputfield" id="quantity" name="quantity" value="1"/> <input type="hidden" class="inputfield" id="labelquantity" name="labelquantity" value=""/> <input type="hidden" class="inputfield" id="userlabel" name="userlabel" value=""/> <input type="hidden" class="inputfield" id="colourlabel" name="colourlabel" value=""/> <input type="hidden" class="inputfield" id="foillabel" name="foillabel" value=""/>     <input type="submit" /> </form> <iframe name="post_requests" style="display:none;"></iframe>  <div id="response">     waiting form posted.. </div> 

javascript

function postresponse(_html) {     document.getelementbyid('response').innerhtml = _html; } 

scripts/addcart.php

<script type="text/javascript"> var _html = 'the form posted..';  parent.postresponse(_html); </script>