將動態生成的 HTML 表/網格中的數據保存到數據庫

Question

我正在開發一個 web 應用程序，其中一個要求是用戶將數據輸入到動態生成的 HTML 網格/表中。 管理員用戶可以登錄 Django 管理界面並創建一些條目，這些條目將代表網格的列和行，然后根據這些值生成動態網格。 在此示例中，管理員用戶輸入“Store #1”、Store #2”等作為行，並輸入“Chips”、“Chocolates”和“Soda”作為列。然后使用這些行和列通過以下代碼生成在 Django 模板中呈現的網格：

<table class="tg">
<thead>
    <th rowspan="3"></th>
  <tr>
    <td class="tg-title" colspan="4">Inventory</td>
  </tr>
  <tr>
    {% for i in items %}
      <td class="tg-column">{{ i }}</td>
    {% endfor %}
  </tr>
</thead>

<tbody>
{% for i in stores %}
  <tr>
      <td class="tg-column">{{ i }}</td>
    {% for i in items %}
      <td class="tg-cell"><input type="number" min="0" max="255" value="0"></td>
    {% endfor %}
  </tr>
 {% endfor %}

  <tr>
    <td class="tg-totals">Totals</td>
    {% for i in items %}
      <td class="tg-totals-values">0</td>
    {% endfor %}
  </tr>
</tbody>
</table>

上面的代碼呈現如下：

從視覺上看，這很好，但我一生都無法弄清楚我應該如何將此表單保存到數據庫表中。 這里的問題是用戶將來可能會查看此條目，因此如果將來加載，則需要將其“放回”到與此處看到的相同的網格中。 我不知道該怎么做——每個輸入字段都需要有自己的“id=”字段嗎？ 甚至可以使用真正動態的網格來做到這一點嗎？ 如果有 100 家商店，每家商店有 10 件商品怎么辦？

Answer 1

這取決於您的數據庫技術是什么，如果有 JSON 字段（MySQL 5.7+ 或 Postgres 的新版本），那么它會很有幫助，因為您的 model 看起來像這樣

     class Data(models.Model):
           name = models.CharField(max_length=255)
           values = jsonfield()

然后，您可以將每列的名稱作為鍵存儲在 JSON 字段中，這將使您能夠動態添加新列，因為您可以使用get function。

為了保存數據，您需要編寫一個 JS 代碼將網格轉換為正確的 JSON object 並通過請求發送，在后端，視圖可以將 Z0ECD11C1D7A287401D148A23BBD7A2 加載到數據庫中並保存。

此外，JS function 可以智能地僅發送更新的行以減少所需的數據大小和請求處理時間。