我正試圖使用HTMX的點擊編輯例子，通過使用一個表格。
每一行（<tr>）是一條資料庫記錄，看起來像這樣：
<tr hx-target="this" hx-swap=" outerHTML">
<form>
<td><input type="text" name="name" value="{{row. name}}"></td>
<td><input type="text"/span> name="email"/span> value="{{row. email}}"></td>
<td>
<按鈕 class="btn" hx-put="/edit/{{row.id}}">更新<buttun>
<按鈕 class="btn" hx-get="/view/{{row.id}}"> Cancel</button>
</td>
</form>
</tr>
不幸的是，當我用request.form.keys在我的flask服務器上列印請求正文時，我看到請求是空的（[]）
似乎按鈕的點擊并沒有觸發所有輸入欄位的表單提交。
我怎樣才能使按鈕的點擊觸發所有欄位的表單提交呢？
uj5u.com熱心網友回復：
啊，我想起來了：你是在用表格作業。 不幸的是，表格對里面的元素非常挑剔，我打賭表單在你放置的地方不起作用。 如果你檢查 DOM，我打賭你會發現那里并沒有一個真正的表單元素，所以 htmx 沒有找到它來包含輸入。
你需要重新設計，以便以不同的方式包含這些值，例如使用 hx-include。
像這樣：
< tr hx-target="this" hx-swap="outerHTML">/span>
<td>< input type="text" name="name" value="{{row. name}}">< /td>
<td>< input type="text" name="email" value="{{row. email}">< /td>
<td>
<button class="btn" hx-put="/edit/{{row. id}}"
hx-include="closest tr"/span>>
更新內容
<button> 更新
<button class="btn" hx-get="/view/{{row. id}">取消</按鈕>
</td>/span>
</tr>
如果你愿意從表格行切換到div，你原來的代碼應該可以正常使用。
這是一個不幸的情況，表格并不十分靈活。
update。@guettli提醒我，你可以包括任何元素，它將包括它下面的所有輸入，所以你可以在你的hx-include屬性中使用closest tr。 謝謝！
uj5u.com熱心網友回復：
你能從chrome或firefox控制臺發布請求的樣子嗎？
這看起來是正確的，總的來說。
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/317190.html
標籤：