Динамически добавлять поля ввода и сохранять данные в базу данных

Question

У меня есть страница, на которой пользователь может динамически добавлять / удалять поля ввода и генерировать его поля ввода столько раз, сколько хочет пользователь, и в конечном итоге нажать кнопку «Отправить», чтобы сохранить данные / значение полей ввода в базе данных.

Но он сохраняет только одно значение поля ввода в базу данных и не может сохранить данные / значения второго или третьего полей ввода

Может кто-нибудь помочь мне или указать мне правильное направление:) спасибо заранее:)

Вот мой JavaScript:

<script>
    $(document).ready(function () {
        //Add input field 
        var i = 1;
        $("#add").click(function (e) {
            i++;
            e.preventDefault();
            $("#tbhold").append('<tr id="row' + i + '"><td><div class="col-md-8"><input type="text" name="Varenummer[]" id=' + i + '  class="form-control" /></div></td><td><div class="col-md-8"><input type="text" name="Serienummer[]" id=' + i + '  class="form-control" /></div></td><td><button type="button" class="btn btn-danger btn_remove" id="' + i + '" name="remove">X</button></td></tr>');
        });

        //Remove input field 
        $(document).on('click', '.btn_remove', function () {
            var button_id = $(this).attr("id");
            $("#row" + button_id + '').remove();
        });

    //Save to db by click
    $("#submit").click(function (e) {
        e.preventDefault();

        $.ajax({
          type: 'POST',
          url: '@Url.Action("ProcessCreateRMA", "User")',
            dataType: 'json',
            data: $('#add_rma').serialize(),
            success: function (CreateRMA) {
                console.log(CreateRMA);
            },
            error: function () {
            console.log('something went wrong - debug it!');
            }
        });
    });
 });
</script>

HTML:

<form name="add_rma" id="add_rma">
    <table id='tbhold' class="table">
        <thead>
            <tr>
                <th>Varenummer</th>
                <th>Serienummer</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>
                    <div class="col-md-8">
                        <input type="text" name="Varenummer[]" id="Varenummer" class="form-control" />
                    </div>
                </td>
                <td>
                    <div class="col-md-8">
                        <input type="text" name="Serienummer[]" id="Serienummer" class="form-control" />
                    </div>
                </td>
             <td>
              <button type="button" name="add" id="add" class="btn btn-success">Add More</button>
            </td>
        </tbody>
    </table>
    <input type="button" name="submit" id="submit" value="Submit" />
</form>

Контроллер:

    [HttpPost]
    public JsonResult ProcessCreateRMA(CreateRMAVM model)
    {
        var RMA = new RMA_History
        {
            Varenummer = model.Varenummer,
            Serienummer = model.Serienummer,
        };

        db.RMA_History.Add(RMA);
        db.SaveChanges();

        return Json(model, JsonRequestBehavior.AllowGet);
    }

ViewModel:
 public class CreateRMAVM
    {
        public string Varenummer { get; set; }
        public string Serienummer { get; set; }
    }