Обработка данных динамической таблицы - PullRequest
Новая
       9

Обработка данных динамической таблицы

0 голосов
/ 17 июня 2019

Я использую Flask - Sqlalchemy.

У меня проблема со сбором переменных из динамически созданной таблицы HTML.

Я создал первую строку в моей таблице с формой для отправки данных на сервер, например: 

<form action='/upload_enclosure_script' method='POST'>
    <table id='sct_components_table'>
        <thead>
            <tr>
              <td > ID</td>
              <td > Qty</td>
            </tr>
          </thead>
          <tr name='row_01' id = 'row_01'>
            <td> 1 </td>
            <td> <input name='quantity1' id='quantity1'/>  </td>
          </tr>
      </table>
      <button type='submit' value='Upload' ><b>Continue</b></button>
  </form>
  <button onclick="Add_row()"> Add Row</button>

Затем с помощью JavaScript был создан скрипт, который будет продолжать добавлять строки при нажатии кнопки «Добавить строку». 

function Add_row() {
    var tbl = document.getElementById('sct_components_table');
    var iteration = tbl.tBodies[0].rows.length;
    var row_number = iteration + 1;
    newRow = tbl.tBodies[0].insertRow(-1);
    newRow.setAttribute('name','row_02');
    newRow.setAttribute('id','row_02');

    var newCell = newRow.insertCell(0);
    newCell.innerHTML = row_number;

    var newCell1 = newRow.insertCell(1);
    el.type = 'text';
    el.name = 'quantity'+row_number;
    el.id = 'quantity'+row_number;
    el.value = '';
    newCell1.appendChild(el);
}

Теперь я хочу использовать скрипт Python для сбора всех переменных, чтобы я мог их обработать. Однако я не могу получить переменные в динамически создаваемых строках (Row_02, Row_03, ect) для обработки. Я думаю, что добавление строки в HTML с помощью JavaScript не добавляет ее в форму, и поэтому информация никогда не отправляется на серверную часть базы данных. 

@upload_enclosure_blueprint.route('/upload_enclosure_script', methods=['POST' , 'GET'])

@login_required
def upload_enclosure_script():
    quantity1 = request.form['quantity1']
    print(quantity1)
    quantity2 = request.form['quantity2']
    print(quantity2)

    return render_template('product_lookup.html', page_name=page_name)

Я попытался изменить HTML-тег name для всех tr / td, чтобы они имели одинаковые значения, например, 

<td> <input name='quantity' id='quantity'/></td>

Затем попытался собрать их в виде списка так: 

@upload_enclosure_blueprint.route('/upload_enclosure_script', methods=['POST' , 'GET'])
@login_required
def upload_enclosure_script():

    temp_multi_quantity = request.form.getlist('quantity')
    print(temp_multi_quantity[0])
    print(temp_multi_quantity[1])
    return render_template('product_lookup.html', page_name=page_name)

У меня очень маленький успех. Кто-нибудь знает, возможно ли добиться того, чего я пытаюсь достичь?

...