0

ディスカッション フォーラムを実装する必要があるため、現在 asp.net リピーター コントロールを使用しています。リピーターアイテムごとに返信を追加するためのテキストボックスがあります。現在、Javaスクリプトとスタイルを使用しています。

最初のロードでは、返信パネルは表示されず、依存リンク ボタンをクリックすると、クリックされた項目のテキスト ボックス パネルのみが表示されます。現在、どの返信ボタンをクリックしても、リピーターの最初のアイテムしか表示されていませんか?

これに何か問題がありますか、またはリピーターでクリックした正確なアイテム ID を取得する方法はありますか?

    <div id="ViewDiscussion_Panel" runat="server" style="width: 100%; float: left;">
            <asp:Repeater ID="rptDiscussionFolders" runat="server" OnItemCommand="rptDiscussionFolders_ItemCommand" >
   <ItemTemplate>

     <div id="ContentArea" style="float: left; width: 92%; min-height: 80px; height: auto; margin-left: 10px; margin-bottom: 10px;"> 

        <div id="EditReplyItemArea" class="EditReplyItemArea" runat="server" style="margin: 15px 10px 10px 0px">
                                    <asp:TextBox ID="txtCommentItemReply" runat="server" Style="width: 98.8%; height: 1.5em; border: 1px solid gray" title="Add a reply" data-bind="value: text1, valueUpdate: 'keyup'"></asp:TextBox>
                                    <div style="float: right;">
                                        <asp:Button ID="ItemReplySubmit" data-bind="enable: isFormValid" runat="server" Text="Reply" OnClick="ItemReplySubmit_Click" CommandArgument='<%# Eval("ParentFolderID")%>' BackColor="DarkBlue" ForeColor="White" />
                                    </div>
                                     <div style="float: right;">
                                        <asp:Button ID="ItemReplyEdit" data-bind="enable: isFormValid" runat="server" Text="Edit" OnClick="ItemReplyEdit_Click" CommandArgument='<%# Eval("ListID")%>' BackColor="DarkBlue" ForeColor="White" />
                                    </div>
                                </div>

    </div>

 </ItemTemplate>
            </asp:Repeater>
        </div>

脚本...

 function EnbaleReplyPanel() {
        $("#ContentArea").addClass("showDivs");
        return false;
    }

スタイル...

<style type="text/css">
#ContentArea .EditReplyItemArea
{
    display: none;
}
#ContentArea.showDivs .EditReplyItemArea
{
    display: block;
}
</style>
4

1 に答える 1

1

基本的に、関数にインデックスを渡し、そのインデックス値に基づいて div に一意の ID を与える必要があります...

したがって、変更は次のようになります。

Div の一意の名前:

 <div class="CArea" id="ContentArea_<%# Container.ItemIndex + 1 %>" style="float: left;


function EnbaleReplyPanel(indx) {
    $("#ContentArea_" + indx).toggleClass("showDivs");
    return false;
}

どこから EnbaleReplyPanel を呼び出しているのかわかりませんが、そこから同じものを渡す必要があるため、次のようになります。

EnbaleReplyPanel(<%# Container.ItemIndex + 1 %>);

CSS クラス名については、次のようになります。

<style type="text/css">
.CArea .EditReplyItemArea
{
display: none;
}
.CArea .showDivs .EditReplyItemArea
{
    display: block;
}
</style>
于 2016-05-08T09:35:23.387 に答える