如何启用Submit按钮并在Django中获得成功的ajax响应后更改它的值？

Question

我使用Django作为我的web框架。我正在创建一个AWS实验室或AWS帐户。最初，在用户填写一些细节(如实验室名称、cidr块等)以防止多次提交后，我将禁用Submit按钮，同时将Submit按钮值更改为“CREATING”。

在获得成功的ajax响应后，我希望启用按钮并将按钮值更改为创建的，并在一分钟后刷新页面。我将添加一个警告说：“页面将在1分钟后自动刷新!”

这是我的片段。我正在尝试下面的代码，但它不起作用。

 // handle a successful response
    success : function(json) {
        $('#form-labname').val(''); // remove the value from the input
        $('#form-cidr').val('');
        $('#form-type').val('');
        $('#form-budget').val('');
        $('#submit').attr("disabled", false);
        $('#submit').val('Created !');
        console.log(json); // log the returned json to the console
        console.log("success"); // another sanity check
        $("#result").prepend("<br><br><h3>Lab Creation Success</h3><br><li>
         <strong>Account Number:  "+json.account+"</strong></li><br><li>
         <strong>Lab Name:  "+json.labname+"</strong></li><br><li>
         <strong>Email ID:  "+json.email+"</strong></li><br><li><strong>New 
         VPC ID: "+json.vpcid+"</strong></li><br>");
     console.log("success"); // another sanity check
         },

我提交按钮的id是“提交”。我尝试在成功的响应处理代码的第5行和第6行中启用和更改它的值。我做错了什么，怎么在一分钟后刷新页面？请帮帮忙。提前感谢

下面是html片段：

 <form  method="post" id="form-post">{% csrf_token %}
  <div class="form-group">
   <label for="form-labname">Lab Name</label><br>
    {{form.labname}}
  </div>
  <div class="form-group">
   <label for="form-cidr">CIDR Block</label><br>
    {{form.cidr}}
  </div>
  <div class="form-group">
   <label for="form-budget">Budget</label><br>
    {{form.budget}}
  </div>
  <input id="submit" type='submit' class="btn btn-primary" 
   style="background-color:#3facdb;border-color=#3facdb;" value='Submit' />
</form>

下面是我最初用于禁用Submit按钮并将其值更改为“创建”的JQuery：

 $(document).ready(function () {
  $("#form-post").submit(function () {
    $("#submit").attr("disabled", true);
    $("#submit").val("Creating ...");
    return false;
    //$("#submit").val("Creating ...");
   });
 });

可以用Javascript来代替更改按钮值吗？同时启用它？

Answer 1

应该使用prop设置按钮的禁用状态。

$('#submit').prop("disabled", false);

如果您的按钮是<button>按钮，则必须使用.text()更改其文本。

$('#submit').text('Created !');

附注：命名表单元素submit可能会给您带来一些麻烦，即form.submit()