如何将json数据显示为html <ul><li></li></ul> 在asp.net中使用jquery标记

Question

I am working on asp.net application where i am trying to fetch data from database in JSON format and display that JSON data into html-ul-li tag using jquery. 我在asp.net应用程序上工作，我试图从数据库中以JSON格式获取数据，并使用jquery将JSON数据显示到html-ul-li标记中。 My Html Page is: 我的HTML页面是：

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script language="javascript" type="text/javascript">
    //function GetCompanies() {
    $(document).ready(function () {

       $.ajax({
    type: "POST",
    url: "MobileServices.asmx/BindCategory",
    data: "{}",
    dataType: "json",
    contentType: "application/json; charset=utf-8",
    async: true,
    success: OnSuccess,
    error: OnError
});

function OnSuccess(data) {
    $.each(data, function (key, value{
        $("#ulCategory").append("<li><a rel=external href=Category_News.html?ID=" + value.Category_ID + ">" + value.Category_Name + "</li>");
    })

}
function OnError(data) {

}
    });
</script>
</head>
<body>
<form id="form1" runat="server">
    <div>
        <ul id="ulCategory">

        </ul>
    </div>
</form>
</body>
</html>

My WebService to Access the Data is : 我用于访问数据的WebService是：

using System;
using System.Collections.Generic;
using System.Data;
using System.Data.SqlClient;
using System.Linq;
using System.Web;
using System.Web.Services;
using Newtonsoft.Json;
using System.Configuration;
namespace MobileNewsAppication
{
/// <summary>
/// Summary description for MobileServices
/// </summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.ComponentModel.ToolboxItem(false)]


    [System.Web.Script.Services.ScriptService]
    public class MobileServices : System.Web.Services.WebService
    {

        public class NewsCategory
        {
            public long Category_ID { get; set; }
            public string Category_Name { get; set; }
            public string QFlag { get; set; }
        }



        [WebMethod]
        public string BindAllCategory()
        {
            DataTable dt = new DataTable();
            //List<NewsCategory> details = new List<NewsCategory>();

            using (SqlConnection con = new SqlConnection(Connection))
            {
                SqlCommand cmd = new SqlCommand("AllCategory_Select", con);
                cmd.CommandType = CommandType.StoredProcedure;

                con.Open();
                SqlDataAdapter da = new SqlDataAdapter(cmd);
                da.Fill(dt);
                return JsonConvert.SerializeObject(dt);

            }

        }
    }
    }

But the the ul Tag is not binding any list item inside. 但是ul标签未在其中绑定任何列表项。 I think foreach loop defined inside jquery OnSuccess method may be wrong. 我认为jquery OnSuccess方法内定义的foreach循环可能是错误的。 Please help me. 请帮我。

Answer 1

If this isn't a typo here then it's a syntax error causing the success callback to fail... 如果这里不是拼写错误，那就是语法错误，导致成功回调失败...

function OnSuccess(data) {
//  $.each(data, function (key, value{ <- this is wrong
    $.each(data, function() {
        $("#ulCategory").append("<li><a rel='external' href='Category_News.html?ID=" + this.Category_ID + "'>" + this.Category_Name + "</li>");
    });
}

Try using this inside each instead. 尝试在each内部使用this 。 I also wrapped the link attributes in quotes. 我还将链接属性用引号引起来。 Other than that it looks fine to me. 除此之外，对我来说还不错。 If that isn't the issue then put console.log(data); 如果这不是问题，那么请输入console.log(data); as the 1st line of the success callback and check the console for that and any errors. 作为成功回调的第一行，并在控制台中检查该错误和任何错误。

如何将json数据显示为html <ul><li></li></ul> 在asp.net中使用jquery标记

问题描述

1 个解决方案

解决方案1
2 2014-05-01 09:44:25

如何将json数据显示为html <ul><li></li></ul> 在asp.net中使用jquery标记

问题描述

1 个解决方案

解决方案1 2 2014-05-01 09:44:25

解决方案1
2 2014-05-01 09:44:25