HTML форма ввода тега имени элемента массива с JavaScript

Question

Это вопрос из двух частей.Кто-то ответил на аналогичный вопрос на днях (который также содержал информацию о массиве этого типа в PHP), но я не могу его найти.

1.) Прежде всего, какова правильная терминология для массива, созданного наконец элемента name входного тега в форме?

<form>

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

</form>

2.) Как получить информацию из этого массива с помощью JavaScript?В частности, я сейчас просто хочу посчитать элементы массива.Вот что я сделал, но это не работает.

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.) Во-первых, какова правильная терминология для массива, созданного в конце элемента name входного тега в форме?

"Oftimes Confusion PHPism"

Что касается JavaScript, то группа элементов управления с одним и тем же именем - это просто группа элементов управления с одинаковым именем, а элементы управления с именами, содержащими квадратные скобки, являются просто элементами управления с именами, которые включаютквадратные скобки.

Соглашение об именовании в PHP для элементов управления с одним и тем же именем иногда полезно (если у вас есть несколько групп элементов управления, поэтому вы можете делать что-то вроде этого:

<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">

) но смущает некоторых людей.Некоторые другие языки приняли соглашение, так как оно было изначально написано, но, как правило, только в качестве дополнительной функции.Например, через этот модуль для JavaScript .

2.) Как получить информацию из этого массива с помощью JavaScript?

Все еще остается вопрос получения свойства с тем же именем, что и элемент управления формы из elements.Хитрость заключается в том, что, поскольку имя элементов управления формы включает квадратные скобки, вы не можете использовать точечную нотацию и должны использовать квадратную скобку , как и любое другое имя свойства JavaScript, содержащее специальные символы .

Поскольку у вас есть несколько элементов с таким именем, это будет коллекция, а не один элемент управления, поэтому вы можете зациклить его с помощью стандартного цикла for, который использует его свойство 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

Попробуйте что-то вроде этого:

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 3

document.form.p_id.length ... not count ().

Вы действительно должны указать для своей формы идентификатор

<form id="myform">

Затем обратитесь к нему, используя:

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

Затем обратитесь к таким элементам, как:

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

Answer 4

Чтобы ответить на ваши вопросы по порядку:
1) Для этого нет конкретного имени. Это просто несколько элементов с одинаковым именем (и в данном случае также с типом). Имя не уникально, поэтому был изобретен идентификатор (он должен быть уникальным).
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 &lt elem.length; i++) {
        att = elem[i].getAttribute("name");
        if(att == name) {
            arr[iarr] = elem[i];
            iarr++;
        }
    }
    return arr;
}

Answer 5

Вот некоторый демонстрационный код PHP и JavaScript, который показывает простой способ создания индексированных полей в форме (поля с одинаковым именем), а затем обрабатывает их как в JavaScript, так и в PHP.Поля должны иметь как имена «ID», так и имена «NAME».Javascript использует идентификатор, а PHP использует имя.

<?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>";