打开Kettle工具,创建转换 通过使用Kettle工具,创建一个转换json_extract,并添加“JSON input”控件、“表输出”控件以及Hop跳连接线。
2.
配置JSON文件输入控件 双击“JSON input”控件,进入“JSON输入”界面。 单击【浏览】按钮,选择要抽取的JSON文件json_extract.json单击【增加】按钮,将所选择的文件添加到“选中的文件和目录”处。 单击“字段”选项卡,添加要抽取的数据字段(这里采用分层抽取数据字段,先抽取id和data字段,再从data字段中抽取field和value字段)。 双击“JSON input 2”控件,进入“JSON输入”界面。 勾选“源定义在一个字段里?”的复选框在“从字段获取源”处的下拉框中选择字段名,即data。 单击“字段”选项卡添加从字段data中抽取的field和value字段。
3.
配置表输出控件 双击“表输出”控件,进入“表输出”配置界面。 单击【新建】按钮,配置数据库连接,配置完成后单击【确认】按钮。 单击目标表右侧的【浏览】按钮,选择输出的目标表,即数据表json勾选“指定数据库字段”的复选框,用于将数据表json的字段与JSON文件json_extract.json中的字段进行匹配。 单击“数据库字段”选项卡,再单击【输入字段映射】按钮,d出“映射匹配”对话框,将“源字段”选项框的字段和“目标字段”选项框对应的字段进行映射匹配。 “表输出”控件配置的最终效果。
4.
运行转换json_extract 单击转换工作区顶部的 按钮,运行创建的json_extract转换。
废话就不多说了,就以楼主的例子来解答吧。
页面首先是一个下拉列表和多个复选框,那么假设页面中这个下拉列表的id为theClass,复选框的name为student,值为各个学生的姓名。
首先是页面加载进来的时候,在action里获取到所有的班级列表,以及默认的那个班级的学生列表。那么页面就可以使用jstl或者直接遍历,填充班级下拉列表和学生复选框。这个代码就不上了,都是java代码。
接下来要做的事,就是当班级下拉列表发生改变时,重新加载学生复选框住一块。这里通常使用ajax实现,代码类似于这样:
// 假设楼主使用了jquery,因为这样的话ajax请求会比较简单$(function(){
// 给班级下拉列表添加onchange事件
$('#theClass').bind('change', function(){
// 根据班级名称获取json格式的学生列表
$.post('返回学生列表的url',{class:'班级名称'},function(data){
// data就是返回的学生列表
// 移除原有的学生复选框
$(':checkbox[name=student]').remove()
// 根据json格式的返回值,重新创建学生复选框
// 遍历data,创建学生复选框
}, 'json')
})
})
所以楼主需要首先解决几个问题:
1、如何返回json格式的学生列表
这个问题不难,struts2可以解决,因为struts2可以返回json格式的数据,你到网上查一查。解决这个问题,你就知道那个返回学生列表的url该填什么值了。
2、返回的data是什么格式的
上面说到返回的data应该是json格式,具体其实应该是这样的:
[{name:'学生A',
id:'学生A的id'
},{
name:'学生B',
id:'学生B的id'
},{
name:'学生C',
id:'学生C的id'
}]
3、拿到data,如何生成新的学生复选框
这个是html节点 *** 作的问题。首先是要先移除原来的那些复选框的,这个上面的代码已经有了。接下来是创建新的复选框,大致如下:
var html = ""for(var i = 0, len = data.length i < len i++){
html += "<input type='checkbox' name='student' value='" + data[i].id + "'/>" + data[i].name
}
// 重新放到原来复选框的位置
$('#studentList').html(html)
至此,整个过程就结束了。
说起来是简单,但每一步都会有一些知识点,还是要研究一下才能做出来的。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)