Интеграция плагина jQuery с базой данных

Этот плагин отлично работает для статических значений. Но я хочу использовать значения из базы данных. Это трехмерная диаграмма. Я все пробовал, но не нашел решения. Это очень срочно для меня. Так что помогите. Я пробовал разные вещи. Искал все возможные сайты, которые могли бы это объяснить. Но пока ничего не помогло. Даже просматривал сайт, который делает такие плагины, но на нем не было надлежащей документации. Это будет gr8 для других разработчиков, которые хотят интегрировать любой плагин jQuery с их базой данных.Интеграция плагина jQuery с базой данных

<html> 
    <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
    <title>Highcharts Example</title> 




     <script type="text/javascript"> 
     var mysuperdata= null; 
     jQuery.ajax({ 
     url: url: "Default2.aspx/GetData", 
     contentType: "application/json; charset=utf-8", 
     data: { "param1": p1, "inicialDate": inicialDate, "finalDate": finalDate }, 
     dataType: "jsonp", 
     success: function (d) { mysuperdata = d } 
     }); 


    </script> 


<script 
    type="text/javascript"                     
    src= 
    "http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> 
<script type="text/javascript"> 
     $(function() { 
      var chart; 
      $(document).ready(function() { 
       chart = new Highcharts.Chart({ 
        chart: { 
         renderTo: 'container', 
         plotBackgroundColor: null, 
         plotBorderWidth: null, 
         plotShadow: false 
        }, 
        title: { 
         text: 'Browser market 
         shares at a specific website, 2010' 
        }, 
        tooltip: { 
         pointFormat: '{series.name}: 
          <b>{point.percentage}%</b>', 
         percentageDecimals: 1 
        }, 
        plotOptions: { 
         pie: { 
          allowPointSelect: true, 
          cursor: 'pointer', 
          dataLabels: { 
           enabled: true, 
           color: '#000000', 
           connectorColor: '#000000', 
           formatter: function() { 
            return '<b>' + this.point.name + 
            '</b>: ' + this.percentage + ' %'; 
           } 
          } 
         } 
        }, 
        series: [{ 
         type: 'pie', 
         name: 'Browser share', 
         data: mysuperdata 
        }] 
       }); 
      }); 

     }); 
    </script> 
    </head> 
    <body> 
    <script src="http://code.highcharts.com/highcharts.js"></script> 
     <script src="http://code.highcharts.com/modules/exporting.js"></script> 
      <div id="container" style="min-width: 400px; height: 
        400px; margin: 0 auto"></div> 

      </body> 
      </html>  using System; 
     using System.Collections.Generic; 
     using System.Linq; 
     using System.Web; 
     using System.Web.UI; 
     using System.Web.UI.WebControls; 
     using System.Web.Services; 
     using System.Web.Script.Services; 

     public partial class Default2 : System.Web.UI.Page 
     { 
     protected void Page_Load(object sender, EventArgs e) 
     { 

     } 
     [WebMethod] 
     [ScriptMethod(ResponseFormat = ResponseFormat.Json, XmlSerializeString = false)] 
     public static Array GetData() 
     { 
      return new Dictionary<string, double>() 
       { 
       { "Firefox", 45 }, 
       { "IE", 24.8 }, 
       { "Chrome", 12.8 }, 
       { "Safari", 8.5 }, 
       { "Opera", 5.2 }, 
       { "Outros", 3.7 }, 
       }.ToArray(); 
      } 
      }

Я отредактировал код adriano, но при этом он не работает. Он показывает пустую страницу. Я не знаю, что делать сейчас. Возможно, вы можете скопировать & вставьте мой код в свою Visual Studio и посмотрите, что случилось. Бадди помогает. Я дам вам свою щедрость сразу. Я просто хочу, чтобы это сделать

источник

2013-04-08 DividesByZero

