Maison > interface Web > js tutoriel > jQuery résout la soumission de formulaire avec trop d'entrées_jquery

jQuery résout la soumission de formulaire avec trop d'entrées_jquery

WBOY
Libérer: 2016-05-16 15:46:01
original
1129 Les gens l'ont consulté

Récemment, j'ai reçu une demande plutôt étrange. L'autre partie a demandé d'ajouter un formulaire sous forme de mot au site Web de l'entreprise que les utilisateurs pourraient remplir et soumettre en ligne.

En regardant bien, le formulaire comporte plus d'une centaine de champs, ce qui fait assez peur. Si vous remplissez manuellement l'identifiant et le nom de chaque entrée, ce serait un travail physique terrible.

Après y avoir réfléchi encore et encore, afin d'éviter d'avoir à remplir l'identifiant et le nom d'entrée un par un, j'ai décidé d'utiliser JS et PHP pour résoudre la série de tâches de soumission de ce formulaire.

Composants du formulaire

Le formulaire suit d'abord les exigences du client, et les formulaires et options à remplir sont disposés selon le prototype du document Word pour le rendre cohérent avec l'expérience utilisateur, comme indiqué ci-dessous :

(L'image ci-dessus n'est qu'une petite partie du formulaire à titre d'exemple. En fait, ce formulaire est extrêmement grand)

Une fois la mise en page HTML du formulaire terminée, nous devons commencer à définir l'identifiant et le nom de l'entrée de ces formulaires pour la soumission du formulaire.

Comme mentionné dans la préface, il y a beaucoup d'entrées, nous utilisons donc JS ici pour ajouter automatiquement l'identifiant et le nom aux entrées. Le code est le suivant (méthode jquery) :

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

Après le traitement via js, toutes les entrées sur la page ajouteront automatiquement l'identifiant et le nom en augmentant de 1. À ce stade, ce formulaire peut être utilisé normalement. (Je ne vais pas l'expliquer, tous les programmeurs le comprennent.)

Partie du formulaire GET

OK, le formulaire peut être soumis au programme PHP pour un traitement normal. Bien entendu, la méthode ci-dessus est également applicable à tout type de programme Web, tel que .net, jsp, asp, etc...

L'étape suivante consiste à démonter la chaîne soumise pour obtenir la valeur dans le formulaire. Cet article n'expliquera pas comment obtenir la valeur transmise du formulaire.

Comme il y a également N valeurs transmises depuis le formulaire, il nous est impossible d'écrire les variables du tableau une par une pour obtenir ces valeurs, nous devons donc également utiliser certaines méthodes pour les traiter ici.

D’accord, passons aux choses sérieuses. Tout d'abord, réfléchissons à la façon d'incrémenter chacun de ces tableaux de 1 selon la logique du programme js précédent pour obtenir la sortie du tableau.

Le code du programme est le suivant :

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

Copier après la connexion

Cet ensemble de codes est principalement utilisé lorsque l'ordre de saisie du formulaire et de demande est cohérent. Si l'ordre ne peut pas correspondre un par un, une confusion se produira. Il faut donc être prudent lors de son utilisation !

Lors de la soumission à la base de données, vous pouvez envisager d'utiliser foreach pour traiter les paramètres obtenus dans un tableau, puis l'insérer dans la base de données. Ce sera plus pratique.

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal