prevent使用angular.js多个表单提交 - 禁用表单按钮 [英] prevent multiple form submissions using angular.js - disable form button

问题描述

我想用angular.js prevent多个表单提交。问题是与此相关的<一个href=\"http://stackoverflow.com/questions/15671335/$p$pvent-multiple-form-submissions-in-django\">question.

I want to prevent multiple form submissions using angular.js. The question is related to this question.

在表单上的用户点击提交按钮提交按钮值/标签应改为装..，按钮的状态将被设置为禁用，并且提交事件应该以正常的方式被触发，导致提交呼叫到服务器。这样，用户将看到如下效果：

When the user clicks on a form submit button the value / label of the submit button should change to "loading..", status of the button will be set to disabled AND the submit event should be triggered in the normal way, leading to a submit call to the server. This way the user would see the following effect:

1. 立即：提交按钮值更改为加载..和被禁用

1. Immediately: The submit button value changes to "loading.." and gets disabled

一旦服务器响应：用户将获得presented服务器请求的结果（而服务器响应时没有角度介入处理）

As soon as the server responds: user gets presented the result of the server request (whereas server responds are handled without angular intervention)

我创造了这个普拉克来说明我的意思。我的问题涉及到这一行： elm.attr（禁用，真正的）; 。这不仅禁用按钮，也prevent传播提交事件。因此，我得到一个残疾人按钮（期望的结果），但形式没有得到提交（不想要的结果）。

I created this plunk to show what I mean. My issue relates to this line: elm.attr('disabled',true); . This does not only disable the button, but also prevent to propagate the submit event. Thus I get a disabled button (desired result), but the form does not get submitted (undesired result).

您可以看到不断变化的行为，如果你对此有何评论/取消注释这一行： elm.attr（禁用，真正的）;

You can see the changing behavior if you comment / uncomment this line : elm.attr('disabled',true);

不知道如何改变呢？

推荐答案

尝试$超时（在angularjs功能）

Try a $timeout (the angularjs function)

$timeout(function(){
    elm.attr('disabled',true);
}, 0)

这篇关于prevent使用angular.js多个表单提交 - 禁用表单按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！