表单序列化叶子文本输入空

时间:2014-09-19 01:36:06

标签: javascript php jquery ajax forms

我正在使用ajax / php文件上传器。我已经添加了其他表单字段。声明值的隐藏表单字段没有问题,但任何带有用户输入值的文本字段都是空的。我检查了httpfox,所有文本输入值在表单提交时都是空白的。也许是因为ajax文件上传器在文件上传后自动提交表单,以防止浏览器加载后输入的值被传递?在这里不太确定。

这是我的表格:

   <link href="css/uploadfilemulti.css" rel="stylesheet">
   <script src="js/jquery-1.8.0.min.js"></script>
   <script src="js/jquery.fileuploadmulti.min.js"></script> 

<form id="uploadform" action="#" method="POST" enctype="multipart/form-data">
   <fieldset>  
    <legend>Some Info</legend>
    <ol><li>
    <label for="title">NAME:</label>
    <input name="title" type="text" />
    </li><li>
    <label for="ink">SALES REP:</label>
    <input id="ink" name="ink" type="text" value="" /><p class="small">Your sales rep.</p></li><li>
    <label for="paper">TELEPHONE NUMBER:</label>
    <input id="paper" name="paper" type="text" value="" /><p class="small">How can we reach you?</p></li>
    <li><label for="description">DESCRIPTION:</label>
    <textarea id="description" name="description" value="" /></textarea>
    </li><input type="hidden" value="<?php echo $mn; ?>" name="member_name" id="member_name" /><input type="hidden" value="<?php echo $row['ship_city']; ?>" name="ship_city" id="ship_city" />
    <input type="hidden" value="<?php echo $row['ship_state']; ?>" name="ship_state" id="ship_state" />
    <input type="hidden" value="<?php echo $company; ?>" name="ship_company" id="ship_company" />
    <input type="hidden" value="<?php echo $row['member_id']; ?>" name="member_id" id="member_id" /></ol></fieldset></form>

这是ajax处理程序:

<div id="mulitplefileuploader">Upload</div>

<div id="status"></div>
<script>

$(document).ready(function()
{

var theForm = $('#uploadform').serialize();
//$.post('url', formData);
var settings = {
    url: "pruploadonly_do.php",
    method: "POST",
    allowedTypes: "jpg,png,gif,doc,pdf,zip,psd,ai,eps,jpeg,cdr,tif,JPG",
    fileName: "myfile",
    multiple: true,
    formData: theForm,
    onSuccess:function(files,data,xhr)
    {
        $("#status").html("<font color='green'>Upload is success</font>");

    },
    afterUploadAll:function()
    {
        alert("all images uploaded!!");
    },
    onError: function(files,status,errMsg)
    {       
        $("#status").html("<font color='red'>Upload is Failed</font>");
    }
}
$("#mulitplefileuploader").uploadFile(settings);

});
</script>

1 个答案:

答案 0 :(得分:0)

无法使用此插件执行此操作。这个插件可以在加载DOM后立即自行设置。是什么创建了上传按钮。因此,当您添加表单数据时,这不会被添加到通过AJAX发送的配置中。

您需要使用不同的代码,例如您在上面提供的第一个链接:http://www.sanwebe.com/2012/06/ajax-file-upload-with-php-and-jquery