How to add values of generated textbox in database using mysqli

Question

This code somehow stores only the value of last textbox. When we generate 3 textboxes, only the value of 3rd is stored in database instead of all. I want to store all the generated textbox values in the database

 <?php if(isset($_POST['submit'])){
$num_cat = $_POST['num_cat'];
$text = $_POST['category'];
foreach ($text as $key) {
  // echo $key."\n";
}
$insertquery = mysqli_query($con, "INSERT INTO accounts (accountusername, accountemail) VALUES('".$num_cat."', '".$key."')");
if(!$insertquery){
  echo "Error".mysqli_error($con);
}
} ?>

<script type="text/javascript">
    //when the webpage has loaded do this
    $(document).ready(function() {  
        //if the value within the dropdown box has changed then run this code            
        $('#num_cat').change(function(){
            //get the number of fields required from the dropdown box
            var num = $('#num_cat').val();                  

            var i = 0; //integer variable for 'for' loop
            var textboxes = ''; //string variable for html code for fields 
            //loop through to add the number of fields specified
            for (i=1;i<=num;i++) {
                //concatinate number of fields to a variable
                textboxes += 'Category'+i+': <input type="text" name="category[]' + i + '" placeholder = "category_' + i + '" /><br/>'; 
            }

            //insert this html code into the div with id catList
            $('#catList').html(textboxes);
        });
    }); 
</script>


 <form method="post" action="">
    Number of fields required:      
    <select id="num_cat" name="num_cat">
        <option value="0">- SELECT -</option>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
        <option value="5">5</option>
        <option value="6">6</option>
        <option value="7">7</option>
        <option value="8">8</option>
        <option value="9">9</option>
        <option value="10">10</option>
    </select>
    <div id="catList"></div>
    <input type="submit" name="submit" value="Submit"/>
</form>

Answer 1

If you update your javascript to write this (remove ' + i + ' from the name):

textboxes += 'Category'+i+': <input type="text" name="category[]" placeholder = "category_' + i + '" /><br/>'; 

then $_POST['category'] will be an array. It then depends how you want to store the values, but assuming you'll want three rows, you'll need to do this:

foreach ($_POST['category'] as $key) {
  $insertquery = mysqli_query($con, "INSERT INTO accounts (accountusername, accountemail) VALUES('".$num_cat."', '".$key."')");
  if(!$insertquery){
    echo "Error".mysqli_error($con);
  }
}

This is explained in the PHP manual. Please have a look at how can I prevent SQL-injection in PHP? as well, because your current code is vulnerable to simple exploits.