Ist es möglich, das onsubmit-Ereignis von Javascript programmgesteuert in einem Formular aufzurufen?

Question

In Ruby on Rails versuche ich, das zu aktualisieren innerHTML eines div-Tags mit dem form_remote_tag Helfer.Diese Aktualisierung erfolgt immer dann, wenn ein zugehöriges Select-Tag ein Onchange-Ereignis empfängt.Das Problem ist, <select onchange="this.form.submit();">;funktioniert nicht.Auch nicht document.forms[0].submit().Die einzige Möglichkeit, den im form_remote_tag generierten Onsubmit-Code auszuführen, besteht darin, eine versteckte Submit-Schaltfläche zu erstellen und die Click-Methode für die Schaltfläche über das Select-Tag aufzurufen.Hier ist ein funktionierendes ERb-Teilbeispiel.

<% form_remote_tag :url => product_path, :update => 'content', :method => 'get' do -%>
  <% content_tag :div, :id => 'content' do -%>
    <%= select_tag :update, options_for_select([["foo", 1], ["bar", 2]]), :onchange => "this.form.commit.click" %>
    <%= submit_tag 'submit_button', :style => "display: none" %>
  <% end %>
<% end %>

Ich möchte so etwas machen, aber es funktioniert nicht.

<% form_remote_tag :url => product_path, :update => 'content', :method => 'get' do -%>
  <% content_tag :div, :id => 'content' do -%>
    # the following line does not work
    <%= select_tag :update, options_for_select([["foo", 1], ["bar", 2]]), :onchange => "this.form.onsubmit()" %>
  <% end %>
<% end %>

Gibt es also eine Möglichkeit, die unsichtbare Senden-Schaltfläche für diesen Anwendungsfall zu entfernen?

Es scheint einige Verwirrung zu geben.Also, lass es mich erklären.Das Grundproblem ist das submit() ruft das nicht an onsubmit() Code, der in das Formular gerendert wird.

Das eigentliche HTML-Formular, das Rails aus diesem ERb rendert, sieht folgendermaßen aus:

<form action="/products/1" method="post" onsubmit="new Ajax.Updater('content', '/products/1', {asynchronous:true, evalScripts:true, method:'get', parameters:Form.serialize(this)}); return false;">
  <div style="margin:0;padding:0">
    <input name="authenticity_token" type="hidden" value="4eacf78eb87e9262a0b631a8a6e417e9a5957cab" />
  </div>
  <div id="content">
    <select id="update" name="update" onchange="this.form.commit.click">
      <option value="1">foo</option>
      <option value="2">bar</option>
    </select>
    <input name="commit" style="display: none" type="submit" value="submit_button" />
  </div>
</form>

Ich möchte die unsichtbare Schaltfläche „Senden“ entfernen, aber die Verwendung eines direkten Formulars scheint nicht zu funktionieren.Ich brauche also eine Möglichkeit, den Onsubmit-Ereigniscode des Formulars aufzurufen.

Aktualisieren:Die Lösung von Orion Edwards würde funktionieren, wenn es keine gäbe return(false); generiert von Rails.Ich bin mir jedoch nicht sicher, was schlimmer ist: das Senden eines Phantomklicks an eine unsichtbare Senden-Schaltfläche oder das Aufrufen von eval getAttribute('onsubmit') Aufruf nach dem Entfernen des Rückrufs durch einen Javascript-String-Ersatz!

Answer 1

Wenn Sie das Formular nicht wirklich absenden, sondern einfach den Code aufrufen möchten, der zufällig im Onsubmit enthalten ist, können Sie möglicherweise Folgendes tun:(ungetestet)

var code = document.getElementById('formId').getAttribute('onsubmit');
eval(code);

Answer 2

Mir ist klar, dass diese Frage schon etwas alt ist, aber wozu zum Teufel machen Sie gerade eine Bewertung?

document.getElementById('formId').onsubmit();
document.getElementById('formId').submit();

oder

document.formName.onsubmit();
document.formName.submit();

Wenn das DOM eines Dokuments geladen wird, sind die Ereignisse keine Strings mehr, sondern Funktionen.

alert(typeof document.formName.onsubmit); // function

Es gibt also keinen Grund, eine Funktion in einen String umzuwandeln, nur damit Sie sie auswerten können.

Answer 3

Geben Sie Ihrem Formular eine id.

Dann

document.getElementById('formid').submit();

Wenn Sie Javascript in a laden div über innerHTML, es läuft nicht ... nur zur Information.

Answer 4

Wenn Sie die integrierte Javascript-Generierung von Rail verwenden müssen, würde ich die Lösung von Orion verwenden, jedoch mit einer kleinen Änderung, um den Rückkehrcode zu kompensieren.

eval ('(function(){' + code + '})()');

Meiner Meinung nach wäre es jedoch auf lange Sicht einfacher, den Javascript-Code in eine externe Datei oder separate aufrufbare Funktionen auszulagern.

Answer 5

Nicht.

Sie haben eine Lösung.

Stoppen Sie, fahren Sie mit dem nächsten Funktionspunkt fort.

Ich weiß, es ist nicht schön, aber es gibt größere Probleme.

Answer 6

Ich bin mir nicht sicher, ob Sie schon eine Antwort haben oder nicht, aber in der onclick Funktion des Select, Call onsubmit anstatt submit.

Answer 7

Theoretisch so etwas wie eval ('function(){' + code + '}()'); könnte funktionieren (diese Syntax schlägt jedoch fehl).Selbst wenn das funktionieren würde, wäre es immer noch eine Art Ghetto, eine Bewertung über eine Auswahl abzurufen onchange.Eine andere Lösung wäre, Rails irgendwie dazu zu bringen, das zu injizieren onsubmit Code in die onchange Feld des Select-Tags, aber ich bin mir nicht sicher, ob es eine Möglichkeit gibt, das zu tun.ActionView hat link_to_remote, aber es gibt keinen offensichtlichen Helfer, um denselben Code in zu generieren onchange Feld.