send values of dynamic table to a flask app

sorry for this begginer question iam compeltly noob in JQuery i have a flask form thats contain a dynamic table i want to send values of the table to my backend its nearly done but i get values of secound td for etc if i enter the pizza in first td and enter 20 in secound td i get this in my back-end : { "" : "20"}
this is my html ( i cut most the flask form from my cod):

                    <div class="card-body">
                        <h1>New Cafe</h1>
                        <p class="text-muted">Add Your Cafe</p>

                        <form id="my-form" name="cafe" method="post" action=""
                              enctype="multipart/form-data">
                            {{ cafe_form.csrf_token }}
                            {{ ckeditor.load() }}
                            {{ ckeditor.config(name='about') }}
                            {{ cafe_form.name.label }}
                            <div class="input-group mb-3">
                                <span class="input-group-addon"></span>
                                {{ cafe_form.name(class="form-control") }}
                            </div>
                            <div id="data_container">
                                <div id="dynamic-fields">
                                    <table>
                                        <thead>
                                        <tr>
                                            <th>Menu item</th>
                                            <th>Menu item Price in USD $</th>
                                        </tr>
                                        </thead>
                                        <tbody class="p-4">
                                        <tr class="p-2">
                                            <td><input  type="text"></td>
                                            <td><input  type="text"></td>
                                        </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </form>
                        <div class="pt-2 pb-2">
                   <button id="submit-btn" class="btn btn-outline-primary px-4">Submit</button>
                            <button id="add_rows" class="btn btn-outline-dark">+</button>
                        </div>
                    </div>

and this is my js for adding extra rows :

>
> $("#add_rows").click(function () {
> // each click on the + button adds a row to the table
> $("#data_container tbody").append(<tr><td><input type="text"></td><td><input type="text"></td></tr>);
> });
> $("#submit_rows").click(function () {
> // obj for storing the inputs, and the n to make unrepeated keys
> let obj = {}, n = 0;
> // loop over the rows
> $("#data_container tbody tr").each(function (ind, tr) {
> // add an array to the object
> obj[r${n}] = [];
> // loop over the inputs of this row
> $(this).find("input").each(function (ind, input) {
> // add the value of the input to the array and make sure to remove any semicolon since
> // we will use it to separate the inputs
> const val = input.value.replace(/;/g, "");
> obj[r${n}].push(val);
> });
> // no need for the array, just join it to a string of values separated by semicolons
> obj[r${n}] = obj[r${n}].join(";");
> // increase the value of n
> n++;
> });
> // log the object to the console so you can see what we are sending
> console.log(obj);
> // send the data to the server, see the console for a logging message for success
> $.post("", obj, (data, status) => console.log("Status: " + status));
> });

and this is the part that i try to send the data to back-end:

    const weburl = "/owner-new-cafe";
    document.getElementById('submit-btn').addEventListener('click', function (event) {
        event.preventDefault();
        submitForm();
    });

    function submitForm() {
        // Collect static form data
        const formData = new FormData(document.getElementById('my-form'));

        // Collect dynamic form data
        const dynamicData = [];
        $('#dynamic-fields tbody tr').each(function () {
            const row = {};
            $(this).find('input').each(function (ind, input) {
                row[this.name] = this.value;
            });
            dynamicData.push(row);
        });

        // Add dynamic form data to FormData object
        formData.append('dynamicData', JSON.stringify(dynamicData));
        document.getElementById("test").innerHTML = formData;

        // Send form data to Flask app using AJAX
        $.ajax({
            url: weburl,
            method: 'POST',
            data: formData,
            processData: false,
            contentType: false,
            success: function (response) {
                // Handle response from Flask app
            },
            error: function (xhr) {
                // Handle error
            }
        });

    }

please dont give me just answer iam try to learn i want to know what is my mistakle and what is the best way for doing this thank you so much