[英]ajaxForm is sending empty POST when submit from dynamically built form
Submitting a file with ajaxSubmit()
works fine when the form is hard-coded. 当表单是硬编码时,使用ajaxSubmit()
提交文件可以很好地工作。 But the data received by the server is empty when the form is created dynamically. 但是,当动态创建表单时,服务器接收的数据为空。
This version works 此版本有效
HTML HTML
<form id='file_upload_form' method="POST" enctype="multipart/form-data" action="/upload">
<input type="file" id='myfile' name="myfile" />
<br/>
<input type="submit" />
</form>
<div id='status'> </div>
JavaScript JavaScript的
jQuery(document).ready(function() {
jQuery("#file_upload_form").on("submit", function(e) {
e.preventDefault();
jQuery(this).ajaxSubmit({
target: '#status'
});
});
});
Debuggin in .on("submit"...
, jQuery(this).formSerialize()
yields "myfile=%5Bobject+File%5D"
.on("submit"...
, jQuery(this).formSerialize()
产生"myfile=%5Bobject+File%5D"
But this version using a dynamically created form sends empty data 但是此版本使用动态创建的表单发送空数据
HTML HTML
<div id='parent_elem_div'> </div>
<div id='status'> </div>
JavaScript JavaScript的
jQuery(document).ready(function() {
var parent_elem = jQuery('#parent_elem_div');
var new_form_elem = build_form();
parent_elem.append(new_form_elem);
});
jQuery(document).ready(function() {
jQuery("#file_upload_form").on("submit", function(e) {
e.preventDefault();
jQuery(this).ajaxSubmit({
target: '#status'
});
});
});
But here, debuggin in .on("submit"...
, jQuery(this).formSerialize()
yields ""
. 但是在这里,在.on("submit"...
, jQuery(this).formSerialize()
调试产生""
。
This function builds the form... 此功能可建立表格...
//
function build_form (){
var new_inner_div_elem = document.createElement('div');
new_inner_div_elem.id = 'parent_elem_div';
var upload_form = document.createElement('form');
upload_form.id = 'file_upload_form';
upload_form.action = '/upload';
upload_form.method = 'POST';
upload_form.enctype="multipart/form-data";
var file_input = document.createElement('input');
file_input.type = 'file';
file_input.id = 'file_upload_input';
var file_upload_submit = document.createElement('input');
file_upload_submit.type = 'submit';
upload_form.appendChild(file_input);
upload_form.appendChild(file_upload_submit);
new_inner_div_elem.appendChild(upload_form);
return new_inner_div_elem;
}
Aha! 啊哈! Here it go, in your code: 在代码中:
var file_input = document.createElement('input');
file_input.type = 'file';
file_input.id = 'file_upload_input';
This is missing: 这是缺少的:
file_input.attr('name', 'myfile');
This is the only part that your HTML form has, and dynamical doesn't, so I guess that's the trick 这是HTML表单仅有的一部分,而动态表单没有,所以我想这就是窍门
If an HTML doesn't have a name it won't be passed to the querystring or the POST data - there will be no way to retrieve it from PHP This is from here - stackoverflow 如果HTML没有一个名字不会被传递到查询字符串或POST数据-将有没有办法从PHP检索它这是在这里-计算器
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.