jQuery löst die Formularübermittlung mit zu vielen inputs_jquery

Kürzlich erhielt ich eine ziemlich seltsame Anfrage der anderen Partei mit der Bitte, ein wortähnliches Formular zur Unternehmenswebsite hinzuzufügen, damit Benutzer es online ausfüllen und einreichen können.

Wenn man genau hinschaut, hat das Formular mehr als hundert Felder, was ziemlich beängstigend ist. Wenn Sie die ID und den Namen für jede Eingabe manuell eingeben würden, wäre das eine schreckliche körperliche Arbeit.

Nachdem ich immer wieder darüber nachgedacht hatte, entschied ich mich, JS und PHP zu verwenden, um die Reihe der Übermittlungsaufgaben dieses Formulars zu lösen, um zu vermeiden, dass ich die Eingabe-ID und den Namen einzeln eingeben muss.

Formularkomponenten

Das Formular folgt zunächst den Anforderungen des Kunden, und die Formulare und Optionen, die ausgefüllt werden müssen, werden entsprechend dem Prototyp des Word-Dokuments angeordnet, um es mit der Benutzererfahrung in Einklang zu bringen, wie unten gezeigt:

(Das obige Bild ist nur ein kleiner Teil des Formulars als Beispiel. Tatsächlich ist dieses Formular extrem groß)

Nachdem das HTML-Layout des Formulars fertiggestellt ist, müssen wir damit beginnen, die ID und den Namen der Eingabe dieser Formulare für die Formularübermittlung festzulegen.

Wie im Vorwort erwähnt, gibt es viele Eingaben, daher verwenden wir hier JS, um den Eingaben automatisch ID und Namen hinzuzufügen. Der Code lautet wie folgt (jquery-Methode):

$(document).ready(function(){
var inputNum = 0;
$(‘input').each(function(){
$(this).attr({name:‘val'+inputNum,id:‘val'+inputNum});
inputNum++
})})

Nach der Verarbeitung durch js werden bei allen Eingaben auf der Seite automatisch ID und Name hinzugefügt, indem sie um 1 erhöht werden. An dieser Stelle kann dieses Formular grundsätzlich normal verwendet werden. (Ich werde es nicht erklären, alle Programmierer verstehen es.)

GET-Teil bilden

OK, das Formular kann zur normalen Verarbeitung an das PHP-Programm gesendet werden. Natürlich ist die obige Methode auch auf jede Art von Webprogramm anwendbar, z. B. .net, JSP, ASP usw.

Der nächste Schritt besteht darin, die übermittelte Zeichenfolge zu zerlegen, um den Wert im Formular zu erhalten. In diesem Artikel wird nicht erklärt, wie man den übergebenen Wert des Formulars erhält.

Da auch N Werte aus dem Formular übergeben werden, ist es für uns unmöglich, Array-Variablen einzeln zu schreiben, um diese Werte zu erhalten. Daher müssen wir hier auch einige Methoden verwenden, um mit ihnen umzugehen.

Okay, kommen wir zur Sache. Lassen Sie uns zunächst darüber nachdenken, wie jedes dieser Arrays gemäß der vorherigen js-Programmlogik um 1 erhöht werden kann, um die Ausgabe des Arrays zu erreichen.

Der Programmcode lautet wie folgt:

<&#63;php
$num = 0; //初始化计数变量
$_REQUEST[‘val'.$num]; $num++; //插入到需要获取值的地方，每个需要获取传值的地方重复使用这串代码即可
&#63;>

Dieser Satz von Codes wird hauptsächlich verwendet, wenn die Reihenfolge der Formulareingabe und -anfrage konsistent ist. Wenn die Reihenfolge nicht einzeln übereinstimmen kann, kommt es zu Verwirrung. Daher ist bei der Verwendung Vorsicht geboten!

Beim Senden an die Datenbank können Sie erwägen, die erhaltenen Parameter mit foreach in ein Array zu verarbeiten und es dann in die Datenbank einzufügen.