Come disabilitare il pulsante di invio dopo aver fatto clic?


13

Drupal non sembra impedire l'invio di più moduli, anche sulle pagine dei nodi. Questo QA suggerisce di risolverlo sul lato server.

Come posso disabilitare il pulsante di invio dopo aver fatto clic?

Qualche altra soluzione?


L'API Form di Drupal non impedisce il doppio invio grazie al controllo del valore del token del modulo? Non è possibile inviare un modulo con lo stesso token due volte?
Johnathan Elmore,

Risposte:


12

È solo in sviluppo ma il modulo Nascondi invio farebbe il trucco. Una delle caratteristiche è:

Nasconde (o disabilita) il pulsante di invio dopo aver fatto clic

L'ho appena installato su un sito di sviluppo e sembra funzionare bene per i moduli di aggiunta dei nodi; quando fai clic sul pulsante di invio, viene nascosto e sostituito con un'immagine di caricamento e un messaggio "Please wait ...", prima che il modulo venga infine inviato. Non l'ho provato su nessun'altra forma però.


Qualche idea su come far funzionare il modulo di invio hide sui moduli nei tuoi moduli personalizzati? Speravo che fosse esteso a tutto il sito, ma questo non sembra essere il caso.
user785179

@ user785179 guarda come si implementa hook_form_alter()- se lo sta usando hook_form_FORMID_alter(), passa a generico hook_form_alter(). Se è generico hook_form_alter()con if dentro, aggiungine un po or'in questo if.
Mołot,

Fai attenzione con questa soluzione: il modulo di invio nascosta interrompe i caricamenti di ajax, causa problemi di completamento automatico e in alcuni casi fa sì che il pulsante di invio non faccia nulla al primo clic. Ho dovuto disinstallarlo da un sito.
Jenlampton,

@Jen Strange, lo uso da decine di siti da anni senza vedere problemi del genere. Forse hai installato un altro modulo che interferisce con esso
Clive

10

Ecco la soluzione per Drupal 7. Il codice è la versione semplificata del modulo Nascondi invio.

Questo codice funziona perfettamente anche con pulsanti "Aggiungi altro" e moduli AJAX.

Drupal.behaviors.hideSubmitButton = {
  attach: function(context) {
    $('form.node-form', context).once('hideSubmitButton', function () {
      var $form = $(this);
      $form.find('input.form-submit').click(function (e) {
        var el = $(this);
        el.after('<input type="hidden" name="' + el.attr('name') + '" value="' + el.attr('value') + '" />');
        return true;
      });
      $form.submit(function (e) {
        if (!e.isPropagationStopped()) {
          $('input.form-submit', $(this)).attr('disabled', 'disabled');
          return true;
        }  
      });
    });
  }
};

Voglio implementare questo in tema di amministrazione. Creato un file sitename.js e copiato sopra il codice. Non funziona. Dovrei aggiustare le cose?
Justme,

@Justme dove hai messo il tuo file sitename.js? Se in un modulo o sottotema è necessario aggiungerlo nel file .info in modo che sia caricato, oppure chiamare drupal_add_js () da qualche altra parte per ottenerlo sulla pagina. Riesci a vederlo aggiunto nella fonte della pagina?
Jenlampton,

Grazie risolto. Non sapevo che questo dovesse essere tra: (function ($) {e}) (jQuery); nel file js. Funziona come uno squalo !!
Justme,

0

Il modo più semplice è fare una soluzione javascript basata su temi per disabilitare il pulsante dopo l'invio del modulo. Nel file theme.info, inserisci il tuo file javascript in modo che possa essere caricato dal tema API.

scripts[] = js/themename-script.js

Ora nella themename-script.js aggiungi alla sezione Drupal.behaviors.themename per assomigliare al seguente:

Drupal.behaviors.themename = function()
{
  $('.node-form').submit(function(){
    $('#edit-submit').attr("disabled", "disabled");
    $('#edit-preview').attr("disabled", "disabled");
  });
}

Quindi il flusso è il seguente:

  1. Il tema carica il javascript
  2. Drupal.behaviors.themename viene attivato al caricamento della pagina
  3. All'invio del modulo del nodo aggiungi modulo (classe basata nell'esempio sopra, può essere personalizzato sul tipo di modulo) disabilita i pulsanti di invio (invia e visualizza in anteprima) in modo che non possa essere cliccato di nuovo

Sono sicuro che ci sia qualche elaborazione ajax che quanto sopra potrebbe essere pericoloso e l'invio del modulo non potrà mai essere eseguito di nuovo se viene rilevato un errore nella convalida form_api, quindi testalo e personalizzalo per soddisfare le tue esigenze. Ho disabilitato entrambi i pulsanti poiché era ancora possibile fare clic sul pulsante di anteprima mentre il pulsante di invio era disabilitato. Ovviamente il tuo chilometraggio può variare.


2
Stai usando il vecchio Drupal.behaviorsstile di dichiarazione; non funzionerà per Drupal 7. Dovrebbe esserlo Drupal.behaviors.themename = { attach: function (context, settings) { // .... Vedi Gestione di JavaScript in Drupal 7 per maggiori informazioni
Clive

Stile dichiarazione dichiarato
Eugene Fidelin,

Quali valori devono essere sostituiti da questo 'modulo nodo' di script?
pal4life,

Ho provato a farlo funzionare in tema di amministrazione ma senza fortuna. Rinominare themename con adminimal e copiato il codice completo in sitename.js e aggiunto questo al file di informazioni sul tema. Ancora ricevo facilmente più invii dello stesso modulo.
Justme,
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.