Yii2 : kartik-v/fileinput 选择时触发上传

Question

我使用 YII2 + /kartik-v/bootstrap-fileinput 插件。当用户将文件放入上传输入时，我需要上传文件。按 ajax 要求制作。当我将“showUpload”选项设置为 false，并使用 ajax 操作设置“uploadUrl”时，在更改文件事件时不会发生对服务器的请求。

<?= $form->field($model, 'logotype')->widget(FileInput::class, [
    'options'       => [ 'accept' => 'image/*' ],
    'pluginOptions' => [
    'showCaption' => false,
    'showRemove'  => false,
    'showUpload'  => false,
    'browseClass' => 'btn btn-primary btn-block',
    'browseIcon'  => '<i class="glyphicon glyphicon-camera"></i> ',
    'uploadUrl'=> '/module/controller/action'
],
]); ?>

我希望在用户 select 图像时在服务器上使用我的文件在数据中创建 ajax POST 表单，而无需另外按下 "upload" 按钮。可以用这个插件实现吗？或者我应该写一个自定义处理程序 onchange 事件？也许插件选项中有某种回调。

Answer 1

您可以使用change event to trigger the upload manually when the file is selected and to trigger the ajax upload you should call the upload方法。

看下面的代码

$('#input-id').on('change', function(event) {
    $(this).fileinput('upload');
});

希望对您有所帮助

Answer 2

对我来说 "filebatchselected" 活动有效。

原本https://plugins.krajee.com/file-input-ajax-demo/6

$("#projectplan-plan_file").on('filebatchselected', function(event) {
    $(this).fileinput('upload');
});

Yii2 : kartik-v/fileinput 选择时触发上传

Yii2 : kartik-v/fileinput trigger upload on selection

jquery

ajax

file-upload

yii2

kartik-v