Wie kann ich unauffällig deaktivieren, submit-buttons mit Javascript und Prototype?

Also ich fand diese Empfehlung, aber ich kann nicht ganz scheinen, um herauszufinden, wie.

Dies ist der code, den ich ursprünglich mit gestartet:

   function greySubmits(e) {
      var value = e.srcElement.defaultValue;
      //This doesn't work, but it needs to
      $(e).insert('<input type="hidden" name="commit" value="' + value + '" />');

      //This causes IE to not submit at all
      $$("input[type='submit']").each(function(v) {v.disabled = true;})
   }

   //This works fine
   Event.observe(window, 'load', function() {
     $$("input[type='submit']").each(function(e) {
        Event.observe(e, 'click', greySubmits);
     });
  });

Sowieso, ich bin ziemlich eng, aber ich kann nicht scheinen, um jede weitere.

Vielen Dank für jede Hilfe überhaupt!

Update: Sorry, ich glaube, ich war nicht ganz klar. Ich würde gerne deaktivieren Sie alle submit-buttons, wenn jemand klickt auf die Schaltfläche "senden". Aber ich tun senden müssen zusammen den Wert der submit-button, damit der server weiß, welchen button ich geklickt, daher der Aufruf einfügen. (Hinweis: legen Sie nicht nicht erstellen Sie ein child-element des Elements rufen Sie es auf.) Und dann nach dem deaktivieren des submit-buttons muss ich anrufen die mit der form des submit-buttons submit aufrufen, da der IE nicht Einreichen, nachdem Sie die Schaltfläche deaktivieren. Macht das Sinn?

  • was genau möchten Sie tun? deaktivierte Eingänge sollten nicht mit dem Formular gesendet.
InformationsquelleAutor Frew Schmidt | 2009-02-23
  1. 4

    Müssen Sie genau das tun, was die Antwort sagt :

    "Nicht deaktivieren, die Taste in dessen "onclick", aber speichern Sie es, und tun es in der form das "onsubmit"."

    So, in greySubmits() halten Sie die Linie setzt, die den verborgenen Wert, sondern entfernen Sie die Zeile, die deaktiviert alle submit-buttons.

    Dann fügen Sie eine weitere event-handler in Ihrer online - form, nicht die submit-buttons - das ist die Deaktivierung.

     function reallyGreySubmits(e) {
     //This causes IE to not submit at all
     $$("input[type='submit']").each(function(v) {v.disabled = true;})
 }

 Event.observe(window, 'load', function() {
     $$("input[type='submit']").each(function(e) {
        Event.observe(e, 'click', greySubmits);
     });
     $$("form").each(function(e) {
        Event.observe(e, 'submit', reallyGreySubmits);
     });
  });

    Andere option, die ich verwendet habe, ist nicht zu deaktivieren, legt aber zu tauschen Sichtbarkeit zwischen zwei Elementen. Auf klicken Sie auf, markieren Sie die unterwirft sich versteckt, und dann sichtbar machen, wie ein div oder ein anderes element, dass zeigt, wie "Behinderte" in Ihrem Ort.

    • Das ist alles schön und gut, aber der Teil, dass ich damit eindeutig nicht funktioniert, so dass ich hoffte auf etwas Hilfe es...
    InformationsquelleAutor Ryan Watkins
  2. 1

    Habe ich es endlich an die Arbeit. Ryan geholfen, also werde ich upvote ihn 🙂 Hier der code:

      function replaceSubmit(e) {
    var el = e.element();
    Element.insert(el, { 'before': '<input type="hidden" name="' + el.name + '" value="' + el.value +'" />'});
  }

  function greySubmits(e) {
    //Don't disable the submit if the submit was stopped with a return(false)
    if (e.returnValue) {
      $$("input[type='submit']").each(function(v) {v.disabled = true;})
    }
  }

  function fixButtons() {
    $$("input[type='submit']").each(function(v) {
        if (Element.hasClassName(v, 'disabled')) {
          v.disabled = true;
        } else {
          v.disabled = false;
        }
      });
  }

  Event.observe(window, 'load', function() {
      fixButtons();
      $$("input[type='submit']").each(function(e) {
          Event.observe(e, 'click', replaceSubmit);
        });
      $$("form").each(function(e) {
          Event.observe(e, 'submit', greySubmits);
        });
    });

    Den fixButtons ist, so dass, wenn die Menschen auf die Schaltfläche zurück klicken und die Seite wird fix alle Tasten. Und wenn Sie wollen, deaktivieren Sie eine Schaltfläche und haben es nicht re-aktivieren, auf dem Rücken, die Sie gerade geben Sie eine Klasse von Behinderten.

    • Scheint nicht zu funktionieren, im Firefox (10 in meinem Fall) auf osx. Scheint e.returnValue ist nicht true zurückgeben, wie es sollte. Zu untersuchen wird.
    InformationsquelleAutor
  3. 1
    document.observe("dom:loaded", function(){
   $$('form').find(function(thisForm) {
      Event.observe(thisForm, 'submit', function(event) {
         $$('input[type="submit"]').find(function(input) {
            input.value = 'Please wait ...';
            input.setAttribute('disabled',true);
            });
         });
      });       
   });
    InformationsquelleAutor Loozer
  4. 0

    Hier ist, was ich kam mit, die angepasst ist, von oben. Behoben, so dass es erkennt einen abgesagten Veranstaltung Vermehrung mithilfe von Prototypen gestoppt Attribut.

    Andere änderungen umfassen die Verwendung längerer Variablennamen (ich bekomme immer verwirrt darüber, ob e-oder Ereignis-element), und eine Funktion, die entfernt die Ersatz-Eingänge, wenn das senden des Formulars abgebrochen wird. In meiner Implementierung drücken der Rück-Taste auf der browser nicht die Seite anzeigen, die, wie es war, wenn der Benutzer es Links, statt es zu sein scheint refetched (ich bin mit Schienen), also habe ich entfernt, das Teil zu.

    Ich bin mit buttons anstatt die Eingaben in meine Anwendung so, dass das Teil geändert wurde auch.

    function replaceSubmit(event) {
    var element = event.element();
    Element.insert(element, { 'before': '<input type="hidden" name="' + element.name + '" value="' + element.value +'" class="button_replacement">'});
}

function removeReplacementSubmits() {
    $$('input.button_replacement').each(function(button) {
        button.remove();
    });
}

function greySubmits(event) {
    //Don't disable the submit if the submit was stopped with a return(false)
    if (event.stopped === true) {
        removeReplacementSubmits();
    } else {
        $$('button[type="submit"]').each(function(button) {
            button.disabled = true;
            button.innerHTML += '&#133;';
        });
    }
}

Event.observe(window, 'load', function() {
    $$("button[type='submit']").each(function(element) {
        Event.observe(element, 'click', replaceSubmit);
    });
    $$("form").each(function(element) {
        Event.observe(element, 'submit', greySubmits);
    });
});
    InformationsquelleAutor Brendon Muir
Schreibe einen Kommentar