Wie kann ich eine Drupal-Formular-Senden-Schaltfläche deaktivieren, wenn auf sie geklickt wird, um doppelte Einreichung zu verhindern?

Question

Klingt wie eine einfache Frage. Ich habe ein bisschen von jQuery Magie hinzugefügt:

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

Sobald jedoch diese an Ort und Stelle ist, meine Form Handler einreicht nicht aufgerufen.

Dies ist eine individuelle Form auf meinem eigenen Weg in hook_menu definiert:

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

In der Form, ich habe eine Submit-Button und eine Löschtaste:

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

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

und definiere ich meine eigenen einreichen Handler:

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

ich habe ein bisschen von Tracing-Code in der drupal_get_form() Funktion zu schnuppern setzen Die Variable $ _POST, wenn das Formular gesendet wird. Wenn die jQuery Magie deaktiviert ist, schließt die $ _POST Variable einen „op“ Parameter:

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

aber wenn ich die jQuery Magie ermöglichen die Absenden-Schaltfläche zu deaktivieren, nachdem es die „op“ geklickt worden ist, Parameter ist nicht mehr im $ _POST-Array enthalten, und so denkt Drupal, dass das Formular nicht übergeben wurde.

Ich habe die Frage bei Prevent double submission of forms in jQuery gesehen, aber bin besorgt, dass dies scheint wie ein wirklich hacky Fix, und es sollte einen besseren Weg geben.

Answer 1

Ich glaube, die Tatsache, dass Sie an das click -Ereignis der Schaltfläche binden, bedeutet, dass die Schaltfläche deaktiviert wird, bevor das Klickereignis zum Formular übergehen und eine Übermittlung auslösen kann.

Unser Team hat festgestellt, dass die Deaktivierung der Senden-Schaltfläche fast immer Probleme für Internet Explorer verursacht. Wir haben ein kleines Plugin erstellt, um das Problem zu lösen. siehe Code hier: https://stackoverflow.com/a/4473801/4376

Answer 2

Ich reparierte es heute Nachmittag diese Art und Weise und konnte die Formularinformationen mit herauser Ausgabe vorgelegt bekommen:

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

Answer 3

Oder Sie können dies tun, als Einzeiler Zugabe bei der PHP Form Array-Ebene ...

$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 4

verstecken Sie Ihren Submit-Button (display:none) und zeigt eine andere Taste bereits statt deaktiviert. Ich denke, es ist weniger hacky als die anderen Lösungen für dieses Problem. Normalerweise habe ich nur zwei Schaltflächen auf meiner Seite, eine sichtbar und die andere nicht, und onClick, einfach umschalten.

Das Problem wird verursacht, weil deaktivierte Schaltflächen keine Postbacks auslösen.