如何通过编号的id获取多个输入的值并将它们插入MySQL

Question

I tried to create a multi insert form where you can insert as many tiles and related languages as you want by filling in a number. The display of the Titles and language works fine, but I'm not able to get the different values and insert them into db. My aim is it that every Title with its Lang gets a unique ID in the db.

<form method="POST" action="" enctype="multipart/form-data">
 <table>
     <tr>
         <th>Title</th>
         <th>Language</th>
     </tr>
 </table>
 <input id="count" type="number" placeholder="Number of Titles">
 <input type="button" id="plus" value="+">
 <input type="submit" id="save" name="save" value="Save">
 <script type="text/javascript">
       $('#plus').on('click', function(){
            var queryString = "";
            var count = $('#count').val();
            var i;
            for(i = 1; i <= count; i++){
                 $('table').append('<tr><td><input name="title" type="text" placeholder="Title" id="Title_'+i+'" autocomplete="off" class="title"></td><td><select name="lang" id="Lang_'+i+'"><option value="0">Romaji</option><option value="ja">Japanese</option><option value="en">English</option><option value="de">German</option><option value="ru">Russian</option></select></td></tr>');
            }
       });
       $('#save').on('click', function(){
        var Title = $('#Title_'+i).val();
        console.log(Title);
        queryString ='title='+Title+'&lang='+Lang;

        jQuery.ajax({
            url: "action/insert.php",
            data: queryString,
            type: "POST",
            success:function(data){
                 location.reload();
            },
        });
       });  
     </script>
</form>

I also tried to get the value of the inputs via Jquery and send them with Jquery Ajax to the PHP file but I only get the output "undefined" when I tried to show the values in console

The insert.php

<?php
require "../config.php";
$title= $_POST['title'];
$lang= $_POST["lang"];

    $sql = "INSERT INTO MyGuests (title, lang) VALUES ('".$_POST['']."', '".$_POST['']."');";
    $sql .= "INSERT INTO MyGuests (title, lang) VALUES ('".$_POST['']."', '".$_POST['']."');";
    $sql .= "INSERT INTO MyGuests (title, lang) VALUES ('".$_POST['']."', '".$_POST['']."')";
    ...

    mysqli_multi_query($conn, $sql);
 ?>

Answer 1

You need to iterate over all #Title_<something> items:

var titles = $('[id^=Title_]');
titles.each(function() {
    console.log(this.val()); 
    // do other things
});

See Wildcards in jQuery selectors and how to iterate a result of jquery selector