我有一个.asmx webservice,它从我的数据库中获取一些数据,并使用stringbuilder(VB.net)构建HTML。当我回来并提醒ajax返回的数据值时,我得到以下结果:
{"d":"\u003cdiv class=\"col-md-6\"\u003e\u003cform id=\"frmShoppingCart\"\u003e\u003ctable class=\"table\"\u003e\u003ctr\u003e\u003ctd width=\"25%\"\u003e\u003cimg src=\"/images/productImages/BBO/B1021TRA-GRN-1.jpg\u003c/td\u003e\u003ctd width=\"75%\"\u003e\u003cselect id=\"seaCombo\" class=\"form-control\"\u003e\u003coption value=\"2\"\u003e2\u003c/option\u003e\u003coption value=\"1\"\u003e1\u003c/option\u003e\u003c/select\u003e\u003cbr /\u003e\u003cbr /\u003e\u003ch4\u003eB1021TRA\u003c/h4\u003e\u003cbr /\u003e\u003cbr /\u003e\u003ch5\u003e\u003csmall\u003ePrice: $26.00 MSRP: $55.00\u003c/small\u003e\u003c/h5\u003e\u003c/td\u003e\u003c/tr\u003e\u003c/table\u003e\u003c!-- End Header Table --\u003e\u003c/div\u003e\u003c!-- col-md-6 --\u003e"}
以下是构建HTML的代码:
<WebMethod()> _
Public Function GetProductForPopup(strStyleID As String) As String
Dim sbHTML As New StringBuilder
Dim sbSeasons As New StringBuilder
Dim params As New Hashtable
Dim tProductList As New ProductList
Dim tSeasonProductList As New ProductList
Dim strLastSeason As String = ""
Dim strLastColor As String = ""
Dim blnFirstTime As Boolean = True
Dim blnSeasonsBuilt As Boolean = False
Dim strCboSeasons As String = ""
Dim strPopupHTML As String = ""
params.Add("product_code", strStyleID)
tProductList = CatalogManager.getProducts(params)
tSeasonProductList = CatalogManager.getProducts(params)
' Get all seasons in the product list we are going to work with
If Not blnSeasonsBuilt Then
sbSeasons.Append("<select id=""seaCombo"" class=""form-control"">")
For Each tSeaProd As Product In tSeasonProductList
If Trim(tSeaProd.season) <> strLastSeason Then
sbSeasons.Append("<option value=""" & Trim(tSeaProd.season) & """>" & Trim(tSeaProd.season) & "</option>")
strLastSeason = Trim(tSeaProd.season)
End If
Next
sbSeasons.Append("</select>")
blnSeasonsBuilt = True
strLastSeason = ""
strCboSeasons = sbSeasons.ToString()
End If
sbHTML.Append("<div class=""col-md-6"">")
sbHTML.Append("<form id=""frmShoppingCart"">")
For Each tProd As Product In tProductList
If blnFirstTime Then ' on first time through add the image and product information to the table
sbHTML.Append("<table class=""table"">")
sbHTML.Append("<tr><td width=""25%"">")
sbHTML.Append("<img src=""/images/productImages/BBO/" & tProd.code & "-" & tProd.color & "-1.jpg")
sbHTML.Append("</td><td width=""75%"">")
sbHTML.Append(strCboSeasons)
sbHTML.Append("<br /><br />")
sbHTML.Append("<h4>" & tProd.code & "</h4>")
sbHTML.Append("<br /><br />")
sbHTML.Append("<h5><small>")
sbHTML.Append("Price: " & FormatCurrency(tProd.price, 2) & " MSRP: " & FormatCurrency(tProd.msrp))
sbHTML.Append("</small></h5>")
sbHTML.Append("</td></tr></table><!-- End Header Table -->")
blnFirstTime = False
End If
If (strLastColor <> Trim(tProd.color)) Then ' Check to see if color matches -- if so then check for season match
If (strLastSeason <> Trim(tProd.season)) Then ' Season and color are different
Else ' Color is different but season is the same so add to the original table
End If
End If
strLastSeason = Trim(tProd.season)
strLastColor = Trim(tProd.color)
Next
sbHTML.Append("</div><!-- col-md-6 -->")
strPopupHTML = sbHTML.ToString()
Return strPopupHTML
End Function
以下是Javascript调用:
function productPopup(sProductTitle, sStyleID) {
$('#productModalLabel').html(sProductTitle);
$.ajax({
type: "POST",
url: "/webservices/ProductServer.asmx/GetProductForPopup",
data: "{ 'strStyleID':'" + sStyleID + "' }",
contentType: "application/json; character=utf-8",
dataType: "text",
success: function (data) {
$("#contentDiv").html(data);
alert("Success:" + data); },
failure: function (xhr, ajaxoptions, thrownError) {
alert("Error1:" + xhr.status);
alert("Error2:" + thrownError);
}
});
$('#productModal').modal();
}
如何将这些东西变成HTML?
答案 0 :(得分:1)
更改您的javascript以请求'json'dataType并在您的数据上使用.d属性,如下所示:
function productPopup(sProductTitle, sStyleID) {
$('#productModalLabel').html(sProductTitle);
$.ajax({
type: "POST",
url: "/webservices/ProductServer.asmx/GetProductForPopup",
data: "{ 'strStyleID':'" + sStyleID + "' }",
contentType: "application/json; character=utf-8",
dataType: "json",
success: function (data) {
$("#contentDiv").html(data.d);
alert("Success:" + data.d); },
failure: function (xhr, ajaxoptions, thrownError) {
alert("Error1:" + xhr.status);
alert("Error2:" + thrownError);
}
});
$('#productModal').modal();
}
您可以在此处查看data.d
原因的解释:http://encosia.com/a-breaking-change-between-versions-of-aspnet-ajax/