本文主要是介绍HAP框架学习之——LOV使用,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
LOV的作用:通过自定义SQL语句或者调用mapper中的方法查询数据库,通过弹出窗口的形式提供数据选择的组件。
例子:查询学生表,通过输入学生学号模糊查询学生信息。
1、数据库中创建学生表并插入原始数据。
2、创建LOV
新建属性解释:
- 代码:该LOV的唯一标识,在viewModel中调用的值。
- ValueField:选中的查询记录代表的值。
- TextField:选中的查询记录显示的值,与ValueField配对,如性别显示的值(TextField)为:男、女,但实际用0代表男,用1代表女,这里的0,1就对应ValueFiled。在本例中则代表:显示的是姓名,但该姓名关联的是学号。
- SQL类型:
- 1、自定义SQL:该SQL类型需要自己在自定义SQL文本域中按照mybatis的语句格式定义SQL语句。
- 2、SQL ID:选中该SQL类型,在SQL ID文本框中输入mapper中对应的查询方法,格式为:StudentMapper.findStuByID,在StudentMapper,java类中需要定义该方法。
- 3、URL:对应一个可以查询出数据的URL,例如Controller中的某个URL路径。
- 高度/宽度:LOV弹出框的高度和宽度。
- 列数:Lov弹出窗口中,查询字段输入框布局的列数。值域为[0,4]。
- 描述/标题/提示:分别对应LOV的描述(在LOV管理页面中显示)、LOV弹出窗口标题、LOV输入框的提示(placeholder)
- 页大小:每页显示的记录数。
- 行信息:
- 显示:列名
- 字段名:对应SQL语句中返回的类型。
- 表格列:是否在搜索出来的记录中显示。
- 查询字段:是否作为查询字段,如果是,则会出现对应的搜索框。
自定义查询语句为【符合Mybatis的语句规范】:
select stu_id,stu_name,stu_age from hmall_hnuc_student
<where><if test="stuId != null">stu_id like concat("%",#{stuId},"%")</if>
</where>
3、预览结果为:
搜索框的出现是勾选了学号作为查询字段的结果,而下面表格显示的列名对应新建LOV时的行信息。显示的值是新建LOV时行信息的字段名命名为SQL语句查询字段的驼峰命名对应的结果。也就是stu_id对应stuId,stu_name对应stuName,stu_age对应stuAge。
4、双击选择学生记录后搜索框会消失,在文本框中显示TextField对应的值,即上图创建LOV时的stuName:
5、最后在html中用kendoUI调用过程如下:
<input data-bind="value:model.stuName"id="searchStu"style="width: 100%">
<script>$("#searchStu").kendoLov(<@lov "LOV_SEARCHSTUDENTBYID" />);
</script>
到此基本LOV的使用就完成了。
这篇关于HAP框架学习之——LOV使用的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!