Ajax不会将数据传递给我的控制器
我一直在为此工作数小时。我有一个基本表单,可以为我正在构建的商店提交数据和功能图片。Ajax不会将数据传递给我的控制器
我使用ajax将数据从视图发送到控制器,但$_POST
数组在控制器中始终为空。
观点:
<form method="POST" id="newproducts" enctype="multipart/form-data">
<div class="form-group">
<label class="control-label">Product Name</label>
<input type="text" name="product" class="form-control" placeholder="Enter product name">
</div>
<div class="form-group">
<label class="control-label">Prodct Category</label>
<select name="category" class="form-control" id="mycat">
<option value=""></option>
<option value="1">Dummy Category 1</option>
<option value="2">Dummy Category 2</option>
</select>
</div>
<div class="form-group">
<label class="control-label">Available Stock</label>
<input type="number" name="stock" class="form-control" placeholder="Number of Available units">
</div>
<div class="form-group">
<label class="control-label">Product Price</label>
<input type="number" class="form-control" name="price" placeholder="Price without the (R)">
</div>
<div class="form-group">
<label class="control-label">Product Description</label>
<textarea name="description" placeholder="Enter Prodct Description" class="form-control"></textarea>
</div>
<div class="form-group">
<label class="control-label">Feature Image</label>
<input type="file" name="feature" id="feature">
<div class="error"></div>
<div class="clearfix"></div>
<p> </p>
<div id="preview"></div>
</div>
<div class="form-group">
<button type="submit" class="btn btn-success" name="add">Add Product</button>
</div>
<div class="form-group">
<input type="image" src="view/assets/images/ajax-loader.gif" style="display: none;" name="loader">
</div>
product.js
我已经离开了验证只,只显示相关的代码
var formData = new FormData($('#newproducts')[0]);
$.ajax({
type : "POST",
url : "controller/products.php",
// data : {product :product, category:category,stock:stock,price:price,description:description,feature:feature},
data : formData,
cache : false,
contentType: true,
processData:false,
async : false,
traditional: true,
beforeSend : function(){
$('button[type="submit"][name="add"]').html("Please Wait...");
$('input[type="image"][name="loader"]').css('display','block');
},
success : function(results){
$('button[type="submit"][name="add"]').html("Add Product");
$('input[type="image"][name="loader"]').css('display','none');
if(results == "ok"){
$('#results').removeClass('error');
$('#results').addClass('success');
$('#results').html('Product added successfully...');
}else{
$('#results').removeClass('success');
$('#results').addClass('error');
$('#results').html(results);
}
}
});
return false;
}
当我发送像这样的数据:data : {product :product, category:category,stock:stock,price:price,description:description,feature:feature}
,一切工作正常,但唯一的挑战是发送图像数据上传。
我的控制器:
我刚才做了一个简单的var_dump,看看它获取数据
var_dump($_POST)
给出:
array(0) { }
尝试改变你的这一部分阿贾克斯,与这些设置,我得到它的工作。 Using this post and one of my own I did a while back for reference,这是我在FormData
寻找“复习”的地方。
这里是我改变了部分组成:
// Pass event, use this instead of false at the end,
// this is just how I stop the default action, it's optional
e.preventDefault();
// Set the form into the formdata
var formData = new FormData($("#newproducts")[0]);
// Append the file to the formdata
formData.append('file',$('#feature')[0].files[0]);
// Send normally
$.ajax({
// Same
type : "POST",
url : "controller/products.php",
data : formData,
processData: false,
contentType: false,
// I removed "traditional", but I don't know if it still works with it,
// I never tried it. Everything after is the same...
检查的大小限制你的php.ini,并尝试使用比你的(比如20MB)更大的尺寸:
; Maximum allowed size for uploaded files.
upload_max_filesize = 20M
; Must be greater than or equal to upload_max_filesize
post_max_size = 20M
几年前我有同样的问题。当POST,GET和FILES为空时,问题始终是输入的大小,所以如果尝试增加限制,上传应该可以正常工作。 您也可以尝试上传比实际配置更小的文件。
OP没有图像大小的问题,数据没有从视图传递到控制器 –
我不明白'#addnew'随时随地在你的页面。尝试记录'formData',它是否包含你认为它应该? – aynber
什么是$('#addnew')[0]'?当你调试客户端时,是否有任何东西首先被发送到服务器? 'formData'实际包含什么? – David
@aynber我在这里发布了一个错误,在这里发布它的'新产品' – user1