HTML formulaire d'entrée tag nom élément tableau avec JavaScript

Question

Ceci est une question en deux parties. Quelqu'un a répondu à une question similaire l'autre jour (qui contenait également des informations sur ce type de tableau en PHP), mais je ne peux pas le trouver.

1.) Tout d'abord, quelle est la terminologie correcte pour un tableau créé à la fin de l'élément name d'un tag d'entrée dans un formulaire?

<form> 

    <input name="p_id[]" value="0"/> 
    <input name="p_id[]" value="1"/> 
    <input name="p_id[]" value="2"/> 

</form> 

2.) Comment obtenir les informations de ce tableau avec JavaScript? Plus précisément, je veux juste maintenant compter les éléments du tableau. Voici ce que j'ai fait, mais ça ne marche pas.

function form_check(){ 
    for(var i = 0; i < count(document.form.p_id[]); i++){ //Error on this line 

     if (document.form.p_name[i].value == ''){ 
      window.alert('Name Message'); 
      document.form.p_name[i].focus(); 
      break; 
     } 

     else{ 
      if (document.form.p_price[i].value == ''){ 
       window.alert('Price Message'); 
       document.form.p_price[i].focus(); 
       break; 
      } 

      else{ 
       update_confirmation(); 
      } 
     } 
    } 
} 

Answer 1

1.) Tout d'abord, quelle est la terminologie correcte pour un tableau créé à la fin du e nom de l'élément d'une balise d'entrée dans un formulaire?

« oftimes Confondre PHPism »

En ce qui concerne JavaScript concerne un tas de contrôles de formulaire avec le même nom sont juste un tas de contrôles de formulaire avec le même nom, et les contrôles de formulaire avec des noms qui comprennent carré Les parenthèses ne sont que des contrôles de formulaire avec des noms qui incluent des crochets.

La convention de nommage de PHP pour les contrôles de formulaire avec le même nom est parfois utile (lorsque vous avez un certain nombre de groupes de contrôles afin que vous puissiez faire des choses comme ceci:

<input name="name[1]"> 
<input name="email[1]"> 
<input name="sex[1]" type="radio" value="m"> 
<input name="sex[1]" type="radio" value="f"> 

<input name="name[2]"> 
<input name="email[2]"> 
<input name="sex[2]" type="radio" value="m"> 
<input name="sex[2]" type="radio" value="f"> 

) mais ne confondez pas certaines personnes. D'autres langues ont adopté la convention depuis que celle-ci a été écrite à l'origine, mais généralement seulement comme une caractéristique optionnelle. Par exemple, via this module for JavaScript.

2.) Comment obtenir les informations de ce tableau avec JavaScript?

Il ne reste plus qu'à obtenir la propriété portant le même nom que le contrôle de formulaire de elements. L'astuce est que puisque le nom des contrôles de formulaire comprend des crochets, vous ne pouvez pas utiliser dot notation and have to use square bracket notation comme tout autre JavaScript property name that includes special characters.

Puisque vous avez plusieurs éléments avec ce nom, ce sera une collection plutôt qu'un seul contrôle, donc vous pouvez faire une boucle avec une boucle standard qui utilise sa propriété length.

var myForm = document.forms.id_of_form; 
var myControls = myForm.elements['p_id[]']; 
for (var i = 0; i < myControls.length; i++) { 
    var aControl = myControls[i]; 
} 

Answer 2

document.form.p_id.length ... pas compte().

Vous devriez vraiment donner à votre forme d'un identifiant

<form id="myform"> 

Reportez-vous ensuite à l'aide:

var theForm = document.getElementById("myform"); 

ensuite référence aux éléments tels que:

for(var i = 0; i < theForm.p_id.length; i++){ 

Answer 3

Essayez ce quelque chose comme ceci:

var p_ids = document.forms[0].elements["p_id[]"]; 
alert(p_ids.length); 
for (var i = 0, len = p_ids.length; i < len; i++) { 
    alert(p_ids[i].value); 
} 

Answer 4

Pour répondre à vos questions dans l'ordre:
1) Il n'y a pas de nom spécifique pour cela. Ce sont simplement des éléments multiples avec le même nom (et dans ce cas le type aussi). Le nom n'est pas unique, c'est pourquoi ID a été inventé (il est supposé être unique).
2)

 
function getElementsByTagAndName(tag, name) { 
    //you could pass in the starting element which would make this faster 
    var elem = document.getElementsByTagName(tag); 
    var arr = new Array(); 
    var i = 0; 
    var iarr = 0; 
    var att; 
    for(; i < elem.length; i++) { 
     att = elem[i].getAttribute("name"); 
     if(att == name) { 
      arr[iarr] = elem[i]; 
      iarr++; 
     } 
    } 
    return arr; 
} 

Answer 5

Voici quelques PHP et le code de démonstration JavaScript qui montre un moyen simple de créer des champs indexés sur un formulaire (les champs qui ont le même nom), puis de les traiter à la fois JavaScript et PHP. Les champs doivent avoir des noms "ID" et des noms "NAME". Javascript utilise l'identifiant et PHP utilise le nom.

<?php 
// How to use same field name multiple times on form 
// Process these fields in Javascript and PHP 
// Must use "ID" in Javascript and "NAME" in PHP 
echo "<HTML>"; 
echo "<HEAD>"; 
?> 
<script type="text/javascript"> 
function TestForm(form) { 
// Loop through the HTML form field (TheId) that is returned as an array. 
// The form field has multiple (n) occurrences on the form, each which has the same name. 
// This results in the return of an array of elements indexed from 0 to n-1. 
// Use ID in Javascript 
var i = 0; 
document.write("<P>Javascript responding to your button click:</P>"); 
for (i=0; i < form.TheId.length; i++) { 
    document.write(form.TheId[i].value); 
    document.write("<br>"); 
} 
} 
</script> 
<?php 
echo "</HEAD>"; 
echo "<BODY>"; 
$DQ = '"'; # Constant for building string with double quotes in it. 

if (isset($_POST["MyButton"])) { 
    $TheNameArray = $_POST["TheName"]; # Use NAME in PHP 
    echo "<P>Here are the names you submitted to server:</P>"; 
    for ($i = 0; $i <3; $i++) { 
    echo $TheNameArray[$i] . "<BR>"; 
    } 
} 
echo "<P>Enter names and submit to server or Javascript</P>"; 
echo "<FORM NAME=TstForm METHOD=POST ACTION=" ; 
echo $DQ . "TestArrayFormToJavascript2.php" . $DQ . "OnReset=" . $DQ . "return allowreset(this)" . $DQ . ">"; 
echo "<FORM>"; 
echo "<INPUT ID = TheId NAME=" . $DQ . "TheName[]" . $DQ . " VALUE=" . $DQ . "" . $DQ . ">"; 
echo "<INPUT ID = TheId NAME=" . $DQ . "TheName[]" . $DQ . " VALUE=" . $DQ . "" . $DQ . ">"; 
echo "<INPUT ID = TheId NAME=" . $DQ . "TheName[]" . $DQ . " VALUE=" . $DQ . "" . $DQ . ">"; 
echo "<P><INPUT TYPE=submit NAME=MyButton VALUE=" . $DQ . "Submit to server" . $DQ . "></P>"; 
echo "<P><BUTTON onclick=" . $DQ . "TestForm(this.form)" . $DQ . ">Submit to Javascript</BUTTON></P>"; 
echo "</FORM>"; 
echo "</BODY>"; 
echo "</HTML>";