Maison >interface Web >js tutoriel >jQuery résout la soumission de formulaire avec trop d'entrées_jquery
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++ })})
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 :
<?php $num = 0; //初始化计数变量 $_REQUEST[‘val'.$num]; $num++; //插入到需要获取值的地方,每个需要获取传值的地方重复使用这串代码即可 ?>
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.