我试图在使用ajax调用表单提交后上传图像,有一个令我烦恼的问题,新的FormData($(this)[0])给了我实际的值,但每当我尝试通过ajax发送它的故障并重新加载页面,所以我也看不到控制台,请纠正我错在哪里。
我的javascript代码
$("#editImage").submit(function(){ var data = new FormData($(this)[0]); console.log(data); return false; $.post("../galImages", data).done(function(response){ console.log(response); }); return false;});我的HTML代码
<form name="edit-image" id="editImage" action="" method="post" enctype="multipart/form-data"><input type="file" name="change-image" accept="image/*" class="form-control mb-20" value="Upload Image"> <input type="hidden" name="edit-img-id" id="editImageId"><input type="submit" class="btn btn-primary" value="Save Changes" id="submitEditImgForm"></form>但是文件数据是在PHP页面中发布的,还有一件事我如何发送隐藏字段值以及formdata对象。 我是ajax $.post方法的noobie。 如果有人有任何想法,请帮助我。
I am trying to upload image after form submit using ajax call, having an issue that annoying me, the new FormData($(this)[0]) gives me actual values, but whenever I try to send it through ajax its malfunctioning and reloads the page, so I cant see the console as well, please correct me where I am wrong.
My javascript code
$("#editImage").submit(function(){ var data = new FormData($(this)[0]); console.log(data); return false; $.post("../galImages", data).done(function(response){ console.log(response); }); return false;});My HTML code
<form name="edit-image" id="editImage" action="" method="post" enctype="multipart/form-data"><input type="file" name="change-image" accept="image/*" class="form-control mb-20" value="Upload Image"> <input type="hidden" name="edit-img-id" id="editImageId"><input type="submit" class="btn btn-primary" value="Save Changes" id="submitEditImgForm"></form>however file datas are posted in the PHP page, and one more thing how can I send hidden field value along with formdata object. I am a noobie in ajax $.post method. Please help me if anyone have any idea.
最满意答案
当您上传图片时(我的错误,先忘了!):重要的部分是needed for upload否则会失败
$(function () { $('#my_form').on('submit', function (e) { e.preventDefault(); var $form = $(this); var formdata = (window.FormData) ? new FormData($form[0]) : null; var data = (formdata !== null) ? formdata : $form.serialize(); $.ajax({ url: $form.attr('action'), type: $form.attr('method'), contentType: false, // needed for upload processData: false, // needed for upload dataType: 'json', // return data: data, success: function (response) { // response } }); }); });这段代码不是我的,发现它,很久以前就改编了,不能归功于它的原主人,因为我不记得她/他是谁:/
As you upload an image (my mistake, forgot that first!) : Important parts are the ones needed for upload otherwise it will fail
$(function () { $('#my_form').on('submit', function (e) { e.preventDefault(); var $form = $(this); var formdata = (window.FormData) ? new FormData($form[0]) : null; var data = (formdata !== null) ? formdata : $form.serialize(); $.ajax({ url: $form.attr('action'), type: $form.attr('method'), contentType: false, // needed for upload processData: false, // needed for upload dataType: 'json', // return data: data, success: function (response) { // response } }); }); });This code is not mine, found it, adapted it long time ago, can't credit its original owner as I don't remember who she/he is :/
更多推荐
发布评论