HTML: Radio Button Array

Question

Ok, so, I have a different kind of problem when dealing with Radio button arrays than the other threads.

I want to have it so that, depending on the answer selected, the value is saved on a different Array, yet I don't want to have the user being able to select more than one option from the same question.

Example:

Question 1
<input type="radio" name="Array1[]" value="question1"/>
<input type="radio" name="Array2[]" value="question1"/>
<input type="radio" name="Array3[]" value="question1"/>
<input type="radio" name="Array4[]" value="question1"/>

Question 2
<input type="radio" name="Array1[]" value="question2"/>
<input type="radio" name="Array2[]" value="question2"/>
<input type="radio" name="Array3[]" value="question2"/>
<input type="radio" name="Array4[]" value="question2"/>

The purpose of this is so that I can arrange the questions themselves in one of 4 categories, and fill each array with the questions that got assigned to them.

Example:

Assuming 4 questions, and the answers being 1, 3, 1, 2, the resulting arrays I want would be:

Array1[0] = "question1"
Array1[1] = "question3"

Array2[0] = "question4"

Array3[0] = "question3"

Array4[] = Empty array

Can this be done or do I need a different approach to attain the desired output? I plan to process this form using PHP by the way.

EDIT: Some more details. An example usage.

<h1>What are your preferences?</h1>
<form type=...etc.>
    <label>Cats</label>
    <input type="radio" name="Love[]" value="Cats"/>
    <input type="radio" name="Like[]" value="Cats"/>
    <input type="radio" name="Dislike[]" value="Cats"/>
    <input type="radio" name="Hate[]" value="Cats"/>
    <label>Dogs</label>
    <input type="radio" name="Love[]" value="Dogs"/>
    <input type="radio" name="Like[]" value="Dogs"/>
    <input type="radio" name="Dislike[]" value="Dogs"/>
    <input type="radio" name="Hate[]" value="Dogs"/>
    <label>Ferrets</label>
    <input type="radio" name="Love[]" value="Ferrets"/>
    <input type="radio" name="Like[]" value="Ferrets"/>
    <input type="radio" name="Dislike[]" value="Ferrets"/>
    <input type="radio" name="Hate[]" value="Ferrets"/>
    <label>Turtles</label>
    <input type="radio" name="Love[]" value="Turtles"/>
    <input type="radio" name="Like[]" value="Turtle"/>
    <input type="radio" name="Dislike[]" value="Turtles"/>
    <input type="radio" name="Hate[]" value="Turtles"/>
<form>

Solution 1

I think you'll need to come at it from the other direction, something like this

<label>Cats</label>
<input type="radio" name="Cats" value="Love"/> Love
<input type="radio" name="Cats" value="Like"/> Like
<input type="radio" name="Cats" value="Dislike"/> Dislike 
<input type="radio" name="Cats" value="Hate"/> Hate

and on the server side, something like:

$loves=array();
$likes=array();
$dislikes=array();
$hates=array();

then iterate through $_POST, checking the value and, if it matches any of the four you expect, pushing the name into the appropriate array.

Solution 2

You can only select one radio button per name, so if you have different names (as you do) users will be able to select more than one radio button per question. I'm sorry to say, but what you are proposing won't work. Instead you will have to maintain a manual list of numbers answered for the corresponding question. It seems like you know all the answers ahead of time, so this shouldn't be that big of a deal.

Solution 3

I think you can guess that the name groups the checkboxes so the way you want to do it is not plausible without javascript. I suggest you to name the checkboxes per question and then you can group them by value using php. For example if you get answers 1, 3, 1, 2 you can push them into the appropriate array. It would be something like this. But it's not crackers' proof

        <form method="post">
            <input type="radio" name="v1" id="v1-1" value="1"/><label for="v1-1">1-1</label><br/>
            <input type="radio" name="v1" id="v1-2" value="2"/><label for="v1-2">1-2</label><br/>
            <input type="radio" name="v1" id="v1-3" value="3"/><label for="v1-3">1-3</label><br/>

            <input type="radio" name="v2" id="v2-1" value="1"/><label for="v2-1">2-1</label><br/>
            <input type="radio" name="v2" id="v2-2" value="2"/><label for="v2-2">2-2</label><br/>
            <input type="radio" name="v2" id="v2-3" value="3"/><label for="v2-3">2-3</label><br/>

            <input type="radio" name="v3" id="v3-1" value="1"/><label for="v3-1">3-1</label><br/>
            <input type="radio" name="v3" id="v3-2" value="2"/><label for="v3-2">3-2</label><br/>
            <input type="radio" name="v3" id="v3-3" value="3"/><label for="v3-3">3-3</label><br/>

            <input type="radio" name="v4" id="v4-1" value="1"/><label for="v4-1">4-1</label><br/>
            <input type="radio" name="v4" id="v4-2" value="2"/><label for="v4-2">4-2</label><br/>
            <input type="radio" name="v4" id="v4-3" value="3"/><label for="v4-3">5-3</label><br/>
            <input type="submit" value="vote"/>
        </form>
<?php
if(! empty($_POST))
{
    $plausible_answers = array(1,2,3,4);
    $answers = array();
    for($i=1;! empty($_POST["v$i"]);++$i)
    {
        if(in_array($_POST["v$i"], $plausible_answers))
        {
            $answers[$_POST["v$i"]][] = $i;
        }
    }
    print_r($answers);
}
?>

Comments

[ZoeStellan]

I am aware that I have to use the same name for the options to be mutually exclusive. My question is how to achieve the desired result, even if I have to take a different approach.

[ZoeStellan]

Yes, I was thinking this too, but I wanted a simpler solution (Occam). Since there seems to not be a way around it, I'll just have to do what you said. Thanks.