Struts2的%,#,$的区别,UI标签及其表单radio,checkbox,select回显数据(七)下

简介: Struts2的%,#,$的区别,UI标签及其表单radio,checkbox,select回显数据(七)

五. <s:select> </s:select> 选择框


五.一 前端展示


五.一.一 前端map 展示


map类型表示:


<s:select name="education" list="#{'1':'初中','2':'高中','3':'大学','4':'研究生'}"
    value="3" headerKey="" headerValue="----请选择学历-------"></s:select>


五.一.二 前端 list 展示


也可以用list类型进行表示


<s:select name="education" list="{'初中','高中','大学','研究生'}"
    value="'大学'" headerKey="" headerValue="----请选择学历-------"></s:select>


map时 key表示传递的真实数据,value表示在页面上显示的数据。


list时,key与value的值相同,与<s:radio> <s:checkboxlist> 用法基本一样。


20200609113849274.png


k只是 select选择框也是可以进行多选的,有一个multiple的属性,值为true或者false(默认为false)


<s:select name="education" list="#{'1':'初中','2':'高中','3':'大学','4':'研究生'}"
    value="{'1','3'}" headerKey="" headerValue="----请选择学历-------"
    multiple="true" size="6"></s:select>


不能用multiple=“multiple”,这样是显示不出来的,也不能单独一个multiple,会报错的,


必须设置成 multiple=“true” 。


size为显示的数目,如果要显示的数目过多,而数据量小,那么下面会用空格进行填充。


2020060911390474.png


从后台传递学历的值来进行显示。


五.二 学历是单个值的普通字段情况


五.二.一 User.java 类


User.java中添加education 学历的属性值


/**
 * @param education 学历
 */
private String education;


实现 setter 和 getter 方法


五.二.二 创建SelectAction.java


SelectAction


public class SelectAction extends ActionSupport{
  private static final long serialVersionUID = 1L;
  public String getData(){
    //存储常量学历的集合
    List<String> eduList=new ArrayList<String>();
    eduList.add("初中");
    eduList.add("高中");
    eduList.add("大学");
    eduList.add("研究生");
    //将学历的集合放置到Request域中
    ActionContext.getContext().put("eduList",eduList);
    //设置用户
    User user7=new User(7,"两个蝴蝶飞","123","男",24,"在下");
    user7.setEducation("大学");
    //将user7用户放置到ValueStack的栈顶
    ActionContext.getContext().getValueStack().push(user7);
    return "select";
  }
} 


五.二.三 配置 struts.xml 文件


<!-- 配置select 多选框显示 -->
<action name="Select_*" class="com.yjl.web.action.SelectAction" method="{1}">
  <result name="select">/WEB-INF/content/select.jsp</result>
</action>


五.二.四 编写 /content/select.jsp 页面


在前端界面:


<s:select name="education" list="#request.eduList"
    value="%{education}" headerKey="" headerValue="----请选择学历-------"></s:select>


输入网址: http://localhost:8080/Struts_Data/Select_getData


会显示:


20200609113919736.png


五.三 学历是多个普通值的情况,可以多选


五.三.一 User.java 中添加集合属性 educations


User.java


/**
 * @param educations 学历多选
 */
private List<String> educations=new ArrayList<String>();


当为集合时,需要在类中就直接实例化,避免出现空指向的问题。


实现setter 和getter 方法


五.三.二 SelectAction 中添加新方法 getData2()


public String getData2(){
  List<String> eduList=new ArrayList<String>();
  eduList.add("初中");
  eduList.add("高中");
  eduList.add("大学");
  eduList.add("研究生");
  //将学历的集合放置到Request域中
  ActionContext.getContext().put("eduList",eduList);
  //设置用户
  User user7=new User(7,"两个蝴蝶飞","123","男",24,"在下");
  user7.getEducations().add("大学");
  user7.getEducations().add("研究生");
  //将user7用户放置到ValueStack的栈顶
  ActionContext.getContext().getValueStack().push(user7);
  return "select";
}   


五.三.三 配置struts.xml


不需要改变


五.三.四 编写 /content/select.jsp 页面


前端:


<s:select name="educations" list="#request.eduList"
     headerKey="" headerValue="----请选择学历-------"
    multiple="true" size="%{#request.eduList.size+1}"></s:select>


这个时候,不需要写value="" ,size时用size+1,+1加的是上面的头


输入网址: http://localhost:8080/Struts_Data/Select_getData2


显示:


20200412200643698.png


五.四 学历是单个对象(常用于显示学生所在的专业,班级和学院)


五.四.一 User.java


User.java


/**
   * @param education1 学历
   */
private SystemConn education1;


实现setter 和getter 方法


五.四.二 编写 SelectAction,添加 getData3() 方法


Action中


public String getData3(){
    List<SystemConn> eduList=new ArrayList<SystemConn>();
    //模拟数据
    SystemConn s1=new SystemConn(1,"edu","初中","初中");
    SystemConn s2=new SystemConn(2,"edu","高中","高中");
    SystemConn s3=new SystemConn(3,"edu","大学","大学");
    SystemConn s4=new SystemConn(4,"edu","研究生","研究生");
    //将数据添加到集合中
    eduList.add(s1);
    eduList.add(s2);
    eduList.add(s3);
    eduList.add(s4);
    //将学历的集合放置到Request域中
    ActionContext.getContext().put("eduList",eduList);
    //设置用户
    User user7=new User(7,"两个蝴蝶飞","123","男",24,"在下");
    user7.setEducation1(s3);
    //将user7用户放置到ValueStack的栈顶
    ActionContext.getContext().getValueStack().push(user7);
    return "select";
  }        


