Asp.net将数据从代码隐藏传递到Javascript并调用数组

我有一个asp.net项目，它使用一些分析控件来查看各种数据。控件通过如下JavaScript函数填充：

 Morris.Bar({
              element: 'hero-bar',
              data: [
                  { device: '1', sells: 136 },
                  { device: '3G', sells: 1037 },
                  { device: '3GS', sells: 275 },
                  { device: '4', sells: 380 },
                  { device: '4S', sells: 655 },
                  { device: '5', sells: 1571 }
              ],
              xkey: 'device',
              ykeys: ['sells'],
              labels: ['Sells'],
              barRatio: 0.4,
              xLabelMargin: 10,
              hideHover: 'auto',
              barColors: ["#3d88ba"]
          });

我需要做的是通过从代码中传递一些值来填充“data:[]”数组（从数据库中获取实际值）

有谁能帮助我如何传递数据，以及数据需要以什么格式传递？如何将变量添加到JavaScript中

我可以通过在集合上的代码隐藏中运行foreach循环将其作为字符串数组传递，因此：

foreach(var item in items)
{
    //build array here called "myDataFromCodeBehind" 
    sb.Append(" { device: xVariable, sells: yVariable },");

}

然后从Javascript调用字符串数组

   var myData = "<%=myDataFromCodeBehind %>";

    Morris.Bar({
              element: 'hero-bar',
              data: [myData],
              // etc

var myData=”“；
莫里斯酒吧({
元素：'英雄酒吧'，
数据：[myData]，
//等

---

或者这不起作用吗？有些事情告诉我我完全弄错了。我是JavaScript新手，不确定这是否会起作用。

首先定义客户端中使用的JSON对象，如：

var YourBarParam = {
              element: 'hero-bar',
              data: [
                  { device: '1', sells: 136 },
                  { device: '3G', sells: 1037 },
                  { device: '3GS', sells: 275 },
                  { device: '4', sells: 380 },
                  { device: '4S', sells: 655 },
                  { device: '5', sells: 1571 }
              ],
              xkey: 'device',
              ykeys: ['sells'],
              labels: ['Sells'],
              barRatio: 0.4,
              xLabelMargin: 10,
              hideHover: 'auto',
              barColors: ["#3d88ba"]
          }

下一页，生成描述JSON对象的类

public class Datum
{
    public string device { get; set; }
    public int sells { get; set; }
}

public class RootObject
{
    public string element { get; set; }
    public List<Datum> data { get; set; }
    public string xkey { get; set; }
    public List<string> ykeys { get; set; }
    public List<string> labels { get; set; }
    public double barRatio { get; set; }
    public int xLabelMargin { get; set; }
    public string hideHover { get; set; }
    public List<string> barColors { get; set; }
}

---

您的理解是正确的。您需要做的是将

aspx

文件中的C#code调用到

script

部分（您在帖子中已经做过的）。使用Razor，它看起来是这样的：

<script>
    @{
        const string MyDevice = @"{ device: '5', sells: 1571 }";
    }


    var o = {
        element: 'hero-bar',
        data: [
            { device: '1', sells: 136 },
            { device: '3G', sells: 1037 },
            { device: '3GS', sells: 275 },
            { device: '4', sells: 380 },
            { device: '4S', sells: 655 },
            { device: '5', sells: 1571 },
            @Html.Raw(MyDevice)
        ],
        xkey: 'device',
        ykeys: ['sells'],
        labels: ['Sells'],
        barRatio: 0.4,
        xLabelMargin: 10,
        hideHover: 'auto',
        barColors: ["#3d88ba"]
    };

</script>

@{
常量字符串MyDevice=@“{device:'5'，sales:1571}”；
}
变量o={
元素：'英雄酒吧'，
数据：[
{设备：'1'，销售：136}，
{设备：'3G'，销售：1037}，
{设备：“3GS”，销售：275}，
{设备：'4'，销售：380}，
{设备：“4S”，销售：655}，
{设备：'5'，销售：1571}，
@Html.Raw（MyDevice）
],
xkey:'设备'，
ykeys:[“出售”]，
标签：[“出售”]，
拦河坝：0.4，
xLabelMargin:10，
隐藏：“自动”，
条形码颜色：[“#3d88ba”]
};

var myData = "<%# getBarObject()%>";

var myData = "<%= yourObject %>";

 yourObject = JsonConvert.SerializeObject(YourBarParam.data );

<script>
    @{
        const string MyDevice = @"{ device: '5', sells: 1571 }";
    }


    var o = {
        element: 'hero-bar',
        data: [
            { device: '1', sells: 136 },
            { device: '3G', sells: 1037 },
            { device: '3GS', sells: 275 },
            { device: '4', sells: 380 },
            { device: '4S', sells: 655 },
            { device: '5', sells: 1571 },
            @Html.Raw(MyDevice)
        ],
        xkey: 'device',
        ykeys: ['sells'],
        labels: ['Sells'],
        barRatio: 0.4,
        xLabelMargin: 10,
        hideHover: 'auto',
        barColors: ["#3d88ba"]
    };

</script>