Question

我正在创建一个简单的电子商务网站。我有一个类别加载未解决的问题，但是当通过console.log检查加载成功时，却没有加载到页面。我不知道为什么。我附上下面的屏幕截图。

类别

     @model WebApplication40.Models.category
@{
    ViewBag.Title = "Index";
}


<html>
<head>

    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
</head>

<body>
    <div class="container-fluid bg-2 text-center">

        <div class="row">
            <div class="col-md-3">
                <div align="left">

                    <li class="list-group-item list-group-item-action active"><h4>Categories</h4></li>
                    <li>
                        <ul id="displayResults" class="list-group-item list-group-item- action"></ul>
                    </li>
                </div>
</div>

</body>
</html>

jQuery类别

function getCategory() {
                $.ajax({
                    type: 'GET',
                    url: '/home/Getcatgory',
                    dataType: 'JSON',
                    success: function (data) {


                        console.log(data);

                        for (var i = 0; i < data.length; i++) {
                            var catname = data[i].cat_name;
                            var catid = data[i].id;



                            //  if(catstatus){
                            $('#displayResults').append('<li id=' + catid + ' class="list-group-item list-group-item-action"><input cat_id="' + catid + '" name="chk1" type="checkbox" value="true" class="live" > ' + '  ' + ' <b>' + catname + '<b></li>');
                            //   }else{
                            //  $('#displayResults').append('<li id='+catid+' class="list-group-item list-group-item-action"><b>'+ data[i].catname + '<b><input id="cat_'+ catid +'" type="checkbox" class="view" ></li>');
                            //     }

                        }
                    },
                    error: function (xhr, status, error) {
                        console.log(xhr.message)
                    }
                });
            }

类别控制器

 public ActionResult Getcatgory()
        {
            using (kstoreEntities db = new kstoreEntities())
            {
                var category = db.categories.ToList();
                return Json(new { data = category }, JsonRequestBehavior.AllowGet);
            }
        }

kstoreEntities模型

public partial class category
    {
        public int id { get; set; }
        public string cat_name { get; set; }
    }

Answer 1

在Ajax成功函数中，您将获取JSON数据，其中所有值都附加有'data'键。

我们收到data.data的回复喜欢

success: function (data) {
    console.log(data.data);
    var result=data.data; //we get json result by "data" key

    for (var i = 0; i < result.length; i++) {
        var catname = result[i].cat_name;
        var catid = result[i].id;



        //  if(catstatus){
        $('#displayResults').append('<li id=' + catid + ' class="list-group-item list-group-item-action"><input cat_id="' + catid + '" name="chk1" type="checkbox" value="true" class="live" > ' + '  ' + ' <b>' + catname + '<b></li>');
        //   }else{
        //  $('#displayResults').append('<li id='+catid+' class="list-group-item list-group-item-action"><b>'+ data[i].catname + '<b><input id="cat_'+ catid +'" type="checkbox" class="view" ></li>');
        //     }

    }
},

使用Asp.net MVC Json无法将数据加载到页面

1 个答案: