1

CakeDC 评级插件在任何地方都有很好的教程/说明吗?我已经 4 小时了,但站点仍然没有结束 - 自述文件没用。

4

1 回答 1

1

这是我用来让评级插件工作的一些代码。都是 Ajax,所以我在 RatingHelper 中添加了一个 hack,以避免显示“Rate!”。按钮,只需将 submit=>false 添加到选项中。

    if ($options['createForm']) {
        if (!empty($options['target']) && !empty($options['createForm']['url']) && !empty($options['createForm']['ajaxOptions'])) {
            $ajaxOptions = array_merge(array('url' => $options['createForm']['url']), $options['createForm']['ajaxOptions']);
            $result .= $this->Js->submit(__d('ratings', 'Rate!'), $ajaxOptions) . "\n";
            $flush = true;
        } elseif ( !isset($options['submit']) || !empty($options['submit']) ) {
            if(empty($options['submit'])) {
                $result .= $this->Form->submit(__d('ratings', 'Rate!')) . "\n";
            } else {
                $result .= $this->Form->submit($options['submit']) . "\n";                  
            }
        }
        $result .= $this->Form->end() . "\n";
        if ($flush) {
            $this->Js->writeBuffer();
        }
    }

我有一个显示一堆汽车型号的索引视图,我显示了总体评分和当前用户评分:

            <?php foreach ($carmodels as $carmodel): ?>
            <tr>
                <td><?php echo h($carmodel['Carmodel']['id']); ?>&nbsp;</td>
                <td><?php echo h($carmodel['Carmodel']['name']); ?>&nbsp;</td>              
                <td>
                    <?php echo $this->Html->link($carmodel['Make']['name'], array('controller' => 'makes', 'action' => 'view', $carmodel['Make']['id'])); ?>
                </td>
                <td>
                    <?php $overall_div = 'overall-rating' . $carmodel['Carmodel']['id']; ?>
                    <div id="<?php echo $overall_div; ?>">
                        <?php
                        echo $this->element('rating', array('rating' => $carmodel['Carmodel']['rating']));
                        ?>
                    </div>
                </td>   
                <td>

                    <?php
                    $msg_div = 'rating-msg' . $carmodel['Carmodel']['id'];
                    $rating = 0;
                    if (!empty($carmodel['Rating'])) {
                        $rating = $carmodel['Rating'][0]['value'];
                    }
                    echo $this->Rating->display(array(
                        'item' => $carmodel['Carmodel']['id'],
                        'type' => 'radio',
                        'stars' => 5,
                        'value' => $rating,
                        'submit' => false,
                        'createForm' => array(
                            'id' => 'CarmodelsRatingsDemoForm' . $carmodel['Carmodel']['id'],
                            'url' => array('action' => 'ratings_update', $carmodel['Carmodel']['id']),
                            'class' => 'rating',
                            'update-overall' => '#' . $overall_div,
                            'update-msg' => '#' . $msg_div,
                            )));
                    ?>  
                    <div id="<?php echo $msg_div; ?>" class="label label-info hidden">
                        <button class="close" data-dismiss="alert" type="button">×</button>
                        <div class="msg-default"><?php echo __('One moment...'); ?></div>
                        <div class="msg-result"></div>
                    </div>
                </td>

然后我有一些 Jquery 的优点来创建星星,然后对点击做出反应

    $(document).ready(function(){
    $('form.rating').stars({
        cancelShow:true,
        callback: function(ui, type, new_value) {
            var values = ui.$form.serializeArray();
            values.push({
                'name': 'rating',
                'value': new_value
            });
            values = jQuery.param(values);
            var msg = ui.$form.attr('update-msg');
            $(msg).removeClass('hidden');
            $(msg).show();
            $(msg).find('div.msg-default').show();
            $(msg).find('div.msg-result').hide();
            $.ajax({
                'type': 'POST',
                'dataType': 'json',
                'url': ui.$form.attr('action'),
                'data': values
            }).done(function(data) { 
                var overall_rating = ui.$form.attr('update-overall');
                if(overall_rating && data['overall_rating']){
                    $(overall_rating).html(data['overall_rating']);
                }
                if(msg){
                    $(msg).find('div.msg-default').hide();
                    if(data['msg']) {
                        $(msg).find('div.msg-result').show();
                        $(msg).find('div.msg-result').html(data['msg']);
                        window.setTimeout(function() {
                            $(msg).addClass('hidden');
                        }, 2000);
                    } else {
                        $(msg).addClass('hidden');
                    }
                }
                if(data['user_rating'] && data['user_rating']>0) {
                    ui.select(parseInt(data['user_rating']));
                }
            });
        }
    });
})

另外,我需要一小段 CSS 来隐藏 Cake 添加的单选按钮标签。

    form.rating > div.input {
    display: none;      
}

然后在控制器中,我检查用户之前是否对项目进行了评分,如果没有则保存。我返回一个 json 数组,其中包含整体评分的渲染元素、用户评分(新的或现有的)和要在 2 秒后消失的 div 中显示的字符串消息。

    public function ratings_update($id = null) {
    $this->Carmodel->id = $id;
    if (!$this->Carmodel->exists()) {
        throw new NotFoundException(__('Invalid carmodel'));
    }
    $ratings = $this->Carmodel->isRatedBy($id, 1);
    if (!$ratings) {
        $this->Carmodel->rate($id, 1, $this->request->data['rating'], array('values' => array_combine(range(1, 5), range(1, 5))));
        $json['msg'] = __('Thank you');
    } else {
        if ($this->request->data['rating'] == 0) {
            $this->Carmodel->removeRating($id, 1);
            $json['msg'] = __('Rating removed');
        } else {
            $json['msg'] = __('Already rated');
        }
    }
    $this->set('rating', $this->Carmodel->field('rating'));
    $ratings = $this->Carmodel->isRatedBy($id, 1);
    $my_rating = 0;
    if (!empty($ratings)) {
        $my_rating = $ratings['Rating']['value'];
    }
    $this->autoRender = false;
    App::uses('View', 'View');
    $View = new View($this);

    $response = $View->render('/Elements/rating', 'ajax');
    $json['overall_rating'] = $response;
    $json['user_rating'] = $my_rating;
    return json_encode($json);
}

这是显示总体评分的星星的元素的代码,它可能应该是助手的一部分。

if (empty($rating)) {
    echo __('Be the first to rate!');
} else {
    echo str_repeat('<div class="ui-stars-star ui-stars-star-on"><a title=""></a></div>', $rating);
}

因此,虽然这不是一个超级详细的指令,但您应该能够弄清楚代码在做什么并复制它。我花了一天的大部分时间让它工作。

于 2012-10-30T00:46:49.990 回答