javascript - 在jsf中使用json将数据从bean发送到javascript

标签 javascript json jsf

我想将我的数组列表从 managedBean 发送到 javascript 代码,

我的 bean 在这里:

public void getDataAsJson(){
    String [] dizi={"Tokyo","Jakarta","New York","Seoul",
              "Manila","Mumbai","Sao Paulo","Mexico City",
              "Dehli","Osaka","Cairo","Kolkata",
              "Los Angeles","Shanghai","Moscow","Beijing",
              "Buenos Aires","Guangzhou","Shenzhen","Istanbul"};

    Random rnd =new Random();

    JSONObject obj= new JSONObject();
    for (int i = 0; i < dizi.length; i++) 
        obj.put(dizi[i], new Integer(rnd.nextInt(80)));
}

我的 javascript 代码在 xhtml 页面中:

<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',
                zoomType: 'xy'
            },
            title: {
                text: 'avarage'
            },
            subtitle: {
                text: ''
            },
            xAxis: [{
                gridLineWidth: 0.5,
                categories: [// here is my city names which come from mybean]
            }],
            yAxis: [{ // Primary yAxis
                labels: {
                    formatter: function() {
                        return this.value;
                    },
                    style: {
                        color: '#89A54E'
                    }
                },
                title: {
                    text: 'avarage',
                    style: {
                        color: '#89A54E'
                    }
                }
            }],

            series: [{
                name: 'avarage',
                color: '#89A54E',
                type: 'spline',
                data: [// // here is my city's avarage which come from mybean],
                       labels: {
                        rotation: -90,
                        align: 'right',
                        style: {
                            fontSize: '13px',
                            fontFamily: 'Verdana, sans-serif'
                        }
                    }
            }]
        });
    });
});
//-->
</script>

这是我在 xhtml 页面中的正文:

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

最佳答案

您需要明白,在这个问题的上下文中,JSF 只是一个 HTML/JS 代码生成器。

您只需要让 JSF 打印所需的数据,使其以语法上有效的 JS 代码结束。

categories: #{bean.dataAsJson}

其中 getDataAsJson() 返回一个 String 表示所需的 JSON 代码。例如。 基本上:

public String getDataAsJson() {
    return "['foo', 'bar', 'baz']";
}

要验证结果,请在浏览器中右键单击页面并执行查看源代码

categories: ['foo', 'bar', 'baz']

关于javascript - 在jsf中使用json将数据从bean发送到javascript,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15478851/

相关文章:

javascript - 获取选定的文本位置并在其旁边放置一个元素

javascript - 为什么在 Selenium Webdriver (Java) 中 Gmail 密码字段无法发送带有 "sendkeys"的 key ?

json - 如何在 Vim 中保存时自动格式化 JSON

jsf - @ViewScoped bean 在 JSF 中如何以及何时被销毁?

Java Web 应用程序多用户 session 处理

javascript - 如何使用 jQuery 创建动态水平滚动?

javascript - 更改 JavaScript 数组给定维度的函数

Android:在 Android 中为应用程序离线存储 JSON 数据的最佳方式是什么?

python - 使用自定义 python JSON 编码器在字典中编码 float

java - JSF 1.1 的 Omnifaces 树的替代品