我试图在我的jquery ajax响应之后为我的页面创建几个html元素。我确实得到了一个正确的回复,但我希望能够创建一些元素来帮助显示我的回复。
我认为我已经在jquery中创建了它们但是在追加之后,新创建的元素不会附加到div,但是如果我追加到表中它会起作用。请帮我看看我做错了什么。感谢
以下是我的HTML
<h3>Interest</h3>
<div>
<p runat="server" id="pInterest">
<asp:Button runat="server" ID="btnAddInterest" CssClass="btnAddCommunity" Text="Add Interest" OnClientClick="return false;" />
<asp:Repeater runat="server" ID="rptOnlineCommunities" OnItemDataBound="rptOnlineCommunities_ItemDataBound">
<HeaderTemplate>
<div id="tblUseCommunities" class="dvOnlineCommunityMain">
</HeaderTemplate>
<ItemTemplate>
<div runat="server" id="dvOnlineCommunity" class="dvOnlineCommunity">
<asp:Label runat="server" ID="lblOnlineCommunityDescription" CssClass="lblOnlineCommunityDescription"></asp:Label>
<p runat="server" id="pOnlineCommunityDetails"></p>
<a runat="server" id="linkOnlineCommunity" target="_blank"></a>
<p class="pCommunityBtns">
<asp:Button runat="server" ID="btnUpdateOnlineCommunity" CssClass="btnUpdateOnlineCommunity" Text="Update" OnClientClick="return false;" />
<asp:Button runat="server" ID="btnDeleteOnlineCommunity" CssClass="btnDeleteOnlineCommunity" Text="Delete" OnClientClick="return false;" />
</p>
</div>
</ItemTemplate>
<AlternatingItemTemplate>
<div runat="server" id="dvOnlineCommunity" class="dvOnlineCommunity">
<asp:Label runat="server" ID="lblOnlineCommunityDescription" CssClass="lblOnlineCommunityDescription"></asp:Label>
<p runat="server" id="pOnlineCommunityDetails"></p>
<a runat="server" id="linkOnlineCommunity" target="_blank"></a>
<p class="pCommunityBtns">
<asp:Button runat="server" ID="btnUpdateOnlineCommunity" CssClass="btnUpdateOnlineCommunity" Text="Update" OnClientClick="return false;" />
<asp:Button runat="server" ID="btnDeleteOnlineCommunity" CssClass="btnDeleteOnlineCommunity" Text="Delete" OnClientClick="return false;" />
</p>
</div>
</AlternatingItemTemplate>
<FooterTemplate>
</div>
</FooterTemplate>
</asp:Repeater>
</p>
javascript function bellow
function UpdateOnlineCommunity(communityId, communityName, communityDescription, communityLink) {
var serviceData = JSON.stringify({
'communityId': communityId,
'communityName': communityName,
'communityDescription': communityDescription,
'communityLink': communityLink
});
$.ajax({
type: "POST",
url: "PresentationService.asmx/UpdateUserCommunity",
contentType: "application/json; charset=utf-8",
dataType: "json",
data: serviceData,
success: function(response) {
var data = response.d;
var dvOnlineCommunityMain = $("#dvOnlineCommunityMain");
var dvOnlineCommunity = $('<div/>', {
id: "dvOnlineCommunity",
class: "dvOnlineCommunity",
"data-id": data.CommunityID
});
var lblOnlineCommunityDescription = $('<span/>', {
id: "lblOnlineCommunityDescription",
text: data.Description
});
var pOnlineCommunityDetails = $('<p/>', {
id: "pOnlineCommunityDetails",
text: data.Detail
});
var linkOnlineCommunity = $('<a/>', {
id : "linkOnlineCommunity",
href : data.Link,
text: data.Link
});
var btnUpdateOnlineCommunity = $('<button/>', {
id: "btnUpdateOnlineCommunity",
class: "btnUpdateOnlineCommunity",
text: "Update"
});
var btnDeleteOnlineCommunity = $('<button/>', {
id: "btnDeleteOnlineCommunity",
class: "btnUpdateOnlineCommunity",
text: "Delete"
});
dvOnlineCommunity.append(lblOnlineCommunityDescription, pOnlineCommunityDetails, linkOnlineCommunity,
btnUpdateOnlineCommunity, btnDeleteOnlineCommunity);
dvOnlineCommunityMain.append(dvOnlineCommunity);
},
error: function(response) {
alert(response);
}
});
}
答案 0 :(得分:0)
您正在使用id
选择器作为dvOnlineCommunityMain
,但在您的html中,它被定义为class
。因此问题。
<div id="tblUseCommunities" class="dvOnlineCommunityMain">
所以,只需更改选择器以适应类..
var dvOnlineCommunityMain = $(".dvOnlineCommunityMain");