Recover multiple input data

Question

i have my jQuery :

$(document).ready(function() {
    var max_fields      = 10; //maximum input boxes allowed
    var wrapper         = $(".input_fields_wrap");
    var add_button      = $(".add_field_button");

    var x = 1; //initlal text box count
    $(add_button).click(function(e){ //on add input button click
        e.preventDefault();
        if(x < max_fields){ //max input box allowed
            x++; //text box increment
            $(wrapper).append('<div><input type="text" name="mytext[]"/><a     href="#" class="remove_field">Remove</a></div>'); //add input box
        }
     });

     $(wrapper).on("click",".remove_field", function(e){ //user click on remove text
         e.preventDefault(); $(this).parent('div').remove(); x--;
     })
});

And my HTML :

<div class="input_fields_wrap">
    <button class="add_field_button">Add More Fields</button>
    <div><input type="text" name="mytext[]"></div>
</div>

From : https://www.sanwebe.com/2013/03/addremove-input-fields-dynamically-with-jquery

I would like to know, i can i recover each data from for each input added and save in my databse (MySQL) ? I would like to use php if possible or jQuery if i have no other possibility. Thanks a lot,

Answer 1

If you wrap your input fields with a <form action="processing_page.php" method="POST"> and </form>

then when form is submitted you will be able to access the data within your processing_page.php in such way.

$valuesArray = $_POST['mytext'];

you can use it in foreach statement to do something with each one (like in this example print it out)

foreach($valuesArray as $value) {
    echo "<br>$value";
}

EDIT: if you get stuck with implementing a form, here is a basic overview/tutorial. Make sure to check out the sections on form itself, action and method.

EDIT2: if you plan on storing the values to the database or showing it on another page, make sure to sanitize all user provided data. There are some good practices explained in this thread.