显示从 Json 到 <ul> 标记 MVC Javascript 的数据
Display Data from Json To <ul> Tag MVC Javascript
我有这个JavaScript功能
function GetAll()
{
$.ajax
({
type: method,
url: "/dash/GetMemebers",
dataType: 'JSON',
contentType: "application/Json; Charset= Utf-8"
})
}
在我的控制器中我这样做方法
public ActionResult GetMemebers()
{
var members = db.t_m.ToList();
return Json(new { data = members }, JsonRequestBehavior.AllowGet);
}
我需要将此数据显示到标签
这个HTML代码
<div class="row">
<div class="col-3">
<ul class="list-unstyled" id="list">
</ul>
</div>
</div>
如果我没理解错的话,你想在 ul
标签内显示 <li>..</li>
。更改如下代码:
1 - GetAll
js 函数
$.ajax({
url: "Home/GetMemebers",
type: "GET",
success: function (data) {
var lis = "";
$.each(data.data, function (index, value) {
lis += "<li>" + value + "</li>";
});
$("#list").html(lis);
},
error: function (response) {
alert(response);
}
});
2 - 控制器
public ActionResult GetMemebers()
{
var members = new List<string> { "1", "2", "3" };
return Json(new { data = members }, JsonRequestBehavior.AllowGet);
}
3 - 结果
<ul class="list-unstyled" id="list">
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
您可以选择在 GetMemebers
Action
中显示的内容。
希望对您有所帮助。
我有这个JavaScript功能
function GetAll()
{
$.ajax
({
type: method,
url: "/dash/GetMemebers",
dataType: 'JSON',
contentType: "application/Json; Charset= Utf-8"
})
}
在我的控制器中我这样做方法
public ActionResult GetMemebers()
{
var members = db.t_m.ToList();
return Json(new { data = members }, JsonRequestBehavior.AllowGet);
}
我需要将此数据显示到标签
这个HTML代码
<div class="row">
<div class="col-3">
<ul class="list-unstyled" id="list">
</ul>
</div>
</div>
如果我没理解错的话,你想在 ul
标签内显示 <li>..</li>
。更改如下代码:
1 - GetAll
js 函数
$.ajax({
url: "Home/GetMemebers",
type: "GET",
success: function (data) {
var lis = "";
$.each(data.data, function (index, value) {
lis += "<li>" + value + "</li>";
});
$("#list").html(lis);
},
error: function (response) {
alert(response);
}
});
2 - 控制器
public ActionResult GetMemebers()
{
var members = new List<string> { "1", "2", "3" };
return Json(new { data = members }, JsonRequestBehavior.AllowGet);
}
3 - 结果
<ul class="list-unstyled" id="list">
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
您可以选择在 GetMemebers
Action
中显示的内容。
希望对您有所帮助。