[英]jQuery keeps number of cloned rows after reset
我在彈出窗口中有一個表單,該表單提供了一個帶標題和一行的簡單表,用戶可以單擊+按鈕以添加(克隆)一行。
這非常有效,用戶提交表單,讀取數據-沒問題。 提交后使用以下方式重置該表單:
$('#entryTable').find("tr:gt(1)").remove(); // keep header and first row
$('#entryForm')[0].reset();
如果用戶立即調用該窗體,則窗體“似乎”正確重置,所有字段看起來都像新的一樣。 如果用戶單擊+(克隆)按鈕-它將添加先前添加的行數,而不是1,就好像未重置某些內容(但??????)。
我的克隆功能是
$(".cloneprod_add").on('click', function(e) {
e.preventDefault();
var $tr = $(this).closest('.tr_clone'); //only first row has +
var idtr= parseInt($tr.attr("id")); // checked it is always id of row1
var $clone = $tr.clone(true);
cindex++;
$clone.find(':text').val('');
$clone.attr('id', idtr+(cindex) );
$clone.find("*").each(function() {
var id = this.id || "";
var match = id.match(regex) || [];
if (match.length == 3) {
this.id = match[1] + (cindex);
}
});
$tr.after($clone);
$("#addline_"+cindex).addClass("uk-hidden"); // remove +
$("#delline_"+cindex).removeClass("uk-hidden"); // add -
});
再次調用該表單時,cindex正確重置為0。 還有什么應該重置的? 我的錯誤在哪里? 感謝您的建議
(編輯)我正在添加表格。 我正在使用UIkit(www.getuikit.com),節點服務器,並且表單來自jade中的模板-我從瀏覽器復制了HTML
<form id="entryForm" action="" class="uk-form uk-form-stacked" >
<div id="entryDialog" class="uk-modal-dialog uk-modal-dialog-large">
<fieldset data-uk-margin="">
<div class="uk-panel uk-panel-box uk-panel-box-primary uk-margin-small-top">
<div class="uk-form-row"><div class="uk-grid"><div class="uk-width-1-1">
<table id="entryTable" class="uk-table">
<thead><tr><th>lot</th><th>code</th><th>num</th>
<th>qte</th><th>unit</th><th>pos</th><th>cont</th>
<th></th></tr>
</thead>
<tbody><tr id="0" class="tr_productclone">
<td><input type="text" name="lot" id="lot_0" class="lot"></td>
<td><input type="text" name="code" id="code_0" class="code"></td>
<td><input type="text" name="num_0" id="num_0" class="num"></td>
<td><input type="text" name="qte_0" id="qte_0" class="qte"></td>
<td><select name="unit_0" id="unit_0" class="unit"><option value="items">pezzi</option></select></td>
<td><select name="pos_0" id="pos_0" class="pos"><option value="1">piece1</option></select></td>
<td><select name="cont_0" id="cont_0" class="cont"></select></td>
<td><button id="addline_0" class="uk-button cloneprod_add"></button>
<button id="delline_0" class="uk-button cloneprod_del"></button></td>
</tr>
</tbody></table></div></div></div></div>
<div class="uk-modal-footer"><button id="btnSave" type="submit" class="uk-button ">save</button></div>
</fieldset></div></form>
我找到了解決問題的方法。 我不知道為什么以及如何,但是至少它能起作用。
我的印象是,刪除操作保留了克隆行數的信息,因此使該數字退回了。 我考慮過要在模式中重新加載表,這樣它將是“沒有內存的新鮮”。
最后,我在js腳本而不是Jade模板中編寫了表的定義。 該表將隨着時間的推移而重建,該表將被調用,並且不再有內存虛影。
它有效,但我仍然不明白為什么會出現這些鬼影。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.