CODEWITHSUNDEEP
javascriptphpjqueryhtmlforms
Yamaha32088
Yamaha32088

Reputation: 4163

Getting values of multiple $_POST elements

I am creating a form that allows the user to supply additional addresses they are located at. I have a drop down that asks "How many additional locations do you have?" based on the number they select I clone the fields "Address, City, State, Zip" and place them directly underneath of each other inside the same form.

What I described above is working but now I am attempting to retrieve the data from these additional fields I added. When the user clicks the submit button the form submits to the same page where I have PHP listening to see if the form has been submitted or not. If it has been submitted I echo the values of the form to the screen.

Now here is the problem. If I leave the dropbox alone so that it is at the default value of "1" fill out the form and click submit I see what I entered. But if I select any other value from the drop down and submit the information from all of the forms I only see the information from the last form and not all of them. Why is this? I have included my code below.

Here is the form :

<form id="blah" method="post">
    <div class="Page" id="AdditionalLocations">
        <fieldset name="first" class="additional">
            <legend>Additional Locations</legend>
            <p><label for="Address">Address</label> <input name="Address" type="text" id="Address" /><br /></p>
            <p><label for="City">City</label> <input type="text" name="City" id="City" /></p>
            <p>
                <label for="State">State</label>
                <select id="State" name="State">
                    <option selected="selected">Select your state...</option>
                    <?php foreach($states as $key=>$value) { ?>  
                    <option value="<?php echo $key; ?>"><?php echo $value; ?></option>  
                    <?php } ?>
                </select>
            </p>
            <p><label for="Zip">Zip Code</label><input type="text" name="Zip" maxlength="6" /></p>
            <p><label for="Country">Country</label><select id="Country" name="Country">
                <option value="US" selected="selected">United States</option>
                <option value="CA">Canada</option>
            </select></p>

            <input type="submit" value="SUBMIT FORM" />
        </fieldset>
    </div>
</form>

This is how the fields are created based on the dropdown 

var cloneIndex = 0,
    cloneObj = $('.additional').eq(0);

$(document).on('change', "#NumberOfLocations", function() {
    if ( $(this).val() !== "" ) {
        for( var x = 2; x < $(this).val(); x++ ) {
            $('#AdditionalLocations').append( cloneObj.clone( true ).attr(''   ,'data-index', ++cloneIndex) )  
        }
    }
});

This is how I echo the results of the form. It works if I don't create new additional fields based on the drop down. 

<?php
if($_SERVER['REQUEST_METHOD'] == "POST") {
    var_dump($_POST);
    foreach( $_POST as $field ) {
        if( is_array( $field ) ) {
            foreach( $field as $field2 ) {
                echo $field2;
            }
        } else {
            echo $field2;
        }
    }
}
?>

If I select 2 as the value in the number of locations field this is the html output I get:

<form id="blah" method="post">
    <div class="Page" id="AdditionalLocations">
        <fieldset name="first" class="additional"></fieldset>
        <fieldset name="first" class="additional" data-index="1"></fieldset>
    </div>
</form>

Inside the fieldset all of the fields are identical. Why do I not get both fieldsets echoed when I click submit?

UPDATE: So I changed the names of the second field set by adding a "1" at the end inside the chrome inspector and submitted now I see all of the values I need. So I guess every field in the form has to have a unique name.

Upvotes: 0

Views: 194

Answers (1)

Patrick Evans
Patrick Evans

Reputation: 42746

your field names should have array notation at the end of their names: 

<input type="text" name="City[]" id="City" />
<select id="State" name="State[]">

when php gets these values they will then be in array so you will need to loop over each of the arrays to get the info

for($i=0; $i<count($_POST['City']); $i++){
   $city = $_POST['City'][$i];
   $state = $_POST['State'][$i];
   ...
}

There is probably a better way of getting the info out of the arrays, but this is quick and dirty

Upvotes: 2

Related Questions