我正在尝试将图像作为base64保存到数据库中。但是当我提交表单时,我得到的图像为NULL。我无法理解什么是错的。
<div class="content">
<?php $form = ActiveForm::begin([
'id' => 'products-add-form',
'action' => ['products/product-add-form'],
'method' => 'post',
'options' => [
'class' => 'products-tbl-style',
'enctype' => 'multipart/form-data',
]
]); ?>
<?= $form->field($model, 'productName'); ?>
<?= $form->field($model, 'cost'); ?>
<?= $form->field($model, 'available')->dropDownList(['Y' => 'Yes', 'N' => 'No']); ?>
<?= $form->field($model, 'image')->fileInput(['class'=>'btn btn-primary']); ?>
<?= Html::submitButton('Save', ['class'=>'btn btn-success products-save-btn']); ?>
<?php ActiveForm::end(); ?>
</div>
if($model->load(Yii::$app->request->post())){
$file = UploadedFile::getInstance($model,'image');
var_dump($file->name);
var_dump($file);
var_dump($_FILES);
}
public function rules()
{
return [
[['productName', 'cost', 'available', 'image'], 'required'],
[['cost'], 'number'],
[['available'], 'string', 'max' => 1],
[['image'], 'string'],
[['productName'], 'string', 'max' => 100]
];
}
这里我的JQuery代码,我通过ajax提交表单数据,是否会导致问题?
$("form#products-add-form").on('beforeSubmit', function(e){
var form = $(this);
$.post(
form.attr('action'),
form.serialize()
)
.done(function(result){
if(result == 1){
form.trigger("reset");
$.pjax.reload({container:'#products-table'});
$.notify({
icon: "pe-7s-check",
message: "New product is added"
},{
type: type[2],
timer: 10,
placement: {
from: 'top',
align: 'right'
}
});
}
else {
alert(result);
}
}).fail(function(){
console.log("server error");
});
return false;
});
答案 0 :(得分:1)
要通过AJAX发送文件,请使用FormData
。要构造包含现有FormData
数据的<form>
对象,请在创建FormData对象时指定该表单元素:
$("form#products-add-form").on('beforeSubmit', function(e){
$.post(
form.attr('action'),
new FormData(this) /* this is a form object */
)
/* your other code here */
});
UPD:正如TS所提到的,它应该是processData设置为false。设置$ .post是不可能的,所以我们需要使用$ .ajax
答案 1 :(得分:1)
我试过以下:
$.ajax( {
url: 'http://host.com/action/',
type: 'POST',
data: new FormData( this ),
processData: false,
contentType: false
} );
e.preventDefault();
现在它正在工作,正如@SiZE写的那样,我们需要通过ajax发送带有FormData()的文件输入。
答案 2 :(得分:0)
您可以尝试使用FileInput窗口小部件,它完美无缺。