Yii2 : kartik-v/fileinput trigger upload on selection

Question

I use YII2 + /kartik-v/bootstrap-fileinput plugin. I need to upload file when user just drop it into upload input. Make it by ajax request. When I set "showUpload" option to false, and set "uploadUrl" with ajax action, no request to server happens on change file event.

<?= $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'
],
]); ?>

I expect the form to create ajax POST on the server with my file in data when user select image and without press "upload" button additionally. Is it possible to make it using this plugin? Or I should write a custom handler onchange event? Maybe there is some kind of callback in plugin options.

added an answer see if it helps you out – Muhammad Omer Aslam Jun 21 '19 at 23:17 — Muhammad Omer Aslam, Jun 21 '19 at 23:17

score 2 · Accepted Answer · answered Jun 20 '19 at 21:18

You can use the change event to trigger the upload manually when the file is selected and to trigger the ajax upload you should call the upload method.

See the below code

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

Hope it helps

score 1 · Answer 2 · answered Dec 26 '19 at 08:02

1

For me "filebatchselected" event works.

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

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

answered Dec 26 '19 at 08:02

Prahlad

716
8
17

Yii2 : kartik-v/fileinput trigger upload on selection

2 Answers2