如何禁用Drupal表单提交按钮以防止双击提交？

听起来像一个简单的问题。我已经添加了一点jQuery的魔力：如何禁用Drupal表单提交按钮以防止双击提交？

$("#edit-save").click(function(event) { 
    $(this).attr("disabled", "true"); 
});

但是，一旦这个到位，我的表单提交处理程序不会被调用。

这是我自己的路径上的自定义窗体中hook_menu定义：

$items['my_form'] = array(
    'title' => 'My form', 
    'page callback' => 'drupal_get_form', 
    'page arguments' => array('mymod_myform'), 
    'type' => MENU_CALLBACK, 
);

在窗体中，我有一个提交按钮和取消按钮：

$form['cancel'] = array(
    '#type' => 'submit', 
    '#value' => t('Cancel'), 
); 

$form['save'] = array(
    '#type' => 'submit', 
    '#value' => t('Save'), 
);

，我定义我自己提交处理程序：

$form['#submit'][] = 'mymod_myform_submit';

我已经在drupal_get_form（）函数中放了一些跟踪代码来嗅探提交表单时的$ _POST变量。当jQuery的魔术被禁用，$ _ POST变量包括“OP”参数：

Array 
    (
    [op] = Save 
    [form_build_id] => form-6e74c87390e3fc48d0bebd2f5193315b 
    [form_token] => 33db6e34c0350e33c48861a63a38d45f 
    [form_id] => dh_seo_workload_item_form 
)

，但如果我让jQuery的魔力来禁用它被点击后提交按钮，通过“op”参数不再包含在$ _POST数组中，所以Drupal认为该表单尚未提交。

我在Prevent double submission of forms in jQuery看到过这个问题，但担心这看起来像是一个非常冒险的修复，应该有更好的方法。

来源

2010-12-17 Mark B

我还添加了一个答案，你与（我认为）一个不太冒险的解决方案链接的问题。 – 2010-12-17 18:50:01

由于点击按钮被禁用，可能不会被调用。下面我的解决方案使用1ms的setTimeout来解决这个问题。 – Nick 2013-04-22 10:53:46

我认为你绑定到按钮的单击事件的事实意味着该按钮被禁用之前，点击事件可以冒泡到表单并导致提交。

我们的团队发现禁用提交按钮几乎总是会为Internet Explorer创建问题。我们制作了一个小插件来解决这个问题。看到代码在这里：https://stackoverflow.com/a/4473801/4376

来源

2010-12-17 18:41:57

感谢您的解决方案。我建议使用bind而不是live，因为live已被弃用。 – Roger 2013-07-16 10:17:17

@Roger - 其实'on（）'是更新后的版本。 'bind'也被弃用，与'live'或'on'不同，它只在调用时在页面上的元素上起作用。相应更正。 – 2013-07-16 15:48:46

哦，我明白了。谢谢Nathan！ – Roger 2013-07-16 16:22:37

我固定它今天下午这样的，能得到与出的问题提交表单信息：

$("#id_of_button").click(function() { 
    var submit = $(this); 
    setTimeout(function(){ 
    submit.attr('disabled','disabled') 
    },1); 
});

来源

2010-12-17 21:47:31 user546533

或者你也可以做到这一点，作为一个班轮除了在PHP形式阵列级别...

$form['submit'] = array(
    '#type' => 'submit', 
    '#value' => t('Save'), 
    '#attributes' => array(
    'onclick' => 'javascript:var s=this;setTimeout(function(){s.value="Saving...";s.disabled=true;},1);', 
), 
);

来源

2013-04-22 10:52:33 Nick

只是隐藏提交按钮（display:none），并显示代替已被禁用另一个按钮。我认为它比这个问题的其他解决方案更简陋。我通常只在页面上有两个按钮，一个可见，另一个不可以，onClick，只需将它们切换。

问题是由于禁用的按钮不会触发回发引起的。

来源

2013-10-09 16:43:54

如何禁用Drupal表单提交按钮以防止双击提交？

回答

相关问题