各位前輩小弟又來發問了這次問題是顯示的數量正確,但是數值跟名稱都是undefined
確定傳遞的value都指定正確但都沒接收到求解20點
先感謝各位前輩的回覆
//js
<script>
$(document).ready(function () {
$.ajax({
type: "POST",
url: "@Url.Action("GetData", "BackSide")",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
var ctx = document.getElementById("doughnut-chart").getContext('2d');
var myChart = new Chart(ctx, {
type: 'doughnut',
data: {
labels: data.map(function (item) { return item.Name }),
datasets: [{
label: '# of Votes',
data: data.map(function (item) { return item.Value }),
backgroundColor: data.map(function (item) { return item.BackgroundColor }),
borderColor: data.map(function (item) { return item.BorderColor }),
borderWidth: 1
}]
},
options: {
responsive: true,
maintainAspectRatio: false
}
});
}
});
});
</script>
//C# Controller
[HttpPost]
public JsonResult GetData()
{
List<object> data = new List<object>
{
new { Name = "Data1", Value = 10, BackgroundColor = "#f44336", BorderColor = "#f44336" },
new { Name = "Data2", Value = 20, BackgroundColor = "#9c27b0", BorderColor = "#9c27b0" },
new { Name = "Data3", Value = 30, BackgroundColor = "#3f51b5", BorderColor = "#3f51b5" },
new { Name = "Data4", Value = 40, BackgroundColor = "#2196f3", BorderColor = "#2196f3" }
};
return Json(data);
}
從DevTools中的Network看到Preview取得的數值
[
{
"name": "Data1",
"value": 10,
"backgroundColor": "#f44336",
"borderColor": "#f44336"
},
{
"name": "Data2",
"value": 20,
"backgroundColor": "#9c27b0",
"borderColor": "#9c27b0"
},
{
"name": "Data3",
"value": 30,
"backgroundColor": "#3f51b5",
"borderColor": "#3f51b5"
},
{
"name": "Data4",
"value": 40,
"backgroundColor": "#2196f3",
"borderColor": "#2196f3"
}
]
但仍然顯示undefined
求解
看不太懂你問什麼
ajax成功進入Controller了?,也成功回拋了?
然後不是就從前端查看data是否正確嗎?
盡量可以把你錯誤的內容圖上傳才比較容易知道你的問題~
可以試試在success那邊補個console.log看一下data回來的是什麼
並且注意大小寫....js接收內容時都會自己更動大小寫,導致取值有誤等等....
成功回拋
前端看data也正確
[
{
"name": "Data1",
"value": 10,
"backgroundColor": "#f44336",
"borderColor": "#f44336"
},
{
"name": "Data2",
"value": 20,
"backgroundColor": "#9c27b0",
"borderColor": "#9c27b0"
},
{
"name": "Data3",
"value": 30,
"backgroundColor": "#3f51b5",
"borderColor": "#3f51b5"
},
{
"name": "Data4",
"value": 40,
"backgroundColor": "#2196f3",
"borderColor": "#2196f3"
}
]
但顯示仍然是undefined
labels: data.map(function (item) { return item.Name }),
屬性跟你json不合,name要小寫
你上一篇我就跟你說過了。後端傳的資料正不正確那不重要,重要的是傳回結果的屬性
froce
成功了...我眼殘沒注意到((
感謝你,可以使用回答方式給你最佳解答,我到底為啥沒看到= =
我不是就說要注意大小寫了嗎-.-?