gpt4 book ai didi

javascript - Django 表单 : disabling submit button and re-enabling when done

转载 作者:行者123 更新时间:2023-11-28 01:02:04 25 4
gpt4 key购买 nike

我有一个高度定制的投票表单,它是使用 JavaScript 动态生成的,一旦提交,它会将您重定向到另一个页面(“投票”),该页面要么 a) 报告用户在成功提交后投票的内容,要么 b)报告提交失败时发生的错误。一个可能的错误是,如果选民姓名已被使用,在这种情况下,它会指示用户选择其他名称。

我的问题是,如果用户双击提交按钮,它会成功提交投票,但之后由于投票者姓名被使用两次(即发生双重帖子),最终提交失败。用户最终完全跳过了成功投票页面,看起来他们的原始投票没有被计算在内,说该名称已被使用。

我的表单的标签如下所示:

<form id="formVote" name="formVote" action="{% url 'surveys:voted' survey.id %}" method="POST">

我希望能够在提交时禁用提交按钮,但我不知道如何使用上面的代码来做到这一点。我所做的尝试是像这样标记表单:

<form id="formVote" name="formVote" action="" method="POST">

并调用 JQuery 函数来处理事情:

$('#formVote').submit(function(e){

// disable vote button to prevent double submissions
document.getElementById('submit_vote_button').disabled = true;
document.getElementById('submit_vote_button').value = "Submitting...";

// submit the vote
$.post('{% url 'surveys:voted' survey.id %}', $(this).serialize(), function(data){
document.getElementById('submit_vote_button').disabled = false;
document.getElementById('submit_vote_button').value = "Submit Vote";
});

e.preventDefault();
});

这在某种程度上有效,但完成后它实际上并没有将用户重定向到“投票”页面...它成功提交了投票(或者如果出现错误则不会提交)并且只是保留在投票中表单页面完成后,给用户关于发生的事情的零反馈,尽管views.py投票 View 返回渲染:

return render(request, 'surveys/voted.html', {
'error_message': error_message,
'voter_name': voter_name,
'ranking_id_array_final': ranking_id_array_final,
'survey_id': survey_id,
'survey_opened': survey_opened,
})

同样,当我尝试时,HttpResponseRedirect 也没有执行任何操作。

我需要发生的是:

  1. 提交按钮已禁用
  2. POST 请求已提交
  3. “已投票”页面已加载
  4. 重新启用“提交”按钮(如果用户按下 返回按钮提交另一次投票)

这里的任何指导将不胜感激,我觉得我让事情变得比他们需要的更复杂。

最佳答案

您可以在模态或 float div 中显示 data 变量内容,以向用户展示发生了什么。该变量保存模板的渲染 html(使用其所有逻辑以及传递给它的所有参数)
也许你可以使用jquery dialog为了完成这个
脚本应该是

$.post('{% url 'surveys:voted' survey.id %}', $(this).serialize(), function(data){
document.getElementById('submit_vote_button').disabled = false;
$( "#dialog-message" ).dialog({
modal: true,
buttons: {
Ok: function() {
$( this ).dialog( "close" );
}
}
});
$( "#dialog-message" ).html(data) //here goes your data var (rendered html from your django template)
});

关于javascript - Django 表单 : disabling submit button and re-enabling when done,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25510170/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com