在页面加载时,会绘制一个charts.js图表(下面有更多内容)。我也有一些复选框,比如......
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Xml;
using System.Xml.Linq;
namespace ConsoleApplication1
{
class Program
{
static void Main(string[] args)
{
string xml =
"<?xml version=\"1.0\" encoding=\"utf-8\" ?>" +
"<queries>" +
"<selectparent table=\"Associates\">\"SELECT * FROM @table\"</selectparent>" +
"<selectchild table=\"VehicleContract\">\"SELECT * FROM @table\"</selectchild>" +
"<addchild table=\"VehicleContract\" read=\"contractId, regNr, assoc_id, percentage, vehicleType, trailerNr\">\"INSERT into @table (contractId, regNr, assoc_id, percentage, vehicleType, trailerNr) VALUES (@id, @reg, @assort, @perc, @type, @trailer)\"</addchild>" +
"<updatechild table=\"VehicleContract\" read=\"contractId, regNr, assoc_id, percentage, vehicleType, trailerNr\">\"UPDATE @table SET regNr=@reg, assoc_id=@assort, percentage=@perc, vehicleType=@type, trailerNr=@trailer WHERE contractId=@id\"</updatechild>" +
"<removechild table=\"VehicleContract\" read=\"id\">\"DELETE from @table WHERE contractId=@id\"</removechild>" +
"</queries>";
XDocument doc = XDocument.Parse(xml);
var results = doc.Elements("queries").Select(x => new
{
selectParent = x.Elements("selectparent").Select(y => new
{
table = (string)y.Attribute("table"),
value = y.Value
}).FirstOrDefault(),
selectChild = x.Elements("selectchild").Select(y => new
{
table = (string)y.Attribute("table"),
value = y.Value
}).FirstOrDefault(),
addChild = x.Elements("addchild").Select(y => new
{
table = (string)y.Attribute("table"),
read = (string)y.Attribute("read"),
value = y.Value
}).FirstOrDefault(),
updateChild = x.Elements("updatechild").Select(y => new
{
table = (string)y.Attribute("table"),
read = (string)y.Attribute("read"),
value = y.Value
}).FirstOrDefault(),
removeChild = x.Elements("removechild").Select(y => new
{
table = (string)y.Attribute("table"),
read = (string)y.Attribute("read"),
value = y.Value
}).FirstOrDefault(),
}).FirstOrDefault();
}
}
}
我有这个JS用于创建变量,然后查看是否选中了复选框,然后保持值相同或者给它一个新值0.我还有一个updateBreakdown()函数,它会破坏图表和重新绘制它。
下面是我的chart.js图表代码。请注意,数据使用我的变量作为&#34;值&#34;。在页面加载时,图表创建正常。当我取消选中一个方框时,例如,&#34;&#34;&#34;在框中,something变量的值应该更改为0,因此,当重新绘制时,它不应占用图表上的任何空间。但总是出现25。
所以我可能错了,但我觉得我最初声明变量和/或我如何保持其范围有问题?
或许我只需要做一些不同的事情来制作chart.js数据&#34;刷新&#34;用作值的变量?
任何人都会看到我出错的地方?
<input type="checkbox" id="something" name="something" value="25" data-val="25" checked="checked" class="option">
<label for="something">Something</label>
<input type="checkbox" id="other" name="other" value="5" data-val="5" checked="checked" class="option">
<label for="other">Other</label>
答案 0 :(得分:1)
在创建新图表之前,尝试为doughnutData提供新的配置数据。
function updateBreakdown() {
// create the graph from scratch
doughnutChart.destroy();
var doughnutData = [
{
value: something,
label: 'My something Label',
color: '#811BD6'
},
{
value: other,
label: 'My other label',
color: '#D18177'
}
];
doughnutChart = new Chart(ctx).Doughnut(doughnutData, {
percentageInnerCutout: 55
});
}
并进行更改:
if ($('#something').is(':checked')) {
//var something = 25;//replace these
something = 25;//with these
} else {
//var something = 0;
something = 0;
}
if ($('#other').is(':checked')) {
//var other= 5;
other= 5;
} else {
//var other= 0;
other= 0;
}