Reviews in magento 2
https://magento.stackexchange.com/questions/205759
-
21-12-2020 - |
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
RussianQuestion
I have modified the review form in my custom module and makes the review form to show as a popup modal.And I don't need review tab. So I have removed the review tab, after removing review tab it shows following js error.
Error
Uncaught SyntaxError: Unexpected token u in JSON at position 0 at JSON.parse () at run (layout.js:164) at app.js:14 at main.js:31 at Object.execCb (require.js:1650) at Module.check (require.js:866) at Module. (require.js:1113) at require.js:132 at require.js:1156 at each (require.js:57)
If I remove the below part in my custom form.phtml, the error is solved.
(In review module, Magento\Review\View\frontend\templates\form.phtml, Inside form.phtml)
"[data-role=product-review-form]": {
"Magento_Ui/js/core/app": <?= /* @noEscape */ $block->getJsLayout() ?>
},
Please explain me, I don't want to remove above code and also to solve my error.
catalog_product_view.xml
<page layout="1column" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
<referenceBlock name="product.info.review">
<action method="setTemplate">
<argument name="template" xsi:type="string">XXX_YYY::review.phtml</argument>
</action>
<block class="Magento\Framework\View\Element\Template" name="custom.review.popup" template="XXX_YYY::popup.phtml">
<block class="Magento\Review\Block\Form" name="custom.product.review.form" as="custom.review_form" template="XXX_YYY::form.phtml">
<container name="product.review.form.fields.before" as="form_fields_before" label="Review Form Fields Before"/>
</block>
</block>
</referenceBlock>
<referenceBlock name="product.info.details">
<referenceBlock name="reviews.tab" remove="true" />
</referenceBlock>
<referenceContainer name="product.info.additional">
<block class="Magento\Review\Block\Product\View\ListView" name="custom.product.section.info" template="XXX_YYY::abc.phtml"/>
</referenceContainer>
</body>
</page>
Custom form.phtml
<?php
/** @var \Magento\Review\Block\Form $block */
?>
<div class="block review-add">
<div class="block-title"><strong><?= $block->escapeHtml(__('Write Your Own Review')) ?></strong></div>
<div class="block-content">
<?php if ($block->getAllowWriteReviewFlag()): ?>
<form action="<?= $block->escapeUrl($block->getAction()) ?>" class="review-form" method="post" id="review-form" data-role="product-review-form" data-bind="scope: 'review-form'">
<?= $block->getBlockHtml('formkey') ?>
<?= $block->getChildHtml('form_fields_before') ?>
<fieldset class="fieldset review-fieldset" data-hasrequired="<?= $block->escapeHtmlAttr(__('* Required Fields')) ?>">
<legend class="legend review-legend"><span><?= $block->escapeHtml(__("You're reviewing:")) ?></span><strong><?= $block->escapeHtml($block->getProductInfo()->getName()) ?></strong></legend><br />
<?php if ($block->getRatings() && $block->getRatings()->getSize()): ?>
<span id="input-message-box"></span>
<fieldset class="field required review-field-ratings">
<legend class="label"><span><?= $block->escapeHtml(__('Your Rating')) ?></span></legend><br/>
<div class="control">
<div class="nested" id="product-review-table">
<?php foreach ($block->getRatings() as $_rating): ?>
<div class="field choice review-field-rating">
<label class="label" id="<?= $block->escapeHtml($_rating->getRatingCode()) ?>_rating_label"><span><?= $block->escapeHtml($_rating->getRatingCode()) ?></span></label>
<div class="control review-control-vote">
<?php $options = $_rating->getOptions(); ?>
<?php
$iterator = 1;
foreach ($options as $_option):
?>
<input
type="radio"
name="ratings[<?= $block->escapeHtmlAttr($_rating->getId()) ?>]"
id="<?= $block->escapeHtmlAttr($_rating->getRatingCode()) ?>_<?= $block->escapeHtmlAttr($_option->getValue()) ?>"
value="<?= $block->escapeHtmlAttr($_option->getId()) ?>"
class="radio"
data-validate="{required:true, messages:{required:'Please select one of each of the ratings above.'}}"
aria-labelledby="<?= $block->escapeHtmlAttr($_rating->getRatingCode()) ?>_rating_label <?= $block->escapeHtmlAttr($_rating->getRatingCode()) ?>_<?= $block->escapeHtmlAttr($_option->getValue()) ?>_label" />
<label
class="rating-<?= $block->escapeHtmlAttr($iterator) ?>"
for="<?= $block->escapeHtmlAttr($_rating->getRatingCode()) ?>_<?= $block->escapeHtmlAttr($_option->getValue()) ?>"
title="<?= $block->escapeHtmlAttr(__('%1 %2', $iterator, $iterator > 1 ? 'stars' : 'star')) ?>"
id="<?= $block->escapeHtmlAttr($_rating->getRatingCode()) ?>_<?= $block->escapeHtmlAttr($_option->getValue()) ?>_label">
<span><?= $block->escapeHtml(__('%1 %2', $iterator, $iterator > 1 ? 'stars' : 'star')) ?></span>
</label>
<?php $iterator++; ?>
<?php endforeach; ?>
</div>
</div>
<?php endforeach; ?>
</div>
<input type="hidden" name="validate_rating" class="validate-rating" value="" />
</div>
</fieldset>
<?php endif ?>
<div class="field review-field-nickname required">
<label for="nickname_field" class="label"><span><?= $block->escapeHtml(__('Nickname')) ?></span></label>
<div class="control">
<input type="text" name="nickname" id="nickname_field" class="input-text" data-validate="{required:true}" data-bind="value: nickname()" />
</div>
</div>
<div class="field review-field-text required">
<label for="review_field" class="label"><span><?= $block->escapeHtml(__('Review')) ?></span></label>
<div class="control">
<textarea name="detail" id="review_field" cols="5" rows="3" data-validate="{required:true}" data-bind="value: review().detail"></textarea>
</div>
</div>
</fieldset>
<div class="actions-toolbar review-form-actions">
<div class="primary actions-primary">
<button type="submit" class="action submit primary"><span><?= $block->escapeHtml(__('Submit Review')) ?></span></button>
</div>
</div>
</form>
<!--@TODO - need to check JS-->
<script type="text/x-magento-init">
{
"[data-role=product-review-form]": {
"Magento_Ui/js/core/app": <?= /* @noEscape */ $block->getJsLayout() ?>
},
"#review-form": {
"Magento_Review/js/error-placement": {}
}
}
</script>
<?php else: ?>
<div class="message info notlogged" id="review-form">
<div>
<?= $block->escapeHtml(__('Only registered users can write reviews. Please <a href="%1">Sign in</a> or <a href="%2">create an account</a>', $block->getLoginLink(), $block->getRegisterUrl()), ['a']) ?>
</div>
</div>
<?php endif ?>
</div>
</div>
Solution
Please update your catalog_product_view.xml as follows
<page layout="1column" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
<referenceBlock name="product.info.review">
<action method="setTemplate">
<argument name="template" xsi:type="string">XXX_YYY::review.phtml</argument>
</action>
<block class="Magento\Framework\View\Element\Template" name="custom.review.popup" template="XXX_YYY::popup.phtml">
<block class="Magento\Review\Block\Form" name="custom.product.review.form" as="custom.review_form" template="XXX_YYY::form.phtml">
<container name="product.review.form.fields.before" as="form_fields_before" label="Review Form Fields Before"/>
<arguments>
<argument name="jsLayout" xsi:type="array">
<item name="components" xsi:type="array">
<item name="review-form" xsi:type="array">
<item name="component" xsi:type="string">Magento_Review/js/view/review</item>
</item>
</item>
</argument>
</arguments>
</block>
</block>
</referenceBlock>
<referenceBlock name="product.info.details">
<referenceBlock name="reviews.tab" remove="true" />
</referenceBlock>
<referenceContainer name="product.info.additional">
<block class="Magento\Review\Block\Product\View\ListView" name="custom.product.section.info" template="XXX_YYY::abc.phtml"/>
</referenceContainer>
</body>
Now clear your cache and refresh.
Licensed under: CC-BY-SA with attribution
Not affiliated with magento.stackexchange