[LINK] (http://stackoverflow.com/questions/15871794/jquery-plugin-to-integrate-with-database): два близких идентичных вопроса от разных людей в течение нескольких минут друг от друга: что происходит ? –

Вам нужно отправить другой запрос AJAX на сервер и сценарий сервера для получения значений из БД и возврата к вашему методу AJAX. Затем вы должны передать эти значения в свой модуль для построения диаграммы.

источник

2013-04-08 05:33:25

ребята помогают мне. Я начал эту награду, потому что мне действительно нужно это, чтобы случиться. На меня так много давления, чтобы завершить это. Я не получаю код. Потому что я очень новый. – DividesByZero

Адриано у меня есть только 9 часов, чтобы дать мою щедрость 150 очков.PLS ответьте на это до этого, так что я могу дать вам те моменты – DividesByZero

Трудно объяснить, но здесь мы используем высокие диаграммы и загружаем данные из базы данных.

Прежде всего, вам нужно знать, как использовать jquery для отправки вызова веб-методу, работающему с JSON. Если вы используете C#, вероятно, будет что-то вроде этого:

Javascript:

var mysuperdata= null; 
jQuery.ajax({ 
    url: url: "Data.aspx/GetData", 
    contentType: "application/json; charset=utf-8", 
    data: { }, 
    dataType: "jsonp", 
    success: function (d) { mysuperdata = d } 
});

В этом примере вы получаете доступ к странице Data.aspx execulting метод GetData не проходя никаких параметров. Но вы можете передавать параметры.

C#:

[WebMethod] 
[ScriptMethod(ResponseFormat = ResponseFormat.Json, XmlSerializeString = false)] 
public static Array GetData() 
{ 
    return new Dictionary<string, double>() 
    { 
     { "Firefox", 45 }, 
     { "IE", 24.8 }, 
     { "Chrome", 12.8 }, 
     { "Safari", 8.5 }, 
     { "Opera", 5.2 }, 
     { "Outros", 3.7 }, 
    }.ToArray(); 
}

Теперь мы знаем, чтобы получить данные! Важная вещь эти данные ваши данные серии на чатах, вы отправляете JSon:

 [ 
      ['Firefox', 45.0], 
      ['IE', 26.8], 
      { 
       name: 'Chrome', 
       y: 12.8, 
       sliced: true, 
       selected: true 
      }, 
      ['Safari', 8.5], 
      ['Opera', 6.2], 
      ['Others', 0.7] 
     ]

Ваш C# должен возвращать массив как этот объект, это легко установить с C#.

Наконец у вас есть диаграмма:

 $(function() { 
     var chart; 
     $(document).ready(function() { 
      chart = new Highcharts.Chart({ 
       chart: { 
        renderTo: 'container', 
        plotBackgroundColor: null, 
        plotBorderWidth: null, 
        plotShadow: false 
       }, 
       title: { 
        text: 'Browser market 
        shares at a specific website, 2010' 
       }, 
       tooltip: { 
        pointFormat: '{series.name}: 
         <b>{point.percentage}%</b>', 
        percentageDecimals: 1 
       }, 
       plotOptions: { 
        pie: { 
         allowPointSelect: true, 
         cursor: 'pointer', 
         dataLabels: { 
          enabled: true, 
          color: '#000000', 
          connectorColor: '#000000', 
          formatter: function() { 
           return '<b>' + this.point.name + 
           '</b>: ' + this.percentage + ' %'; 
          } 
         } 
        } 
       }, 
       series: [{ 
        type: 'pie', 
        name: 'Browser share', 
        data: mysuperdata 
       }] 
      }); 
     }); 

    });

Off Конечно, вы можете вернуть больше значение 1, ваш график 3D, вероятно, более сложный, опять же, это просто объяснение, как вы можете получить данные из базы данных и вставьте в диаграмму ... Пожалуйста, постарайтесь поставить проблемы!

источник

2013-04-12 16:33:21

извините adriano, но я не смог получить вас правильно. Я очень безмолв к этому. Но все же я стараюсь изо всех сил понять это. Это было бы gr8, если бы вы могли сделать это более понятно с моим примером – DividesByZero

Я пробовал ваш код. но кажется, что им не удалось понять, как это сделать. ru. Вы можете опубликовать код webmethod – DividesByZero

@DividesByZero Для атрибута 'WebMethod' используйте' [System.Web. Services.WebMethod] 'или добавить в начало файла класса' using System.Web.Services; '. – Jesse

Если вы не хотите совершать вызов ajax/json, вы можете выполнить мой метод записи функции jquery динамически, а затем зарегистрировать его через startupscript. вот код.

void loadchart() 
{ 
    DateTime strat = DateTime.Parse(DropDownList1.SelectedValue); 
    int day = strat.Day; 
    int tosub = day - 1; 
    strat = strat.AddDays((0 - tosub)); 
    DateTime edate = strat.AddMonths(1); 
    edate = edate.AddDays(-1); 
    double tot = 0; 
    string jq = "<script type=\"text/javascript\"> $(document).ready(function() { var line1 = ["; 
    while (strat <= edate) 
    { 
      string x = strat.ToString("dd/MMM/yy"); 
      double y = getregularorderamount(strat); 
      tot += y; 
      jq += "['"+x+"', "+y.ToString()+"],"; 
      strat = strat.AddDays(1); 
    } 
    jq = jq.Substring(0, jq.Length - 1); 
    jq += @"]; 
     var plot1 = $.jqplot('chart1', [line1], { 
     animate: true,"; 
    jq += "title: 'Total Order Amount For The Month Of - " + DateTime.Parse(DropDownList1.SelectedValue).ToString("MMMM-yyyy") + " = &#x20B9;" + tot.ToString() + "',"; 
     jq += @"  axes: { 
       xaxis: { 
        renderer: $.jqplot.DateAxisRenderer, 
        tickOptions: { 
         formatString: '%b&nbsp;%#d' 
        } 
       }, 
       yaxis: { 
         min:0, 
        tickOptions: { 
         formatString: '&#x20B9;%.0f' 
        } 
       } 
      }, 
      highlighter: { 
       show: true, 
       sizeAdjust: 7.5, 
       formatString: 'On date: %s, Total sale amount: %s' 
      }, 
      cursor: { 
       show: false 
      } 
     }); 
    });"; 
    jq+="</script>"; 
    ScriptManager.RegisterStartupScript(this, this.GetType(), "bgh", jq, false);

Надеюсь, этот грязный метод поможет.

источник

2013-04-15 11:00:19 Ratna

thnx ratna я попробую его – DividesByZero

вы также можете использовать литеральный контроль вместо register.startupscript. – Ratna

Интеграция плагина jQuery с базой данных

ответ

Смежные вопросы