Question

63

HTML form input tag name element array with JavaScript

rated 0 times [ 68] [ 5] / answers: 1 / hits: 179946 / 14 Years ago, tue, july 13, 2010, 12:00:00

This is a two part question. Someone answered a similar question the other day (which also contained info about this type of array in PHP), but I cannot find it.

1.) First off, what is the correct terminology for an array created on the end of the name element of an input tag in a form?

<form>



    <input name=p_id[] value=0/>

    <input name=p_id[] value=1/>

    <input name=p_id[] value=2/>



</form>

2.) How do I get the information from that array with JavaScript? Specifically, I am right now just wanting to count the elements of the array. Here is what I did but it isn't working.

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();

            }

        }

    }

}

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

chelseyn

Add To Favorites

Follow

Total Points: 36

Total Questions: 85

Total Answers: 89

Location: Laos

Member since Fri, Sep 11, 2020

4 Years ago

chelseyn questions

1 How to implement material-ui Snackbar as a global function?

Mon, Nov 9, 20, 00:00, 4 Years ago

1 React + Ionic 5: Tab navigation problems

Tue, Mar 10, 20, 00:00, 4 Years ago

1 Want to convert a nested object to query parameter for attaching to url

Thu, May 16, 19, 00:00, 5 Years ago

1 How to enable right-click with Electron BrowserWindow and BrowserView?

Fri, Mar 15, 19, 00:00, 5 Years ago

1 FormArray - How to pass a string array to it?

Sat, Nov 3, 18, 00:00, 6 Years ago

View All

answered 14 Years ago kayap · Accepted Answer

1.) First off, what is the correct terminology for an array created on the end of the name element of an input tag in a form?

Oftimes Confusing PHPism

As far as JavaScript is concerned a bunch of form controls with the same name are just a bunch of form controls with the same name, and form controls with names that include square brackets are just form controls with names that include square brackets.

The PHP naming convention for form controls with the same name is sometimes useful (when you have a number of groups of controls so you can do things like this:

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

) but does confuse some people. Some other languages have adopted the convention since this was originally written, but generally only as an optional feature. For example, via this module for JavaScript.

2.) How do I get the information from that array with JavaScript?

It is still just a matter of getting the property with the same name as the form control from elements. The trick is that since the name of the form controls includes square brackets, you can't use dot notation and have to use square bracket notation just like any other JavaScript property name that includes special characters.

Since you have multiple elements with that name, it will be a collection rather then a single control, so you can loop over it with a standard for loop that makes use of its length property.

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];

}