在Django中获得成功的ajax响应后，如何启用“提交”按钮并更改其值？

Question

我正在使用Django作为我的Web框架。 我正在创建一种AWS实验室或AWS账户。 最初，我在用户填写了一些详细信息（例如实验室名称，cidr块等）后禁用了Submit按钮 ，以防止多次提交，同时我将Submit按钮的值更改为' CREATING '

在获得成功的ajax响应后，我希望启用该按钮并将该按钮的值更改为CREATED，并且可能在一分钟后刷新页面。 我将为此添加一个警报，提示“该页面将在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按钮并将其值更改为“ Creating”的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 !');

ps命名表单元素submit form.submit()您带来一些麻烦，即form.submit()