Django 星级评定系统和 AJAX

Question

我正在尝试在 Django 网站上实现星级评级系统。

在我的模型中存储评级是排序的，就像在页面上显示分数一样。但我希望用户能够对页面进行评分（基本上从 1 到 5），而无需刷新或更改页面。

我找到了以下内容，并且喜欢这里星星的风格： http:// jvance.com/blog/2008/09/22/JQueryRaterPluginNew.xhtml

目前对javascript和AJAX了解有限。有谁知道如何将上面示例中的星星与 AJAX 和 Django 结合使用，以便在用户选择评级时无需刷新页面即可更新数据库（模型）？

同样重要的是，用户只能投票一次，即他们不允许对一个页面进行两次评分。他们是否已经投票以及他们之前的投票是什么都存储在模型中。但我怎样才能修改星星来显示这一点呢？

因此，如果您知道如何做这些事情，或者更合适的星级图形解决方案，或者任何好的教程......请分享。谢谢。

Answer 1

AJAX 听起来令人恐惧且令人困惑，但事实并非如此。本质上，您想要做的是将一些数据发布到特定的 url/视图组合。有关使用 AJAX 向服务器发送数据的更多信息，请参阅 jQuery.post。

#urls
urlpatterns += patterns('',
url(r'^article/rate/', 'article.rate'),

#views 
def rate(request):
    if request.method == 'POST':
       # use post data to complete the rating..

#javascript
$.post("/article/rate", { rating: 3, article: 2 },
    function(data) {
       // success! so now set the UI star to 3
});

据我所知，星级是通过无线电控件和 CSS 生成的。因此，如果您想在页面加载时显示每个用户的当前评级，只需让您的模板使用 checked 选项呈现关联的收音机即可。

Answer 2

乔纳森，欢迎您来到 django 世界。由于 Django 是一个很酷的框架，一些 djangonauts 编写了很好的网站来帮助我们。

如果您转到 http://djangopackages.com/categories/apps/ 并搜索“评级”你会发现一些 django 可插拔的示例，对你的项目有很大帮助。

另请参阅另一个问题中的实用答案：最佳实践：如何在 Django 模板中最好地实现评级星级

Answer 3

最近正在研究这个问题，所以我想我会提供一个混合解决方案。首先，我使用 RateIt，我发现它的设置非常简单，使用起来也非常直观（添加 RateIt *.js 和 .*css 文件到您的 base.html 模板）：

http://www. radioactivethinking.com/rateit/example/example.htm

以下是我的解决方案的关键部分：

urls.py

url(r'^object/rate/
 my_template.html
<div class="rateit" data-rateit-resetable="false">Rate it!</div>

 ajax.js 
$('.rateit').bind('click', function(e) {

    e.preventDefault();

    var ri = $(this);
    var value = ri.rateit('value');
    var object_id = ri.data('object_id');

    $.ajax({
        url: '/object/rate/?xhr',
        data: {
            object_id: object_id,
            value: value
        },
        type: 'post',
            success: function(data, response) {
            console.log("ajax call succeeded!");
        },
            error: function(data, response) {
            console.log("ajax call failed!");
        }
    });
});

一些视图位来自 James Bennett（例如，设置 xhr）：
 http://www.b-list.org/weblog/2006/jul/31/django-tips-simple-ajax- example-part-1/
 views.py
from django.views.generic.base import View
from .models import MyObject

class RateMyObjectView(View):

    def post(self, request):

        my_object = MyObject.objects.all().last()

        xhr = 'xhr' in request.GET
        star_value = request.POST.get('value', '')

        my_object.score = star_value
        my_object.save()

        response_data = {
            'message': 'value of star rating:',
            'value': star_value
        }

        if xhr and star_value:
            response_data.update({'success': True})

        else:
            response_data.update({'success': False})

        if xhr:
            return HttpResponse(json.dumps(response_data), content_type="application/json")

        return render_to_response(self.template_name, response_data)

 models.py
from django.db import models

class MyObject(models.Model)
    score = models.FloatField(max_length=1, default=0)

请记住，这是一个幼稚的解决方案，只需替换最后一个中的当前星级分数对象列表中的项目。这并不理想，因为最好将分数存储为自己的模型并链接到对象。你可以存储它们并进行平均值等计算。我现在正在研究这个，完成后将更新这个答案。
, RateMyObjectView.as_view(), name='rate_my_object_view'),

my_template.html

ajax.js

一些视图位来自 James Bennett（例如，设置 xhr）：

http://www.b-list.org/weblog/2006/jul/31/django-tips-simple-ajax- example-part-1/

views.py

models.py

请记住，这是一个幼稚的解决方案，只需替换最后一个中的当前星级分数对象列表中的项目。这并不理想，因为最好将分数存储为自己的模型并链接到对象。你可以存储它们并进行平均值等计算。我现在正在研究这个，完成后将更新这个答案。