Html Frage zu Formularen

Bierseppi · 12. Februar 2015

Hallo,
ich bin in der Welt von Html neu und kenne mich eigentlich nur mit "normalen" Programmiersprachen(C, C++, C# usw.), sofern man Html als solche bezeichnen will, aus.

Ich sollte nun ein Formular abändern, sodass man die Variablen Namen, welche man mit dem Wert übergibt, ändern kann.
Es sollen also 2 Input Felder nebeneinander sein, wobei man im Ersten nur den Variablen Namen für das Zweite eingibt.
Hab ich nun beide in einem Formular, dann hab ich das Problem, dass auch von Feld 1 der Wert und Name übertragen wird.
Gibt es eine Möglichkeit dies zu unterbinden?

Beste Grüße

Bierseppi

Ap0ll0XT · 12. Februar 2015

Nur, wenn du das Formular mit Javascript absendest und über das Script den Wert des Name-Attributs für die Eingabefelder änderst: SELFHTML: JavaScript / Sprachelemente / Event-Handler

Dann kannst du den Wert von Name damit ändern: SELFHTML: JavaScript / Objektreferenz / elements

PS: Du solltest dabei mit 2 Formularen arbeiten. Zum einen das Formular, das abgesendet werden soll und einmal das Formular mit den Variablen-Werten. Ansonsten sendest du alles auf einmal mit. Du kannst sie in 2 DIV-Containern mit float left/right nebeneinander positionieren.

Rho · 12. Februar 2015

Gibt verschiedene Möglichkeiten, je nachdem, was man genau erreichen will. Eine Möglichkeit wäre, per JavaScript das Formular dynamisch zu erstellen und dann abzuschicken. Damit erreicht man exakt das gleiche Verhalten wie bei einem normalen, statischen Formular.

HTML:

<!doctype html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Dynamic Form</title>
    </head>
    <body>
        <p>Name: <input type="text" id="name"></p>
        <p>Value: <input type="text" id="value"></p>
        <p><button type="button">Send</button></p>

        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
        <script>
            $(document).ready(function () {
                $('button').click(function () {
                    var name = $('#name').val(),
                        value = $('#value').val(),
                        form = $('<form action="http://example.com/" method="POST"><input type="text" name="' + name + '" value="' + value + '"></form>');

                    form.hide().appendTo($(document.body));
                    form.submit();
                });
            });
        </script>
    </body>
</html>

Ap0ll0XT · 13. Februar 2015

Rho schrieb:

Gibt verschiedene Möglichkeiten, je nachdem, was man genau erreichen will. Eine Möglichkeit wäre, per JavaScript das Formular dynamisch zu erstellen und dann abzuschicken. Damit erreicht man exakt das gleiche Verhalten wie bei einem normalen, statischen Formular.

HTML:

<!doctype html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Dynamic Form</title>
    </head>
    <body>
        <p>Name: <input type="text" id="name"></p>
        <p>Value: <input type="text" id="value"></p>
        <p><button type="button">Send</button></p>

        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
        <script>
            $(document).ready(function () {
                $('button').click(function () {
                    var name = $('#name').val(),
                        value = $('#value').val(),
                        form = $('<form action="http://example.com/" method="POST"><input type="text" name="' + name + '" value="' + value + '"></form>');

                    form.hide().appendTo($(document.body));
                    form.submit();
                });
            });
        </script>
    </body>
</html>

So geht es natürlich auch. Wobei das in diesem Falle ja schon JQuery ist. Da ist es fraglich, ob die ganze JQuery-Bibliothek nötig ist, um diesen Zweck zu erfüllen. Aber das muss er sowieso selbst entscheiden.

Bierseppi · 13. Februar 2015

Vielen Dank für eure Hilfe!

Ich werde mich mal in JScript einarbeiten und das dann mit 2 Formularen machen.
Dieser Ansatz ist glaub ich der einfachste für mich, da ich bereits ein Formular habe, in dem die Sachen geändert werden müssen.
So kann ich dann am einfachsten meinen Ansatz verfolgen und den "Link" mit Javaskript zusammenbasteln

Beste Grüße

Bierseppi

Rho · 13. Februar 2015

Ap0ll0XT schrieb:
Da ist es fraglich, ob die ganze JQuery-Bibliothek nötig ist, um diesen Zweck zu erfüllen.

Nötig natürlich nicht, aber dafür sehr bequem. Noch dazu, wenn man, wie ich, nicht sehr erfahren in DOM-Manipulationen ist. Aber, wie gesagt, es gibt hier viele Lösungsvarianten. Eventuell wird jQuery in dem Projekt ja ohnehin schon verwendet.

Bierseppi schrieb:
Ich werde mich mal in JScript einarbeiten und das dann mit 2 Formularen machen. Dieser Ansatz ist glaub ich der einfachste für mich, da ich bereits ein Formular habe, in dem die Sachen geändert werden müssen.

Du kannst (mit jQuery) bei vorhandenen Formularen auch sehr einfach dynamisch Fehlder hinzufügen und entfernen. So könnte man sich ein zweites Formular sparen. Das dynamisch erzeugte Feld wird einfach hinzugefügt und die beiden Felder, die Name und Wert angeben, können aus dem Formular entfernt werden und werden somit auch nicht übermittelt.

DarkMo · 19. Februar 2015

dat geht natürlich auch mit normalem js ^^ kannst dich noch an boss3d's html/php ding da erinnern? da hatte ich glaube auch mal sone version gepostet. zumindest hatte ich es selber für mich so umgesetzt und ich hab keinerlei ahnung von sowas wie jquerry ^^

Ap0ll0XT · 19. Februar 2015

Ich bin der Meinung, das JQuery das Arbeiten mit Javascript durchweg verwessert, wenn es auch für die kleinsten Funktionen genutzt wird. Das geht stellenweise soweit, das ich von anderen um Hilfe gebeten werde, weil sie zwar mit JQuery, aber nicht mehr mit Javascript komplett arbeiten können. Gerade das Frameworkdesign sorgt bei einigen wohl für leichte Verwirrung, wenn man dann wieder JS-Native schreiben will :lol:

Rho · 19. Februar 2015

Aussagen wie, Code, der jQuery verwendet, sei kein normales JavaScript und die Verwendung von jQuery verwässere das Arbeiten mit JavaScript, halte ich für an den Haaren herbeigezogen und schlichtweg falsch. Mal davon abgesehen, habe ich aber mehr als deutlich zum Ausdruck gebracht, dass es sich bei dem Beispiel lediglich um eine Variante von vielen Handelt und man das Gleiche natürlich auch ohne Zuhilfenahme von jQuery lösen kann. Falls jQuery aber bereits im Projekt Verwendung finden sollte, ist absolut nichts Anrüchiges daran, sich den Komfort dessen Nutzung zu gönnen. Falls dem nicht so ist und wirklich nichts weiter als das vom TE beschriebene Verhalten benötigt wird, gibt es natürlich keinen zwingenden Grund für den Einsatz von jQuery und man kann sich überlegen, darauf zu verzichten.

Dass hier aber dermaßen massiv gegen die Nutzung von etwas, das nicht mehr als eine praktische Sammlung von hilfreichen Funktionen und Objekten ist, vorgegangen wird, ist für mich nicht nachvollziehbar. Im Übrigen ist auch Code der jQuery verwendet natives JavaScript und nicht irgendetwas abstrakt Entstelltes oder was für eine Vorstellung auch immer da in euren Köpfen herumgeistert. Mit dieser Einstellung könnte man eigentlich gleich auf sämtliche Code-Bibliotheken verzichten und das Rad immer wieder neu erfinden.

@DarkMo: Interessant, dass du in dem Zusammenhang ausgerechnet das Boss3d-Projekt erwähnst. Das war ja mal mit Abstand die größte Stümperei, die mir seit Langem über den Weg gelaufen ist. Daran hätte aber zugegebenermaßen auch die Verwendung von jQuery nichts mehr geändert.

DarkMo · 20. Februar 2015

ich wusste doch, du erinnerst dich dran

er wollte ja auch dynamisch eingabefelder hinzufügen/löschen können, da hatte ich eine lösung mit js gezeigt. am ende hatte er es aber glaube mit php gelöst. halt jedesmal erneut ein seitenaufbau. deswegen fiel mir gerade das bsp ein ^^

Ap0ll0XT · 20. Februar 2015

Rho schrieb:
Dass hier aber dermaßen massiv gegen die Nutzung von etwas, das nicht mehr als eine praktische Sammlung von hilfreichen Funktionen und Objekten ist, vorgegangen wird, ist für mich nicht nachvollziehbar.

Ist ja auch kein Wunder. Das liegt daran, das du ein massives Gegenangehen siehst, wo keines ist. Du verstehst eine auf das Thema des TE bezogene Aussage als pauschalisierte Allgemeinaussage.

Der TE hat mit Javascript noch keine Erfahrung. Und bevor man laufen lernt, sollte man erstmal vernünftig gehen können. Ich habe nichts gegen JQuery. Ich nutze es selbst vor allem bei RIA-Anwednungen besonders mit JQueryUI/Mobile zusammen. Und das JQuery in JS geschrieben ist und die Grundlegende Syntax von JS verwendet, ist mir ebenfalls nicht neu. Man schreibt die Lösungen mit JQuery trotzdem komplett anders. Das Code-Design ist anders. Und man darf auch nicht vergessen, das man auch ein wenig Overhead mit sich rumschleppt. JQuery ist auf jeden Fall eine sehr nützliche Bibliothek. Man sollte aber als JS-Anfänger nicht damit beginnen.

PS: Und ob JQuery sowieso in dem Projekt verwendet wird, wissen wir ebenfalls noch nicht. Aber wenn es verwendet wird, dann kann er es auch nutzen. Dann spricht nichts dagegen. Vor allem, wenn er sich sowieso nicht mit JS auseinandersetzen wollen würde.

Html Frage zu Formularen

Bierseppi

PCGH-Community-Veteran(in)

Ap0ll0XT

Guest

Rho

Guest

Ap0ll0XT

Guest

Bierseppi

PCGH-Community-Veteran(in)

Rho

Guest

DarkMo

Lötkolbengott/-göttin

Ap0ll0XT

Guest

Rho

Guest

DarkMo

Lötkolbengott/-göttin

Ap0ll0XT

Guest

Ähnliche Themen