1

この請求書ページを作成しました。テーブルを生成するリピーターがあります。次のようなdivタグでカプセル化されたtdタグに入る請求書アイテムの説明があります。

<asp:Repeater ID="Repeater1" runat="server">
           <ItemTemplate> 
            <tr>
             <td class="griditem text">
                 <div class="invoiceDescription" id='<%# "item-" + Eval("ID") %>' value='<%# Eval("ID") %>' onclick="InvoiceItemClicked(this);">
                    <%# Eval("Description") %>
                 </div>
             </td>
             <td class="gridnumb text r">
             <%# String.Format("{0:n}", Eval("Quantity"))%>
             </td>
             <td class="gridnumb text r">
             <%# String.Format("{0:c}", Eval("UnitCost"))%>
             </td>
             <td class="gridnumb text r">
             <%# String.Format("{0:c}", Eval("Total"))%>
             </td>
            </tr>
           </ItemTemplate>
          </asp:Repeater>

最初の行が表示されたら、JavaScriptをonclickと呼びます。関数は次のようになります（jQueryを使用）：

function InvoiceItemClicked(elm) {
        var textbox = document.createElement('input');
        textbox.setAttribute('type', 'text');
        textbox.value = $(elm).text();
        $(elm).html(textbox);
    }

このようなsthをやろうとするのはこれが初めてで、最初のショットでうまくいきました。行を同じテキストが設定されたテキストボックスに変換します。ただし、問題は、生成されたテキストボックスをクリック（フォーカス）すると、その中のテキストが消えることです。

このインライン編集を行うための他のベストプラクティスにも感謝します。次に、Webサービスなどを介してアイテムを更新する必要があります。

前もって感謝します。

4

1 に答える 1

0

うん、悪い！

function InvoiceItemClicked(elm) {
        var b = $(elm).hasClass('invoiceDescriptionEditing');
        if(!b)
        {
            var textbox = document.createElement('input');
            textbox.setAttribute('type', 'text');
            textbox.setAttribute('id', 'txt');
            $(textbox).css('width', '550px');
            textbox.value = $(elm).text();
            $(elm).html(textbox);

            $(elm).removeClass('invoiceDescriptionEditable');
            $(elm).addClass('invoiceDescriptionEditing');
        }

    }

これはエイトです！:)

于 2010-08-05T11:53:06.880 に答える