我试图在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);
答案 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。