データをasp:Listview
入力した があります。行をクリックすると、 のセルの 1 つtable
が に置き換えられasp:TextBox
、選択した値を編集できるようになり、テキスト ボックスにフォーカスが設定されます。ここまでは順調ですね。
クリックしないときは、意図したとおりに値を編集できます。ただし、input
コントロールをもう一度クリックすると、その内容が消えます。
$(document).ready(function () {
$('tr[id*="itemRow"]').click(function () {
$clickedRow = $(this);
var invNr = $clickedRow.find('span[id$="InvoiceNumber"]').text(),
newInvNr,
oldHtml = $clickedRow.find('span[id$="InvoiceNumber"]').html();
$clickedRow.find('span[id$="InvoiceNumber"]').html('<asp:TextBox ID="editInvNr" runat="server"></asp:TextBox>');
$clickedRow.find('input[id$="editInvNr"]').val(invNr).focus().focusout(function () {
//capture new invoice nr
newInvNr = $(this).val();
//switch textbox back to span using new invoice nr
$clickedRow.find('span[id$="InvoiceNumber"]').html(newInvNr);
//check if anything changed, if so update it in the db
if (newInvNr != invNr) {
//update new value to db
}
});
});
});
ここのjsfiddleでは、挿入をasp:TextBox
通常の htmlinput
要素に置き換えました。結果は同じです。最後の列の「1」をクリックして、私が見ているものを確認できます。テキスト ボックス コントロールの組み込みの動作を見落としているように感じます。見落としている場合は、知識不足で申し訳ありません。
いずれにせよ、これが起こらないようにする方法についての指針が欲しいです。とても有難い