Отправка формы с помощью тега <a></a> через javascript

Я использую этот код для отправки формы с тегом, но он не работает

html файл

<form id="my_form" method="post">
    {% csrf_token %}
    {{form.as_p}}
    <input type="number" name="conf" ><a onclick="document.getElementById('my_form').submit();" href="{% url 'signup' 0 %}">ارسال کد</a>
    <br><br>
    <button type="submit">ثبت نام</button>
</form>

журнал консоли

 "GET /signup/0 HTTP/1.1" 200 1531

Вывод, который я ожидаю

"POST /signup/0 HTTP/1.1" 200

Я полагаю, что ваша проблема заключается в следующей строке

<a onclick="document.getElementById('my_form').submit();" href="{% url 'signup' 0 %}">Send Code</a>

Поскольку это ссылка, браузер будет обрабатывать ее нажатие. Вам нужно добавить return false; в обработчик клика, чтобы остановить браузер, следующий за ссылкой, или event.preventDefault().

Возможно, стоит упомянуть, что атрибут href тогда ничего не сделает. Разве что сделает <a> настоящей ссылкой, фокусируемой и активируемой.

<a onclick="document.getElementById('my_form').submit(); return false;" href="{% url 'signup' 0 %}">Send Code</a>

Выполнение различных действий из одной и той же формы

Но в любом случае, кнопка была бы более уместна, поскольку вы также отправляете форму.

Ваш атрибут href и текст ссылки создают впечатление, что вы хотите по-прежнему отправить форму, но предпринять другое действие при нажатии кнопки "Отправить код". Для этого HTML предлагает использовать несколько кнопок отправки с разными именами, которые потом можно будет различать на сервере.

Или вы можете добавить атрибут formaction к кнопке, чтобы отправить форму на другой URL. 

<form id="my_form" method="post">
    {% csrf_token %}
    {{form.as_p}}
    <label for="conf">Code</label>
    <input type="text" id="conf" name="conf" inputmode="numeric" pattern="\d+">
    <button type="submit" name="send_code">Send Code</button>
OR
    <button type="submit" formaction="{% url 'signup' 0 %}">Send Code</button>
    <br><br>
    <button type="submit" name="submit">Login</button>
</form>

Обратите внимание, что я добавил метку к полю кода, поскольку каждый ввод нуждается в метке. И я изменил тип ввода для кода, поскольку type="number" не является правильным типом ввода для кодов. Далее мы убедимся, что экранные клавиатуры оптимизированы для ввода чисел, и дадим несколько подсказок для улучшения удобства использования.

<label for="conf">Code</label>
<input type="text" id="conf" name="conf" inputmode="numeric" pattern="\d+" size="6" placeholder="123456">

вы можете использовать функцию на атрибуте click на теге A

Это происходит потому, что сначала при нажатии на тег вы выполняете действие по умолчанию, которое является href в теге. Если не добавить preventDefault()

, то onclick не сработает после действия по умолчанию.

и если вы хотите отправить форму на ваш url подписки, вам нужно добавить его в тег form :

<form id="my_form" method="post" action="{% url 'signup' 0 %}">
{% csrf_token %}
{{form.as_p}}
<input type="number" name="conf" >

<br><br>
<button type="submit">ثبت نام</button>
Вернуться на верх