I have added file-uploader component in the review form. I have used below code to add browse button in the form.

<div class="upload-wrapper" data-bind="scope: 'uploader'">
    <!-- ko template: getTemplate() --><!-- /ko -->
<script type="text/x-magento-init">
                    "#review-form": {
                        "Magento_Review/js/error-placement": {},
                        "Magento_Review/js/validate-review": {},
                        "Magento_Ui/js/core/app": {
                        "components": {
               "uploader": {
                   "component": "Magento_Ui/js/form/element/file-uploader",
                   "template": "ui/form/element/uploader/uploader",
                   "allowedExtensions": "csv",
                   "uploaderConfig": {
                        "url": "<?php echo $block->getUrl('{router}/{controller}/upload'); ?>"

If i put this code in the form tag then it is now working. If i put this code outside the form tag then it is visible. May be there is an issue related to the data-bind scope.

As in the review form, the form tag like below,

<form action="<?= $block->escapeUrl($block->getAction()) ?>" class="question-form" method="post" id="review-form" data-role="product-review-form" data-bind="scope: 'review-form'" enctype="multipart/form-data">

As you can see, form has data-bind="scope: 'review-form'" and my file-uploader has data-bind="scope: 'uploader'". So it may be an issue.

So, How can i fix this issue? Please help me. You help would be appreciated.


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.