4
Answers

Need Jquery Call From C# Code Behind

Photo of Pothi Sam

Pothi Sam
7y
763
1
  1. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>  
  2. <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>  
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  4. <html xmlns="http://www.w3.org/1999/xhtml">  
  5. <head runat="server">  
  6. <title></title>  
  7. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>  
  8. <script type="text/javascript" src="//www.google.com/jsapi"></script>  
  9. <script type="text/javascript">  
  10. google.load('visualization', '1', { packages: ['corechart'] });  
  11. </script>  
  12. <script type="text/javascript">  
  13. $(document).ready(function () {  
  14. $.ajax({  
  15. type: 'POST',  
  16. dataType: 'json',  
  17. contentType: 'application/json',  
  18. url: 'Default.aspx/GetData',  
  19. data: '{}',  
  20. success:  
  21. function (response) {  
  22. drawVisualization(response.d);  
  23. }  
  24. });  
  25. })  
  26. function drawVisualization(dataValues) {  
  27. var data = new google.visualization.DataTable();  
  28. data.addColumn('string', 'Column Name');  
  29. data.addColumn('number', 'Column Value');  
  30. for (var i = 0; i < dataValues.length; i++) {  
  31. data.addRow([dataValues[i].ColumnName, dataValues[i].Value]);  
  32. }  
  33. new google.visualization.PieChart(document.getElementById('visualization')).  
  34. draw(data, { title: "Google Chart demo" });  
  35. }  
  36. </script>  
  37. </head>  
  38. <body>  
  39. <form id="form1" runat="server">  
  40. <div id="visualization" style="width: 600px; height: 350px;">  
  41. </div>  
  42. </form>  
  43. </body>  
  44. </html>  
  1. using System;  
  2. using System.Collections.Generic;  
  3. using System.Linq;  
  4. using System.Web;  
  5. using System.Web.UI;  
  6. using System.Web.UI.WebControls;  
  7. using System.Data;  
  8. using System.Data.SqlClient;  
  9. using System.Web.Services;  
  10. public partial class _Default : System.Web.UI.Page  
  11. {  
  12. protected void Page_Load(object sender, EventArgs e)  
  13. {  
  14. }  
  15. [WebMethod]  
  16. public static List<Data> GetData()  
  17. {  
  18. SqlConnection conn = new SqlConnection("Data Source=SPIDER;Initial Catalog=Northwind;Integrated Security=True");  
  19. DataSet ds = new DataSet();  
  20. DataTable dt = new DataTable();  
  21. conn.Open();  
  22. string cmdstr = "select top 5 Country, COUNT(CompanyName) [Total Suppliers] from [Suppliers] group by Country";  
  23. SqlCommand cmd = new SqlCommand(cmdstr, conn);  
  24. SqlDataAdapter adp = new SqlDataAdapter(cmd);  
  25. adp.Fill(ds);  
  26. dt = ds.Tables[0];  
  27. List<Data> dataList = new List<Data>();  
  28. string cat="";  
  29. int val=0;  
  30. foreach (DataRow dr in dt.Rows)  
  31. {  
  32. cat=dr[0].ToString();  
  33. val=Convert.ToInt32( dr[1]);  
  34. dataList.Add(new Data(cat, val));  
  35. }  
  36. return dataList;  
  37. }  
  38. }  
  39. public class Data  
  40. {  
  41. public string ColumnName = "";  
  42. public int Value = 0;  
  43. public Data(string columnName, int value)  
  44. {  
  45. ColumnName = columnName;  
  46. Value = value;  
  47. }  
  48. }  
That is google pie Chart Example I need To Call pie Chart From Code Behind like
  1. private void BindChart()  
  2. {  
  3. DataTable dt = new DataTable();  
  4. try  
  5. {  
  6. dt = GetData();  
  7. str.Append(@"<script type=*text/javascript*> google.load( *visualization*, *1*, {packages:[*corechart*]});  
  8. google.setOnLoadCallback(drawChart);  
  9. function drawChart() {  
  10. var data = new google.visualization.DataTable();  
  11. data.addColumn('string', 'Year');  
  12. data.addColumn('number', 'Sales');  
  13. data.addRows(" + dt.Rows.Count + ");");  
  14. for (int i = 0; i <= dt.Rows.Count - 1; i++)  
  15. {  
  16. str.Append("data.setValue( " + i + "," + 0 + "," + "'" + dt.Rows[i]["year"].ToString() + "');");  
  17. str.Append("data.setValue(" + i + "," + 1 + "," + dt.Rows[i]["Sales"].ToString() + ") ;");  
  18. }  
  19. str.Append(" var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));");  
  20. str.Append(" chart.draw(data, {width: 550, height: 300, title: 'Company Performance',");  
  21. str.Append("hAxis: {title: 'Year', titleTextStyle: {color: 'green'}}");  
  22. str.Append("}); }");  
  23. str.Append("</script>");  
  24. lt.Text = str.ToString().Replace('*', '"');  
  25. }  
  26. catch  
  27. { }  
  28. }  
  29. } 

Answers (4)

Next Recommended Forum