How to get a collection of input elements by name attribute

Question

I've got a form which looks like that:

<form method="post" enctype="multipart/form-data" onsubmit="return new_post_form_submit();">    
<input type="hidden" name="task" value="addPost">   
<input type="hidden" name="post_photo_edit[]" value="0">    
<input type="hidden" name="post_photo_edit[]" value="0">
<input type="hidden" name="post_photo_edit[]" value="0">
 ... 
</form>

Inside new_post_form_submit function, I would like to select all the elements named post_photo_edit as a collection. As You can see it name actually is post_photo_edit[] , because I want to have it as an array inside my PHP code.

I'm using MooTools, but probably jQuery will have exactly the same solution for this.

I've tried to call

$$("input[name='post_photo_edit[]']")

but it gave me an exception. And calling it this way:

$$("input[name='post_photo_edit']")

returns empty collection.

I know I can call this instead

document.getElementsByName("post_photo_edit[]")

and it will work perfect, but I'm wondering how this expression should look like in MooTools to work like this above.

any ideas?

Answer 1

Function: $$

Selects and extends DOM elements. Return an Elements instance. The Element instance returned is an array-like object, supporting every Array method and every Element method.

Syntax:

var myElements = $$(argument);

Arguments:

• selector - (string) A CSS selector
• elements - (elements), (collection) or (array) An enumerable list of elements
• element, element - (element) any number of elements as arguments

Returns:

• (elements) - An array-like Elements collection of all the DOM elements matched, extended with document:id.

So you should use: $$(document.getElementsByName("post_photo_edit[]"));

CSS3 supports character escaping, so you can use backslashes to escape characters:

But you can also escape the array operator like this: $$("input[name=post_photo_edit\\[\\]]")

Answer 2

Not sure about MooTools, but to select every elemnt that has an attribute which BEGINS with something, you do this:

$('input[name^="post_photo_edit"]')

You can check it out here: jQuery starts With Selector

Answer 3

you should use attribute starts with selector . It's same on MooTools