五.四.三 配置struts.xml


不需要配置


五.四.四 编写 select.jsp 页面


前端页面:


        <s:select name="education1" list="#request.eduList"
    listKey="id" listValue="value"
     headerKey="" headerValue="----请选择学历-------"
     value="%{education1.id}"
     ></s:select>


其中,添加了两个属性, listKey, listValue, 其中listKey表示的是真正传递的数据,listValue为页面上显示的数据。


五.五 学历是多个List对象(常用于角色的选择)


五.五.一 User.java


User.java


/**
   * @param educations 学历
   */
  private List<SystemConn> educations1=new ArrayList<SystemConn>();


实现setter 和getter 方法


五.五.二 SelectAction 中添加 getData4() 方法


Action


 public String getData4(){
     List<SystemConn> eduList=new ArrayList<SystemConn>();
    //模拟数据
    SystemConn s1=new SystemConn(1,"edu","初中","初中");
    SystemConn s2=new SystemConn(2,"edu","高中","高中");
    SystemConn s3=new SystemConn(3,"edu","大学","大学");
    SystemConn s4=new SystemConn(4,"edu","研究生","研究生");
    //将数据添加到集合中
    eduList.add(s1);
    eduList.add(s2);
    eduList.add(s3);
    eduList.add(s4);
    //将学历的集合放置到Request域中
    ActionContext.getContext().put("eduList",eduList);
    //设置用户
    User user7=new User(7,"两个蝴蝶飞","123","男",24,"在下");
    user7.getEducations1().add(s3);
    user7.getEducations1().add(s4);
    //将user7用户放置到ValueStack的栈顶
    ActionContext.getContext().getValueStack().push(user7);
    return "select";
  }      


五.五.三 配置struts.xml 文件


不需要改变


五.五.四 编写 /content/select.jsp 页面


<s:select name="education1" list="#request.eduList"
    listKey="id" listValue="value"
     headerKey="" headerValue="----请选择学历-------"
     value="%{educations1.{id}}" multiple="true" size="%{#request.eduList.size+1}"
     ></s:select>


注意此时value的写法. educations.{id}


输入网址: http://localhost:8080/Struts_Data/Select_getData4


运行结果:


20200412200655118.png


这就是struts的UI标签的常用用法。


本章节代码链接为:


链接:https://pan.baidu.com/s/1uen9t3Jm2yHfz0Zicr__Vg 
提取码:t1jl


谢谢您的观看!!!

相关文章
|
4月前
|
前端开发 JavaScript UED
element-ui 表格数据究竟隐藏着怎样的神秘样式与格式化技巧?快来揭开谜底!
【8月更文挑战第22天】《element-ui 表格数据样式及格式化案例》展示了如何利用 element-ui 的表格组件实现美观且易读的数据展示。通过简单配置,可以自定义表格样式,如边框、背景色等,并通过 formatter 实现数据格式化,例如将成绩保留一位小数。此外,还能依据条件设置行样式,如成绩达优则高亮显示,从而增强用户体验和数据可读性。
80 1
|
4月前
|
计算机视觉
ElementUI——vue2+element-ui 2.x的动态表格和表单
ElementUI——vue2+element-ui 2.x的动态表格和表单
176 1
|
5月前
element UI 组件封装--搜索表单(含插槽和内嵌组件)
element UI 组件封装--搜索表单(含插槽和内嵌组件)
175 5
|
5月前
|
JavaScript
vue + element UI 表单中内嵌自定义组件的表单校验触发方案
vue + element UI 表单中内嵌自定义组件的表单校验触发方案
168 5
|
5月前
Element UI【级联选择器】el-cascader 获取选中内容的 label 数据,鼠标悬浮显示超长内容
Element UI【级联选择器】el-cascader 获取选中内容的 label 数据,鼠标悬浮显示超长内容
755 3
|
5月前
Element UI 多选表格【翻页多选】简易版(不支持翻页多选数据反显)
Element UI 多选表格【翻页多选】简易版(不支持翻页多选数据反显)
137 0
|
5月前
软件研发核心问题之在需求拆解过程中,“数据与UI如何关联”的问题如何解决
软件研发核心问题之在需求拆解过程中,“数据与UI如何关联”的问题如何解决
|
5月前
|
UED
Element UI 一键校验多表单(v-for循环表单,异步校验规则,v-for 中的 ref 属性,避坑 forEach 不支持异步 await )
Element UI 一键校验多表单(v-for循环表单,异步校验规则,v-for 中的 ref 属性,避坑 forEach 不支持异步 await )
61 0
|
1月前
|
搜索推荐 Android开发 开发者
探索安卓开发中的自定义视图:打造个性化UI组件
【10月更文挑战第39天】在安卓开发的世界中,自定义视图是实现独特界面设计的关键。本文将引导你理解自定义视图的概念、创建流程,以及如何通过它们增强应用的用户体验。我们将从基础出发,逐步深入,最终让你能够自信地设计和实现专属的UI组件。
|
2月前
|
开发框架 JavaScript 前端开发
鸿蒙NEXT开发声明式UI是咋回事?
【10月更文挑战第15天】鸿蒙NEXT的声明式UI基于ArkTS,提供高效简洁的开发体验。ArkTS扩展了TypeScript,支持声明式UI描述、自定义组件及状态管理。ArkUI框架则提供了丰富的组件、布局计算和动画能力。开发者仅需关注数据变化,UI将自动更新,简化了开发流程。此外,其前后端分层设计与编译时优化确保了高性能运行,利于生态发展。通过组件创建、状态管理和渲染控制等方式,开发者能快速构建高质量的鸿蒙应用。
146 3