0
私の質問は、DROPDOWNリストから従業員を選択したときにGoogleの円グラフにデータを表示したいのですが、私はwebmethodを使用しています。私は一人の従業員のためにそれを行うが、私は何をしたいのは、複数の従業員の記録を持っていると私は選択した複数の機能を持つリストボックスコントロールを使用しています。問題は、私が複数の従業員IDを渡しているときです。私は円グラフをフェッチできません。 同じコードです。複数のIDを渡してピーチャートデータを取得
[WebMethod]
public static IList GetPieChartDetails(string emp_id ,string FromDate,string ToDate)
{
DataSet EmpData = LeaveUpdate.sp_GetDataForGraphByEmp(emp_id ,FromDate,ToDate);
List<ChartDetails> l = new List<ChartDetails>();
for (int i = 0; i < EmpData.Tables[0].Rows.Count; i++)
{
ChartDetails ll = new ChartDetails();
ll.ProjectName = EmpData.Tables[0].Rows[i]["ProjectName"].ToString();
ll.WorkingUtilization = Convert.ToDecimal(EmpData.Tables[0].Rows[i]["WorkingUtilization"].ToString());
l.Add(ll);
}
#region Commented Code
//SqlCommand cmd = new SqlCommand("sp_GetDataForGraphByEmp", con);
// cmd.CommandType = CommandType.StoredProcedure;
// SqlDataAdapter da = new SqlDataAdapter();
// da.SelectCommand = cmd;
// DataTable dt = new DataTable();
// da.Fill(dt);
// List<ChartDetails> dataList = new List<ChartDetails>();
// foreach (DataRow dtrow in dt.Rows)
// {
// ChartDetails details = new ChartDetails();
// details.ProjectName = dtrow[0].ToString();
// details.WorkingUtilization = Convert.ToInt32(dtrow[1]);
// dataList.Add(details);
// }
#endregion
return l;
}
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
GetProjectName();
}
}
public class ChartDetails
{
public string ProjectName { get; set; }
public decimal WorkingUtilization { get; set; }
}
public void GetProjectName()
{
try
{
DataSet ds = Dotcom.BOL.EmployeeMST.GetAllEmployee();
ddlEmployee.DataTextField = "Name";
ddlEmployee.DataValueField = "Emp_ID";
ddlEmployee.DataSource = ds;
ddlEmployee.DataBind();
ddlEmployee.Items.Insert(0, new ListItem("--All--", "0"));
DataSet ds1 = Dotcom.BOL.EmployeeMST.GetAllEmployee();
lbData.DataTextField = "Name";
lbData.DataValueField = "Emp_ID";
lbData.DataSource = ds1;
lbData.DataBind();
lbData.Items.Insert(0, new ListItem("--All--", "0"));
}
catch (Exception)
{ }
}
後述のよう
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Pie Chart</title>
<script src="Scripts/jquery-1.4.1.js"></script>
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
</head>
<body>
<form id="form1" runat="server">
<div class="row">
<div class="col-md-12">
<div class="col-md-5">
<div class="form-group">
<label class="col-md-4 control-label" for="textinput">
From Date
</label>
<div class="col-md-8">
<div class="has-feedback">
<asp:TextBox ID="txtFromDate" class="form-control input-md datepicker-example8" placeholder="Date" runat="server"></asp:TextBox>
<label for="textinput" style="color: red">Kindly enter the date in format mm/dd/yy</label>
</div>
</div>
</div>
</div>
<br />
<div class="col-md-5">
<div class="form-group">
<label class="col-md-4 control-label" for="textinput">
To
</label>
<div class="col-md-8">
<div class="has-feedback">
<asp:TextBox ID="txtToDate" class="form-control input-md datepicker-example8" placeholder="Date" runat="server"></asp:TextBox>
<label for="textinput" style="color: red">Kindly enter the date in format mm/dd/yy</label>
</div>
</div>
</div>
</div>
</div>
</div>
<br />
<br />
<div>
<label for="textinput"><strong>Select Employee : </strong></label>
<asp:DropDownList ID="ddlEmployee" class="form-control" AutoPostBack="false" runat="server"></asp:DropDownList>
<br />
<br />
<asp:ListBox ID="lbData" runat="server" SelectionMode="Multiple"></asp:ListBox>
<br />
</div>
<div id="PieChartsDIV" style="width: 600px; height: 350px;">
</div>
</form>
</body>
<script type="text/javascript">
// Global variable to hold data
// Load the Visualization API and the piechart package.
google.load('visualization', '1', { packages: ['corechart'] });
</script>
<script type="text/javascript">
$('#lbData').focusout(function() {
debugger;
//var frmdate = $('#txtFromDate').val();
//var todate = $('#txtToDate').val();
$.ajax({
type: 'POST',
dataType: 'json',
contentType: 'application/json',
url: 'DemoChartsWithoutMaster.aspx/GetPieChartDetails',
data: "{emp_id:'" + $(this).val() + "' ,FromDate:'" + $('#txtFromDate').val() + "',ToDate:'" + $('#txtToDate').val() + "'}",
success: function (response) {
drawchart(response.d); // calling method
},
error: function() {
alert("Error loading data...........");
}
});
});
function drawchart(dataValues) {
// Callback that creates and populates a data table,
// instantiates the pie chart, passes in the data and
// draws it.
var data = new google.visualization.DataTable();
data.addColumn('string', 'ProjectName');
data.addColumn('number', 'WorkingUtilization');
for (var i = 0; i < dataValues.length; i++) {
data.addRow([dataValues[i].ProjectName, dataValues[i].WorkingUtilization]);
}
// Instantiate and draw our chart, passing in some options
var chart = new google.visualization.PieChart(document.getElementById('PieChartsDIV'));
var options = {
is3D: true,
};
chart.draw(data, options,
{
title: "Pie Chart of Google Chart in Asp.net",
position: "top",
fontsize: "14px",
chartArea: { width: '50%' },
});
}
</script>
</html>
コードファイルであり、次のように私は次のように手動で入力していたとき、私は使用しているストアドプロシージャは、「上記のコードで
alter proc sp_GetDataForGraphByEmp
@Emp_ID nvarchar(150),
@Fromdate nvarchar(50),
@Todate nvarchar(50)
as
begin
select ProjectName,SUM(CAST(WorkingUtilization AS float)) AS WorkingUtilization
from TimesheetReport
where (CAST(Emp_ID AS nvarchar(150))) in (@Emp_ID) and DateSubmit Between @Fromdate and @Todate
group by ProjectName
end
あります（30,36）で "私はデータを取得することができますが、コードを実行しているときにnull値を与えています。 でも、以下のコードではnullになっています。
exec sp_GetDataForGraphByEmp '30,36'
どのように私は、複数の従業員IDの
入力をありがとう、私はここで解決策を見つけたhttps://stackoverflow.com/questions/16872056/how-to-pass-string-parameter-with-in-operator-in-stored-procedure-sql-server-2 –
大量のIDを渡すことができる場合は、より良い解決策となる可能性のあるテーブル値のパラメータとしてコードを追加しました。 – strickt01
ご協力いただきありがとうございます。これを試してみてください –