如何在 Django 中的 url 中传递 javascript 变量答案

【问题标题】：How to pass a javascript variable inside a url get in Django如何在 Django 中的 url 中传递 javascript 变量
【发布时间】：2021-09-23 18:10:17
【问题描述】：

我想向我的视图发送一个 radio_id，现在我正在尝试通过javascript获取我的收音机的ID，但我不知道如何通过我的url中的get方法传递它并发送到视图：

html:

<a href="{% url  'maintenance_issue_fix' %}?radio_id=checked">
    <img src="{% static 'images/maintenance_list.jpg' %}">
</a>


{% for list in issue_list %}
 <tr style="text-transform: capitalize;">
    <td style="text-align:center;">
      <input name="radio_id" type="radio" id="radio_id" value="{{list.id}}">
    </td>
 <\tr>
{% endfor %}

javascript：

<script>

    $(function(){
        $('input[type="radio"]').click(function(){
            if ($(this).is(':checked'))
            {
              var checked = $(this).val();
              console.log(checked);
            }
        });
    });
</script>

观看次数：

def maintenance_issue_fix(request):
    if request.method == 'GET':
        issue_id = request.GET.get('radio_id')
        print(issue_id)

网址：

urlpatterns = [
path('maintenance_issue_fix/', views.maintenance_issue_fix, name="maintenance_issue_fix"),
]

当我尝试让 javascript var 在 url 中传递时，出现以下错误：

ValueError at /maintenance/maintenance_issue_fix/ 无效文字

int() 以 10 为底：'已检查'

怎么做？

【问题讨论】：

你在哪里分配 url 中的“radio_id”？

标签： javascript python html django

【解决方案1】：

在您的<a> 标记中，您已修复checked 查询参数的值。这就是您收到ValueError 的原因——您的应用需要整数为radio_url，但您发送的是"checked" 字符串。

我假设您想根据用户输入替换 href 属性（重定向 URL）。这应该有效：

HTML：

<a href="{% url 'maintenance_issue_fix' %}" id="link">
    <img src="{% static 'images/maintenance_list.jpg' %}">
</a>

在这里我将link id 分配给<a> 元素，以便可以从JavaScript 代码中引用它。

JS：

$(function(){
  $('input[type="radio"]').click(function(){
    if ($(this).is(':checked'))
    {
      let link = $('#link')
      let currentHref = link.attr("href")
      let newHref = currentHref.split("?radio_id=")[0] + "?radio_id=" + $(this).val()
      link.attr("href", newHref);
    }
  });
});

每次用户点击收音机时，我都会更改 URL。请记住，如果没有选择任何项目，<a> 元素将重定向到 {% url 'maintenance_issue_fix' %} 而没有 radio_id 参数。如果它不是您想要的默认值，您可以更改它。

PS：您应该避免将相同的 id (radio_id) 分配给多个元素（就像您在 for 循环中所做的那样）。你可以改用{{list.id}}。

【讨论】：

【解决方案2】：

您可以像这样更改链接的 href 值

#you add the url in data
<a id="redirect-issue-fix" href="{% url  'maintenance_issue_fix' %}" data-baseurl="{% url  'maintenance_issue_fix' %}">
    <img src="{% static 'images/maintenance_list.jpg' %}">
</a>


{% for list in issue_list %}
 <tr style="text-transform: capitalize;">
    <td style="text-align:center;">
      <input name="radio_id" type="radio" id="radio_id" value="{{list.id}}">
    </td>
 <\tr>
{% endfor %}

javascript：

<script>

    $(function(){
        const link = $('#redirect-issue-fix');
        $('input[type="radio"]').click(function(){
            if ($(this).is(':checked'))
            {
              var checked = $(this).val();
              # here you change the href with id of input checked and the baseurl
              $(link).href = $(link).data('baseurl') + "&radio_id=" + checked;
              console.log(checked);
            }
        });
    });
</script>

【讨论】：