Post
Ask Question
nitish rai

nitish rai

  • 1.3k
  • 319
  • 16.7k

checkboxlist select query in j query

Jan 19 2018 3:49 AM
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<img src="logo_73492.gif" style="width: 262px; height: 55px; margin-top: 0px" />
</head>
<body>
<form id="form1" runat="server">
<div>
<table>
<tr>
<td>
<asp:CheckBoxList ID="chktagindex" runat="server" Width="162px">
<asp:ListItem>TagIndex1</asp:ListItem>
<asp:ListItem>TagIndex2</asp:ListItem>
<asp:ListItem>TagIndex3</asp:ListItem>
</asp:CheckBoxList>
<asp:Button ID="Btnselect" runat="server" Text="Submit" OnClick="Btnselect_Click" />
</td>
</tr>
</table>
<canvas id="Chart" width="1200" height="700"></canvas>
</div>
</form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/1.0.2/Chart.js"></script>
<script type="text/javascript">
$(function () {
$("[id*=Btnselect]").show(function () {
var obj = {};
obj.CheckBoxList = $.trim($("[id*=chktagindex]").val());
//obj.FromDate = $.trim($("[id*=txtfromdate]").val());
//obj.ToDate = $.trim($("[id*=txttodate]").val());
var ctx = document.getElementById("Chart").getContext('2d');
$.ajax({
url: "Default.aspx/getChartData",
type: "POST",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
var chartLabel = eval(response.d[0]); //Labels
var chartData = eval(response.d[1]); //Data
var chartData1 = eval(response.d[2]); //Data
var chartData2 = eval(response.d[3]); //Data
var chartData3 = eval(response.d[4]); //Data
var chartData4 = eval(response.d[5]); //Data
var barData = {
labels: chartLabel,
datasets: [
{
label: 'ActivePower',
fillColor: "rgba(225,225,225,0.2)",
strokeColor: "Blue",
pointColor: "rgba(220,220,220,1)",
pointStrokeColor: "Green",
pointHighlightFill: "#fff",
pointHighlightStroke: "rgba(220,220,220,1)",
data: chartData
},
{
label: 'PowerFactor',
fillColor: "rgba(225,225,225,0.2)",
strokeColor: "Crimson",
pointColor: "rgba(220,220,220,1)",
pointStrokeColor: "HotPink",
pointHighlightFill: "#fff",
pointHighlightStroke: "rgba(220,220,220,1)",
data: chartData1
},
{
label: 'Voltage',
fillColor: "rgba(225,225,225,0.2)",
strokeColor: "orange",
pointColor: "rgba(220,220,220,1)",
pointStrokeColor: "Red",
pointHighlightFill: "#fff",
pointHighlightStroke: "rgba(220,220,220,1)",
data: chartData2
}, {
label: 'Current',
fillColor: "rgba(225,225,225,0.2)",
strokeColor: "Cyan",
pointColor: "rgba(220,220,220,1)",
pointStrokeColor: "Aqua",
pointHighlightFill: "#fff",
pointHighlightStroke: "rgba(220,220,220,1)",
data: chartData3
}, {
label: 'frequency',
fillColor: "rgba(225,225,225,0.2)",
strokeColor: "Coral",
pointColor: "rgba(220,220,220,1)",
pointStrokeColor: "black",
pointHighlightFill: "#fff",
pointHighlightStroke: "rgba(220,220,220,1)",
data: chartData4
},
]
};
alert('ok1');
var skillsChart = new Chart(ctx).Line(barData);
}
});
}
);
});
</script>
</body>
</html>

Answers (2)