在jquery模态弹出窗口中获取asp:repeater中label的值

时间:2018-12-18 20:07:42

标签: jquery asp.net

我试图在jquery弹出窗口中的asp:reader中获取标签的值。我已经测试了本教程ASP.NET Repeater with jQuery Dialog Popup,并且效果很好。但是,当我尝试在脚本中使用相同的概念时,则不会显示任何数据。我已经查看了背后的代码,并且有一些价值。这是我的脚本。

<script type="text/javascript">
    $(document).ready(function () {
        $("#btnclickedit").click(function () {
            var currentRow = $(this).parents("tr");
            var MBBody = currentRow.find("span[id*='messageBody']").text();
            $("#ContentPlaceHolder1_bmessageedit").text(MBBody);
            $("#divpopupedit").dialog({
                width: 600,
                height: 580,
                title: "Edit a Message",
                modal: true,
            });
        });
    })
</script>

<div id="divpopupedit" style="display: none">
    <div class="form-group">
        <label for="BodyMessage">Reply:</label><br />
        <asp:Label ID="bmessageedit" runat="server" />
        <asp:HiddenField ID="MessageBoardIDEdit" runat="server" />
    </div>
</div>
<asp:Repeater ID="myRepeater" OnItemDataBound="myRepeater_ItemDataBound" runat="server">
    <HeaderTemplate>
        <div class="messageBox">
            <table id="messageDetails">
    </HeaderTemplate>
    <ItemTemplate>
        <tr>
            <td>
                <asp:Label ID="title" Font-Bold="true" Text='<%# Eval("MessageTitle") %>' runat="server" />
                <span class="subtitle">Posted By: <%# Eval("EmployeeName") %> | <%# Eval("DateTimePosted") %> </span><span id="messageED" class="messageActions" runat="server">
                    <button type="button" class="ui-button ui-widget ui-corner-all" id="btnclickedit">Edit</button>
                    |
                    <button type="button" class="ui-button ui-widget ui-corner-all" id="btnclickdelete">Delete</button>
                </span>
            </td>
        </tr>
        <tr>
            <td>
                <asp:Label ID="messageBody" Text='<%# Eval("Message") %>' runat="server" />
                <asp:HiddenField ID="MBCategoryID" Value='<%# Eval("MBCategoryID") %>' runat="server" />
                <asp:HiddenField ID="PostedBy" Value='<%# Eval("PostedBy") %>' runat="server" />
                <asp:HiddenField ID="MessageBoardID" Value='<%# Eval("MessageBoardID") %>' runat="server" />
            </td>
        </tr>
    </ItemTemplate>
    <FooterTemplate>
        </table>
            </div>
    </FooterTemplate>
</asp:Repeater>

更新 当我对值进行硬编码时,将显示数据。因此,问题在于JQuery脚本无法读取转发器中的messageBody标签值。

var currentRow = $(this).parents("tr");
var MBBody = "15";
$("#ContentPlaceHolder1_bmessageedit").text(MBBody); 

1 个答案:

答案 0 :(得分:1)

我将首先使用class,而不是id来标识在Repeater中单击的按钮。 (请注意,在中继器中,有id="btnclickedit"的多个实例,因此无论如何都无法正常工作。

然后在JavaScript中,您正在同一messageBody中查找tr,但在下一个中。

因此,将按钮更改为此按钮,并添加一个唯一的类名btnclickedit

<button type="button" class="ui-button ui-widget ui-corner-all btnclickedit" id="btnclickedit">Edit</button>

然后我们使用Label CssClass

进行相同的操作
<asp:Label CssClass="messageBody" ID="messageBody" Text='<%# Eval("Message") %>' runat="server" />

现在将脚本修改为此

<script type="text/javascript">
    $(document).ready(function () {
        $('.btnclickedit').click(function () {
            var currentRow = $(this).closest('tr');
            var MBBody = currentRow.next('tr').find('.messageBody').text();

            ....
        });
    });
</script>

在旁注中,这是可行的

$("#ContentPlaceHolder1_bmessageedit").text(MBBody);

最好使用ClientID,尤其是在使用母版页时。

$("#<%= bmessageedit.ClientID %>").text(MBBody);

或者,如果不需要ASP功能,则将其设为“常规” div。