Django url重写并从Javascript传递参数

时间:2011-08-23 20:34:52

标签: javascript django

作为我之前的一个后续问题,我需要将参数传递给视图。在JS执行之前,不知道该参数。

在我的URLConf:

url(r'^person/device/program/oneday/(?P<meter_id>\d+)/(?P<day_of_the_week>\w+)/$',
therm_control.Get_One_Day_Of_Current_Thermostat_Schedule.as_view(), 
name="one-day-url"),

我可以将此URL传递给它,效果很好! (谢谢你们)。

http://127.0.0.1:8000/personview/person/device/program/oneday/149778/Monday/

在我的模板中,我有这个:

var one_day_url = "{% url personview:one-day-url meter_id=meter_id day_of_the_week='Monday' %}";

在我的javascript中:

 $.ajax({
        type: 'GET',
        url: one_day_url ,
        dataType: "json",
        timeout: 30000,
        beforeSend: beforeSendCallback,
        success: successCallback,
        error: errorCallback,
        complete: completeCallback
    });

当这触发时它工作正常,除了我不一定一直想要星期一。

如果我将javascript更改为:

var one_day_url = "{% url personview:one-day-url meter_id=meter_id %}";

and then

$.ajax({
        type: 'GET',
        url: one_day_url + '/Monday/',
        dataType: "json",
        timeout: 30000,
        beforeSend: beforeSendCallback,
        success: successCallback,
        error: errorCallback,
        complete: completeCallback
    });

我在渲染错误时得到了Caught NoReverseMatch。我假设因为URLconf仍然想要重写以包含?P \ w +)。

我似乎更改了破坏生存的URL conf以查找视图,如果我执行上面的操作,它会给我NoREverseMatch错误。

任何指导都将不胜感激。

5 个答案:

答案 0 :(得分:5)

我通常会按照

的方式做点什么
var one_day_url = "{% url personview:one-day-url meter_id=meter_id day_of_the_week='REPLACE_ME' %}";
// ...
url: one_day_url.replace('REPLACE_ME', 'Sunday')

答案 1 :(得分:2)

您可能想要使用这种旨在回答这个精确问题的项目......

注意:它可能有助于黑客映射网站: https://github.com/Dimitri-Gnidash/django-js-utils

当我不使用此项目时,我在网址中添加了一个默认值,并将其替换为正确的值。

所以使用完全反向然后:

url: one_day_url.replace('/Monday/','/Caturday/')

即使你在星期一取代星期一也会有效......

注意:如果您的默认值已经在网址中提前了,那么丑陋的黑客将会失败,因此请使用它。

答案 2 :(得分:0)

为什么不直接将它们作为请求数据的一部分传递。您可以使用jQuery get函数并将它们作为参数传递。

$.get("{%url personview%}", {'meter_id':"meter_id", "day_of_the_week":"monday" ...}, function(){do stuff when info is returned});

然后在您看来,您可以这样做:

meter = request.GET['meter_id']

这将允许您在视图中使用它。

答案 3 :(得分:0)

我有一个类似的问题。我想在有人点击按钮时打开一个URL。对于它的价值,这是我处理这种情况的方式。

将URL定义为属性:

{% for article in articles %}    
  <button data-article-url="{% url view_article article.id %}">
    Read Article #{{ article.id }}
  </button>
{% endfor %}

使用jQuery,读取属性并继续:

var article_url = $(this).attr("data-article-url");

$.ajax({
  url: article_url,
  ...
});

答案 4 :(得分:0)

您可以在网址中使用令牌并将其作为变量传递给您的模块:

<script src="{{ STATIC_URL }}js/my-module.js"></script>
<script>
$(function(){
    MyModule.init(
        "{% url personview:one-day-url meter_id='0000' day_of_the_week='{day}' %}"
    );
});
</script>
// js/my-module.js
var MyModule = {
    init: function(one_day_url) {
        var id = 1, day = 'Saturday';
        this._one_day_url = one_day_url;
        console.log(this.one_day_url(id, day));

        $.ajax({
            type: 'GET',
            url: this.one_day_url(id, day),
            dataType: "json",
            timeout: 30000,
            beforeSend: beforeSendCallback,
            success: successCallback,
            error: errorCallback,
            complete: completeCallback
        });
    },
    one_day_url: function(meter_id, day) {
        return this._one_day_url.replace('0000', meter_id).replace('{day}', day);
    }
};

请注意,令牌应与正则表达式类型匹配才能成功解析(我无法使用{meter_id},因为它是使用\d+定义的。)

我对这个解决方案有点不满意,最后我编写了自己的应用程序,用django处理javascript:django.js。有了这个应用程序,我可以这样做:

{% load js %}
{% django_js %}
{% js "js/my-module.js" %}
// js/my-module.js
var MyModule = {
    init: function() {
        var id = 1, day = 'Saturday';

        console.log(
            Django.url('personview:one-day-url', id, day),
            Django.url('personview:one-day-url', [id, day]),
            Django.url('personview:one-day-url', {
                meter_id: id,
                day_of_week: day
            })
        );

        $.ajax({
            type: 'GET',
            url: Django.url('personview:one-day-url', id, day),
            dataType: "json",
            timeout: 30000,
            beforeSend: beforeSendCallback,
            success: successCallback,
            error: errorCallback,
            complete: completeCallback
        });
    }
};

$(function(){
    MyModule.init();
});