Как создать Json данные из динамически генерируемой таблицы c?

Question

Я создал одну исходную таблицу, которая является stati c. вторая таблица - это агрегатор, который генерируется из основной таблицы (id="aggregator-table") и добавляется к другому div с новой таблицей id. Я хочу сгенерировать JSON из этих динамических c таблиц. Я хочу игнорировать значение флажка, а также заголовки кулака, которые являются <thead> данными. чтобы получить значение таблицы, я использовал здесь атрибут данных, чтобы получить все таблицы. Я пытался сгенерировать JSON, но это не правильно генерирует. В совокупности я могу создать несколько строк, чтобы заполнить данные. Так как сгенерировать JSON из нескольких строк и игнорировать кнопку флажка n из таблицы? любой намек?

// ==================== //
// Add aggregate Table//
// ==================== //

var aggTableNum = 0;
$('.addAggregatorCompo').click(function (e) {
  const originTable = document.getElementById('aggregator-table');
  let newTable = originTable.cloneNode(true);
  newTable.id = 'newAggTable' + ++aggTableNum;
  newTable.querySelectorAll('input').forEach((element) => {
    element.value = '';
  });
  $('#main-div').append(newTable);
});

// ==================== //
// Delete Component //
// ==================== //

$('#main-div').on('click', '.delete-component', function(e) {
  e.preventDefault(); // in case it is not a type=button and the table is wrapped in a form
  this.closest('table').remove();
});

// ==================== //
// Delete Records//
// ==================== //

$('#main-div').on('click', '.delete-record-aggregator', function() {
  $('table tbody')
    .find('input[name="record"]')
    .each(function() {
      if ($(this).is(':checked')) {
        $(this).parents('tr').remove();
      }
    });
});

// ==================== //
// Add Aggregate records //
// ==================== //

$('#main-div').on('click', '.add-record', function() {
  let $tbody = $(this).closest('table').find('tbody');
  $('<tr>')
    .append($('<td>').append('<input type="checkbox" name="record">'))
    .append($('<td>').append('<input type="text" value="lorem ipsum" />'))
    .append($('<td>').append('<input type="text" value="lorem ipsum" />'))
    .append($('<td>').append('<input type="text" value="lorem ipsum" />'))
    .append($('<td>').append('<input type="text" value="lorem ipsum" />'))
    .appendTo($tbody);
});

$('#createJSON').click(function() {
    $('#main-div .component-base').each(function() {
        console.log(this);
        // console.log($(this));
        if ($(this).data('component-type') == 'source') {
            console.log('Process source');
            var newFormData = [];
            jQuery('#source-table tr:not(:first)').each(function(i) {
                var tb = jQuery(this);
                var obj = {};
                tb.find('input').each(function() {
                    obj[this.name] = this.value;
                });
                obj['row'] = i;
                newFormData.push(obj);
            });
            console.log(newFormData);
        } else if ($(this).data('component-type') == 'aggregator') {
            console.log('Process Agg');

            var newFormData = [];
            jQuery('#aggregator-table1 tr:not(:first)').each(function(i) {
                var tb = jQuery(this);
                var obj = {};
                tb.find('input').each(function() {
                    obj[this.name] = this.value;
                });
                obj['row'] = i;
                newFormData.push(obj);
            });
            console.log(newFormData);
        } 
    });
});

#aggregator-table {
  display: none;
}

table {
  border-collapse: collapse;
  margin: 1em;
}
thead {
  background-color: lightblue;
}
td,
th {
  border: solid grey 1px;
  padding: 1em;
  text-align: center;
}

     <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
     
     <button style="margin: 1%;" class="addAggregatorCompo">
                        Add Aggregator
                    </button>
                    <button style="margin: 1%;" id="createJSON">Create JSON</button>
                    <table id="aggregator-table" class="component-base" data-component-type="aggregator">
                    <thead>
                        <th colspan="6">Aggregator</th>

                        <tr>
                            <th>Select</th>
                            <th>Column Name</th>
                            <th>Function</th>
                            <th>Alias</th>
                            <th>Order</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td><input type="checkbox" name="record" /></td>
                            <td>
                                <input id="column-name" name="column-name" placeholder="Column Name" />
                            </td>
                            <td>
                                <input id="function" name="function" placeholder="Function" />
                            </td>
                            <td>
                                <input id="alias" name="alias" placeholder="Alias" />
                            </td>
                            <td>
                                <input id="order" name="order" placeholder="Order" />
                            </td>
                        </tr>
                        <tr></tr>
                    </tbody>

                    <tfoot>
                        <tr>
                            <td>
                                <button class="add-record" style="margin:
                                        1%;">
                                        Add Properties
                                    </button>
                            </td>
                            <td>
                                <button class="delete-component" style="margin: 1%;">
                                        Delete Table
                                    </button>
                            </td>
                            <td>
                                <button class="delete-record-aggregator" style="margin: 1%;">
                                        Delete Record
                                    </button>
                            </td>
                        </tr>
                    </tfoot>
                </table>
                 <div class="main-div" id="main-div">
            <!-- ----------------- -->
            <!-- Source Table -->

            <table id="source-table" data-component-type="source" class="component-base">
                <thead>
                    <tr>
                        <th colspan="5">Source</th>
                    </tr>

                    <tr>
                        <th>Type</th>
                        <th>Name</th>
                        <th>Location</th>
                        <th>Schema</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>
                            <input id="type" name="type" placeholder="Type" />
                        </td>
                        <td><input id="Name" name="Name" placeholder="Name" /></td>
                        <td>
                            <input id="location" name="location" placeholder="Location" />
                        </td>
                        <td>
                            <input id="schema" name="schema" placeholder="Schema" />
                        </td>
                    </tr>
                </tbody>
                <tfoot>
                    <tr>
                        <td>
                            <button class="delete-component" style="margin:
                                    1%;">
                                    Delete Table
                                </button>
                        </td>
                    </tr>
                </tfoot>
            </table>
        </div>