Как передать переменную javascript внутри url get в Django

Я хотел бы отправить radio_id моему представлению, Сейчас я пытаюсь получить ID радиостанции с помощью javascript, но не знаю, как передать его методом get внутри url и отправить в представление:

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/ invalid literal for

int() с основанием 10: 'checked'

Как это сделать?

вы можете изменить значение 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>

В вашем теге <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}}.

Вернуться на верх