Question

听起来像一个简单的问题。我添加了一些jQuery魔法：

$("#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魔术来禁用提交按钮，那么$ opP参数不再包含在$ _POST数组中，因此Drupal认为该表单尚未提交。

我在Prevent double submission of forms in jQuery看过这个问题，但我担心这似乎是一个非常糟糕的修复方法，应该有更好的方法。

Answer 1

或者你可以这样做，作为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);',
  ),
);

Answer 2

我认为您绑定到按钮的click事件意味着该按钮在Click事件冒泡到表单并导致提交之前被禁用。

我们的团队发现禁用提交按钮几乎总会给Internet Explorer带来问题。我们制作了一个小插件来解决这个问题;请参阅此处的代码：https://stackoverflow.com/a/4473801/4376

Answer 3

我今天下午以这种方式修复了它，并且能够获得提交的表单信息：

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

Answer 4

只需隐藏您的提交按钮（display:none），然后显示另一个已禁用的按钮。对于这个问题，我认为它不像其他解决方案那么简单。我的页面上通常只有2个按钮，一个是可见的，另一个不是，而onClick，只需将它们切换。

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

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

4 个答案: