Laravel多组星级评分联动异常问题修复求助

问题根源 #

1. 所有单选框（radio）的name属性都是rating，同name的单选框会默认互斥，导致选一组影响其他组
2. 新增评分组的input ID和原组完全重复（都是str1到str5），标签（label）的for属性关联重复ID，触发页面异常

修复步骤 #

• 给每个评分组设置独立的name属性，让每组单选框成为独立互斥组
• 给每个组的input和label设置唯一ID，保证标签和单选框的关联正确

修改后的代码示例 #

<!-- 原基础评分组 -->
<div class='give-rating'>
    @for ($i = 5; $i >= 1; $i--)
        <span>
            <input id='str_quality_{{ $i }}' name='rating_quality' type='radio' value='{{ $i }}'>
            <label for='str_quality_{{ $i }}'><i class="las la-star fa-sm"></i></label>
        </span>
    @endfor
</div>
</div>
<!-- Timeliness评分组 -->
<div class="give-rating-person2">
    <div class="content">
        <h6>Timeliness</h6>
    </div>

    <div class='give-rating'>
        @for ($i = 5; $i >= 1; $i--)
            <span>
                <input id='str_timeliness_{{ $i }}' name='rating_timeliness' type='radio' value='{{ $i }}'>
                <label for='str_timeliness_{{ $i }}'><i class="las la-star fa-sm"></i></label>
            </span>
        @endfor
    </div>
</div>
<!-- 第三组评分（按需添加） -->
<div class="give-rating-person3">
    <div class="content">
        <h6>Service Attitude</h6>
    </div>

    <div class='give-rating'>
        @for ($i = 5; $i >= 1; $i--)
            <span>
                <input id='str_service_{{ $i }}' name='rating_service' type='radio' value='{{ $i }}'>
                <label for='str_service_{{ $i }}'><i class="las la-star fa-sm"></i></label>
            </span>
        @endfor
    </div>
</div>

后端补充说明 #

• 表单提交后，控制器需要接收这三个独立字段：$request->rating_quality、$request->rating_timeliness、$request->rating_service
• 确保你的评论表已经添加对应的字段（比如rating_quality、rating_timeliness）来存储这三个评分值

内容的提问来源于stack exchange，提问作者Eric kanyiri