tag:forum.selfhtml.org,2005:/selfFormularfelder auf anderes Formular übertragen – SELFHTML-Forum2019-03-06T14:51:17Zhttps://forum.selfhtml.org/self/2019/mar/3/formularfelder-auf-anderes-formular-uebertragen/1743690#m1743690plhttp://rolfrost.de/ddrende.html2019-03-03T10:36:55Z2019-03-03T10:36:55ZFormularfelder auf anderes Formular übertragen<p>S.Thema. Also das andere Formular gibt es schon und zwar 1:1 mit denselben Feldern. Es sollen nur die Werte übertragen werden. Die Namen der Felder sollten dem genügen, es soll also nicht ID basierend sein, die aus dem Origin Formular gewonne Datenstruktur kennt die Felder dem Namen nach und die dazugehörigen Werte.</p>
<p>Problem dabei: Type checkbox, radio, select finden sich nur in der Datenstruktur wenn sie checked/selected sind.</p>
<p>Ich finde einfach keinen Ansatz, Idee?</p>
<p>MFG</p>
https://forum.selfhtml.org/self/2019/mar/3/formularfelder-auf-anderes-formular-uebertragen/1743693#m1743693Felix Riestererhttps://felix-riesterer.de2019-03-03T11:17:55Z2019-03-03T11:17:55ZFormularfelder auf anderes Formular übertragen<p>Lieber pl,</p>
<p>also JavaScript?</p>
<p>Du willst Deiner Beschreibung nach wohl ein Formular in einem neuen Dokument via JavaScript replizieren. Stimmt das so?</p>
<p>Dann sollte das JavaScript die Struktur des Formulars und seine möglichen Optionen (Du schriebst von <code>select</code>-Feldern und Radiobuttons/Checkboxen) kennen, um die "übertragenen" (wie wird übertragen?) Name-Value-Paare korrekt verarbeiten zu können.</p>
<p>Liebe Grüße,</p>
<p>Felix Riesterer.</p>
https://forum.selfhtml.org/self/2019/mar/3/formularfelder-auf-anderes-formular-uebertragen/1743697#m1743697plhttp://rolfrost.de/ddrende.html2019-03-03T11:34:39Z2019-03-03T11:34:39ZFormularfelder auf anderes Formular übertragen<p>Im Grunde genommen brauchen wir ja nur einen Iterator. Die Frage ist nur, worüber der laufen soll </p>
<p>Für FormData gibt es einen, für Formulare jedoch nicht. Man könnte über document.forms[1].elements iterieren und bei jedem Element in die Daten (FormData) schauen ob es einen Eintrag gibt. Nehmen wir mal an die Daten lägen in einem Array vor. Dann müsste man sich aber auch merken welcher Eintrag bereits zugewiesen wurde und welcher nicht. Und schließlich kann es ja auch mehrere textfelder mit demselben Namen geben.</p>
<p>Wird schwierig.</p>
https://forum.selfhtml.org/self/2019/mar/3/formularfelder-auf-anderes-formular-uebertragen/1743699#m1743699Felix Riestererhttps://felix-riesterer.de2019-03-03T13:12:11Z2019-03-03T13:12:11ZFormularfelder auf anderes Formular übertragen<p>Lieber pl,</p>
<p>ich habe noch immer nicht verstanden, was Du genau erreichen willst. Deine Formulierungen sind für mich nicht aussagekräftig genug, um diese Erkenntnis zu ermöglichen. Tut mir leid, dass ich Dir nicht helfen kann.</p>
<p>Liebe Grüße,</p>
<p>Felix Riesterer.</p>
https://forum.selfhtml.org/self/2019/mar/3/formularfelder-auf-anderes-formular-uebertragen/1743705#m1743705plhttp://rolfrost.de/ddrende.html2019-03-03T14:26:03Z2019-03-03T14:26:03ZFormularfelder auf anderes Formular übertragen<p><a href="http://rolfrost.de/struct.dev" rel="nofollow noopener noreferrer">Hier mein Ansatz</a> der schon ganz ordentlich funktioniert. Da bin ich wohl doch auf dem richtigem Weg </p>
https://forum.selfhtml.org/self/2019/mar/3/formularfelder-auf-anderes-formular-uebertragen/1743707#m1743707Bernd2019-03-03T14:47:31Z2019-03-03T14:47:31ZFormularfelder auf anderes Formular übertragen<p>Wenn ich einmal auf Daten übertragen habe, dann mich doch nochmals entscheide etwas anderes zu übertragen werden die Daten unten nicht aktualisiert, nur so als Hinweis.</p>
<p>Für was braucht man so etwas?</p>
https://forum.selfhtml.org/self/2019/mar/3/formularfelder-auf-anderes-formular-uebertragen/1743709#m1743709Felix Riestererhttps://felix-riesterer.de2019-03-03T14:53:12Z2019-03-03T14:53:12ZFormularfelder auf anderes Formular übertragen<p>Lieber pl,</p>
<p>na, dann frohes Schaffen!</p>
<p>Liebe Grüße,</p>
<p>Felix Riesterer.</p>
https://forum.selfhtml.org/self/2019/mar/3/formularfelder-auf-anderes-formular-uebertragen/1743710#m1743710plhttp://rolfrost.de/ddrende.html2019-03-03T15:02:19Z2019-03-03T15:02:19ZFormularfelder auf anderes Formular übertragen<blockquote>
<p>Wenn ich einmal auf Daten übertragen habe, dann mich doch nochmals entscheide etwas anderes zu übertragen werden die Daten unten nicht aktualisiert, nur so als Hinweis.</p>
</blockquote>
<p>Das ist richtig. Hat aber keine Auswirkung, weil der Informationsfluß nur einmal stattfindet.</p>
<blockquote>
<p>Für was braucht man so etwas?</p>
</blockquote>
<p>für <code>xhr.responseType="document"</code> zum Übertragen der Responsedaten in das im DOM vorliegende Formular. Ich muss noch ein bischen testen ob es alle Fälle abdeckt. Sieht bis jetzt ganz gut aus </p>
<p>MFG</p>
https://forum.selfhtml.org/self/2019/mar/3/formularfelder-auf-anderes-formular-uebertragen/1743715#m1743715plhttp://rolfrost.de/ddrende.html2019-03-03T16:17:46Z2019-03-03T16:17:46ZFormularfelder auf anderes Formular übertragen<p>Anwendung siehe Link. Es dient der Entkopplung von JS in Progressive Enhancement. Echt der Hammer! MFG</p>
https://forum.selfhtml.org/self/2019/mar/3/formularfelder-auf-anderes-formular-uebertragen/1743724#m1743724Rolf B2019-03-03T18:29:56Z2019-03-03T18:29:56ZFormularfelder auf anderes Formular übertragen<p>Hallo pl,</p>
<p>wenn ich eine Checkbox ausmache, wird das nicht übertragen. Weil</p>
<ul>
<li>du checked nur setzt, aber nicht rücksetzt</li>
<li>deine Checkboxen alle den gleichen name haben</li>
</ul>
<p><em>Rolf</em></p>
<div class="signature">-- <br>
sumpsi - posui - clusi
</div>
https://forum.selfhtml.org/self/2019/mar/3/formularfelder-auf-anderes-formular-uebertragen/1743726#m1743726plhttp://rolfrost.de/ddrende.html2019-03-03T20:55:40Z2019-03-03T20:55:40ZFormularfelder auf anderes Formular übertragen<p>Und was schlägst Du vor? MFG</p>
https://forum.selfhtml.org/self/2019/mar/3/formularfelder-auf-anderes-formular-uebertragen/1743731#m1743731Rolf B2019-03-03T22:13:56Z2019-03-03T22:13:56ZFormularfelder auf anderes Formular übertragen<p>Hallo pl,</p>
<p>vor dem Übertragen alle Checkboxen entchecken, oder jede Checkbox ins slice-Array, aber mit einem checked-Zustand dabei.</p>
<p>Hast Du schonmal nachgedacht über:</p>
<ul>
<li>aus sampleForm ein assoziatives Array zurückzugeben? Der Feldname ist der Key, und der Wert ist ein Array. Im Array steht an i-ter Position der Zustand des i-ten Feldes mit diesem Name. Dadurch musst Du im slice-Array nicht rumslicen, sondern kannst über Position matchen.</li>
<li>DOM Methoden wie querySelector/querySelectorAll zu benutzen, bspw. um alle form-Elemente mit einem name-Attribut zu finden?</li>
</ul>
<p><em>Rolf</em></p>
<div class="signature">-- <br>
sumpsi - posui - clusi
</div>
https://forum.selfhtml.org/self/2019/mar/3/formularfelder-auf-anderes-formular-uebertragen/1743741#m1743741plhttp://rolfrost.de/ddrende.html2019-03-04T08:21:23Z2019-03-04T08:21:23ZFormularfelder auf anderes Formular übertragen<p>hi <a href="/users/6547" class="mention registered-user" rel="noopener noreferrer">@Rolf B</a></p>
<blockquote>
<p>vor dem Übertragen alle Checkboxen entchecken, oder jede Checkbox ins slice-Array, aber mit einem checked-Zustand dabei.</p>
</blockquote>
<p>Wie ich schon schrieb, das ist nicht erforderlich. Weil die Datenübertragung nur einmal stattfindet und ab diesem Zeitpunkt Geschichte ist.</p>
<blockquote>
<p>Hast Du schonmal nachgedacht über:</p>
<ul>
<li>aus sampleForm ein assoziatives Array zurückzugeben?</li>
</ul>
</blockquote>
<p>Natürlich. Die Funktionen gibt es schon.</p>
<blockquote>
<ul>
<li>DOM Methoden wie querySelector/querySelectorAll zu benutzen, bspw. um alle form-Elemente mit einem name-Attribut zu finden?</li>
</ul>
</blockquote>
<p>Brauchen wir nicht. Weil über <code>document.forms[index].elements</code> iteriert wird. MFG</p>
<p>PS: Du kannst es gerne verbessern und Deine Lösung hier vorstellen.</p>
https://forum.selfhtml.org/self/2019/mar/3/formularfelder-auf-anderes-formular-uebertragen/1743830#m1743830plhttp://rolfrost.de/ddrende.html2019-03-05T09:50:51Z2019-03-05T09:50:51ZFormularfelder auf anderes Formular übertragen<p>moin,</p>
<blockquote>
<ul>
<li>aus sampleForm ein assoziatives Array zurückzugeben?</li>
</ul>
</blockquote>
<p>warum nicht gleich eine FormData Instanz? <code>.getAll()</code> bekommt den Key und liefert ein Array mit den Werten. Damit gänge es auch und auch das Zurückschreiben des Arrays ist möglich (nach dem Löschen zutreffender Werte). Das Löschen ist insofern wichtig als daß Werte nicht mehrfach zugewiesen werden.</p>
<p>MFG</p>
https://forum.selfhtml.org/self/2019/mar/3/formularfelder-auf-anderes-formular-uebertragen/1743759#m1743759Rolf B2019-03-04T11:57:36Z2019-03-04T11:57:36ZFormularfelder auf anderes Formular übertragen<p>Hallo pl,</p>
<blockquote>
<p>Wie ich schon schrieb, das ist nicht erforderlich.</p>
</blockquote>
<p>Ja, sorry, das hatte ich überlesen. Damit ist ein Reset implizit gegeben.</p>
<p><em>Rolf</em></p>
<div class="signature">-- <br>
sumpsi - posui - clusi
</div>
https://forum.selfhtml.org/self/2019/mar/3/formularfelder-auf-anderes-formular-uebertragen/1743761#m1743761plhttp://rolfrost.de/ddrende.html2019-03-04T12:02:59Z2019-03-04T12:02:59ZFormularfelder auf anderes Formular übertragen<p>Wobei ich eher am Überlegen bin, checkboxn, radiobuts und selects aus der Zuweisung rauszunehmen. <a href="http://rolfrost.de/juli.ch" rel="nofollow noopener noreferrer">Für meine Freunde in der Schweiz</a></p>
<p>MFG</p>
https://forum.selfhtml.org/self/2019/mar/3/formularfelder-auf-anderes-formular-uebertragen/1743786#m1743786plhttp://rolfrost.de/ddrende.html2019-03-04T16:50:28Z2019-03-04T16:50:28ZFormularfelder auf anderes Formular übertragen<p>Hi <a href="/users/6547" class="mention registered-user" rel="noopener noreferrer">@Rolf B</a></p>
<blockquote>
<p>Damit ist ein Reset implizit gegeben.</p>
</blockquote>
<p>Mit einem <code>form.reset()</code> ist es übrigens nicht getan. Wenn der Ausgangszustand <code>checked</code> ist, muss da schon ein explizites <code>el.checked = false</code> erfolgen. I.d.R. ändert jedoch eine Response nichts an Checkboxen.</p>
<p>MFG</p>
https://forum.selfhtml.org/self/2019/mar/3/formularfelder-auf-anderes-formular-uebertragen/1743840#m1743840Rolf B2019-03-05T11:55:41Z2019-03-05T11:56:04ZFormularfelder auf anderes Formular übertragen<p>Hallo pl,</p>
<p>das Löschen ist, meine ich, ein mühsamer Umweg um einen ordentlichen Algorithmus herum.</p>
<p>Iteriere über die Keys im Formdata und suche dir pro Key alle form Elemente mit diesem Name (querySelectorAll). Dann kannst du 1:1 übertragen. Natürlich nicht bei Elementen zu deren Identifikation du den value hinzunehmen musst, aber die brauchen eh Sonderbehandlung.</p>
<p><em>Rolf</em></p>
<div class="signature">-- <br>
sumpsi - posui - clusi
</div>
https://forum.selfhtml.org/self/2019/mar/3/formularfelder-auf-anderes-formular-uebertragen/1743841#m1743841plhttp://rolfrost.de/ddrende.html2019-03-05T12:03:29Z2019-03-05T12:03:29ZFormularfelder auf anderes Formular übertragen<p>hi <a href="/users/6547" class="mention registered-user" rel="noopener noreferrer">@Rolf B</a></p>
<blockquote>
<p>das Löschen ist, meine ich, ein mühsamer Umweg um einen ordentlichen Algorithmus herum.</p>
</blockquote>
<p>.shift() ist die Alternative</p>
<blockquote>
<p>Iteriere über die Keys im Formdata</p>
</blockquote>
<p>Nein das wäre ja genau falschherum. Denn es gibt im Ziel-Formular ja Elemente deren Values nicht in der FormData Instanz vorliegen. Ergo muss über die Elemente des Zielformulars iteriert werden.</p>
<p><a href="http://rolfrost.de/struct.dev" rel="nofollow noopener noreferrer">Meine FormData Lösung</a> ist unterdessen soweit funktional. Hab ich was übersehen?</p>
<p>MFG</p>
https://forum.selfhtml.org/self/2019/mar/3/formularfelder-auf-anderes-formular-uebertragen/1743842#m1743842Rolf B2019-03-05T12:28:01Z2019-03-05T12:29:37ZFormularfelder auf anderes Formular übertragen<p>Hallo pl,</p>
<blockquote>
<p>Hab ich was übersehen?</p>
</blockquote>
<p>sieht auf Anhieb nicht so aus.</p>
<blockquote>
<p>Nein das wäre ja genau falschherum.</p>
</blockquote>
<p>Das dachte ich anfangs auch, aber - was machst Du denn mit Elementen des target form, deren name im FormData nicht drin ist?</p>
<p>Die sind im source form nicht enthalten. Entweder sind sie irrtümlich im target form, dann sollte der Irrtum korrigiert werden. Oder sie wurden mit Vorsatz hinzugefügt, und warum sollte man sie dann überschreiben?</p>
<p><em>Rolf</em></p>
<div class="signature">-- <br>
sumpsi - posui - clusi
</div>
https://forum.selfhtml.org/self/2019/mar/3/formularfelder-auf-anderes-formular-uebertragen/1743844#m1743844plhttp://rolfrost.de/ddrende.html2019-03-05T14:12:28Z2019-03-05T14:21:41ZFormularfelder auf anderes Formular übertragen<blockquote>
<p>was machst Du denn mit Elementen des target form, deren name im FormData nicht drin ist?</p>
</blockquote>
<p>Gar nichts. Und wie schon gesagt, die Formulare sind ja identisch, also sind auch die Namen identisch. Synopsis:</p>
<pre><code class="block language-js"><span class="token function">transform</span><span class="token punctuation">(</span>document<span class="token punctuation">.</span>forms<span class="token punctuation">[</span><span class="token number">0</span><span class="token punctuation">]</span><span class="token punctuation">,</span> <span class="token keyword">this</span><span class="token punctuation">.</span>response<span class="token punctuation">.</span>forms<span class="token punctuation">[</span><span class="token number">0</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre>
<p>MFG</p>
https://forum.selfhtml.org/self/2019/mar/3/formularfelder-auf-anderes-formular-uebertragen/1743846#m1743846Rolf B2019-03-05T15:38:23Z2019-03-05T15:38:23ZFormularfelder auf anderes Formular übertragen<p>Hallo pl,</p>
<blockquote>
<p>Gar nichts.</p>
</blockquote>
<p>Sag ich ja! Demnach ist es egal, woher Du die name Werte bekommst.</p>
<p><em>Rolf</em></p>
<div class="signature">-- <br>
sumpsi - posui - clusi
</div>
https://forum.selfhtml.org/self/2019/mar/3/formularfelder-auf-anderes-formular-uebertragen/1743848#m1743848plhttp://rolfrost.de/ddrende.html2019-03-05T16:00:31Z2019-03-05T16:00:31ZFormularfelder auf anderes Formular übertragen<p>Die Idee einer <a href="https://forum.selfhtml.org/self/2019/feb/22/domparser-und-progressive-enhancement/1743166#m1743166" rel="noopener noreferrer">Umkehrfunktion</a> betrachte ich hiermit als machbar. Ich habe nun einige weitere Anwendungen damit modernisiert, progressive Enhancement wird damit zu einer einfachen Sache.</p>
<p>Echt der Hammer </p>
<p>Fazit: Nachdenken lohnt sich immer, reicht aber nicht immer. Man muss es einfach mal machen, erst die Praxis zeigt den Mehrwert.</p>
https://forum.selfhtml.org/self/2019/mar/3/formularfelder-auf-anderes-formular-uebertragen/1743859#m1743859plhttp://rolfrost.de/ddrende.html2019-03-06T08:38:32Z2019-03-06T08:38:32ZFormularfelder auf anderes Formular übertragen<p>Moin,</p>
<p>natürlich kannst Du es auch andersherum machen, nur wird das halt ziemlich umständlich. Beispielsweise könntest Du das Quellformular auf eine FormData Instanz lesen, darüber iterieren und bei jedem Eintrag das Zielformular durchlaufen um zu schauen wo die Daten hinkommen. Bei mehreren Inputfelder mit gleichem Namen oder Optionfelder unter einem Select hättest Du dann prächtig ineinandergeschachtelte Schleifenstrukturen.</p>
<p>MFG</p>
https://forum.selfhtml.org/self/2019/mar/3/formularfelder-auf-anderes-formular-uebertragen/1743872#m1743872Rolf B2019-03-06T14:19:06Z2019-03-06T14:19:41ZFormularfelder auf anderes Formular übertragen<p>Hallo pl,</p>
<p>so viele Schleifen sind es gar nicht - ich habe es jetzt mal gefiddelt und der Code ist im Prinzip identisch, egal wo die Namen her kommen.</p>
<p>Allerdings: Wenn FormData die Quelle ist, brauche ich Reset-Code, um die Eingabefelder mit den Namen, die im FormData mangels Inhalt nicht drinstehen (Checkbox, Radio, Multiselect), vorab zu leeren.</p>
<p>Darum ist's mit dem Form als Namensgeber besser. Die Schleifentiefe ist in meiner Version trotzdem 2 bis 4 (bei Multiselect und Checkbox/Radio ist die tiefste Schleife der include-Aufruf). Das liegt aber daran, dass ich versucht habe, die Programmstruktur auf die logische Datenstruktur zu matchen, nicht auf die phyische Datenstruktur. Der gute alte Michael A. Jackson<sup class="footnote-ref"><a href="#fn1" id="fnref1">[1]</a></sup> hat mir das so beigebracht.</p>
<p>Bei Dir ist sie 1 bis 3, dafür musst Du im FormData herummanipulieren und jede Menge Arraywerte shiften. Die Anzahl der durchlaufenen Schleifenkerne sollte bei Dir und mir aber gleich sein, weil wir ja gleich viele Elemente verarbeiten :). Deine innerste for-Schleife bei select und checkbox könntest Du übrigens ebenfalls durch vals.includes(...) ersetzen, und type="select" kannst Du analog zu text/textarea behandeln, da kann man einfach den value zuweisen.</p>
<p>Fiddle: <a href="https://jsfiddle.net/Rolf_b/cgn3vwey/" rel="noopener noreferrer">https://jsfiddle.net/Rolf_b/cgn3vwey/</a></p>
<p><em>Rolf</em></p>
<div class="signature">-- <br>
sumpsi - posui - clusi
</div>
<hr class="footnotes-sep">
<section class="footnotes">
<ol class="footnotes-list">
<li id="fn1" class="footnote-item"><p>nicht zu verwechseln mit Michael "Pädo" J. Jackson! <a href="#fnref1" class="footnote-backref">↩︎</a></p>
</li>
</ol>
</section>
https://forum.selfhtml.org/self/2019/mar/3/formularfelder-auf-anderes-formular-uebertragen/1743875#m1743875plhttp://rolfrost.de/ddrende.html2019-03-06T14:51:17Z2019-03-06T14:53:33ZFormularfelder auf anderes Formular übertragen<p>Sieht gut aus! Ich meine die Funktionalität, nicht den Code. Switches sind auch nicht so mein Ding. Hab ich noch nie gebraucht </p>
<p>.-.-.</p>