表单+回显

一、简介

1、struts表单效验时会把提交的内容封装成bean存放在request域中,存放的关键字是UserFormBean

2、效验 错误后会跳转回提交表单页面

二、实例

bean之Gender

public enum Gender {
	MALE("male","男"),FEMALE("female","女");
	private String name;
	private String value;
	private Gender(String name,String value) {
		this.name=name;
		this.value=value;
	}
	public String getName() {
		return name;
	}
	public String getValue() {
		return value;
	}
}
bean之Preference

public enum Preference {
	SING("sing","唱歌"),DANCE("dance","跳舞");
	private String name;
	private String value;
	private Preference(String name,String value) {
		// TODO Auto-generated constructor stub
		this.name=name;
		this.value=value;
	}
	public String getName() {
		return name;
	}
	public String getValue() {
		return value;
	}	
}
form表单

  <form action="${pageContext.request.contextPath}/Register.do" method="post">
  	<table>
  		<tr>
  			<td>用户名</td>
  			<td>
  				<input type="text" name="username" value="${UserFormBean.name}">
  			</td>
  		</tr>
  		<tr>
  			<td>密码</td>
  			<td>
  				<input type="password"  name="password" value="${UserFormBean.password}">
  			</td>
  		</tr>
  		<tr>
  			<td>确认密码</td>
  			<td>
  				<input type="password"  name="password">
  			</td>
  		</tr>
  		<tr>
  			<td>性别</td>
  			<td>
  				<c:forEach var="gender" items="<%=Gender.values()%>">
  					<input type="radio"  name="gender" value="${gender.name}">${gender.value}
  				</c:forEach> 				
  			</td>
  		</tr>
  		<tr>
  			<td>爱好</td>
  			<td>
  				<c:forEach var="pre" items="<%=Preference.values()%>">
  					<input type="checkbox"  name="preference" value="${pre.name}" ${fn:contains(fn:join(UserFormBean.preference,","),pre.name)?checked:''}>${pre.value}
  				</c:forEach> 				
  			</td>
  		</tr>
  		<tr>
  			<td>城市</td>
  			<td>
  				<select name="city">
  					<option ${UserFormBean.city=='beijing'?selected:''}>北京</option>
  					<option ${UserFormBean.city=='shanghai'?selected:''}>上海</option>
  				</select>				 								
  			</td>
  		</tr>
  		<tr>
  			<td>
  				<input type="submit" value="注册">
  			</td>
  		</tr>
  	</table>
  </form>
config文件

	<action-mappings>
 		<action path="/Register" 
				type="action.Register" 
				name="UserFormBean"									
				scope="request"
				validate="true"
				input="/Register.jsp">	
		</action>				
	</action-mappings>







  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
在Vue3中实现表单数据回显的方法有多种。其中一种常见的方法是使用响应式数据。您可以将表单数据保存在一个响应式对象中,然后在组件中使用这些数据进行回显。 首先,您需要在组件中定义一个响应式对象,来保存表单数据。可以使用`reactive`函数来创建一个响应式对象。例如,在Vue3中,您可以这样定义一个响应式对象: ``` const state = reactive({ remark: '', dictId: 0, dictName: '', dictType: '', status: '0', }); ``` 接下来,您可以通过将表单数据传递给组件的props属性来实现数据的回显。当父组件传递新的表单数据时,您可以使用`watch`函数来监听这些数据的变化,并更新响应式对象的值。例如,在Vue3中,您可以这样实现表单数据的回显: ``` watch(() => formData, (value) => { state.remark = value.remark; state.dictId = value.dictId; state.dictName = value.dictName; state.dictType = value.dictType; state.status = value.status; }, { immediate: true, deep: true }); ``` 最后,您可以在模板中使用这些响应式数据来回显表单数据。例如,在Vue3中,您可以这样使用响应式数据来回显表单数据: ``` <template> <div> <label>Remark:</label> <input v-model="state.remark" /> <label>Dict ID:</label> <input v-model="state.dictId" /> <label>Dict Name:</label> <input v-model="state.dictName" /> <label>Dict Type:</label> <input v-model="state.dictType" /> <label>Status:</label> <input v-model="state.status" /> </div> </template> ``` 通过这种方式,您可以将父组件传递的表单数据回显到子组件的输入框中。请注意,上述代码仅为示例代码,具体实现可能会根据您的项目需求而有所不同。希望对您有所帮助!
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值