文本框输入信息,未输入的文本框会提示输入,而且未输入的文本框会变红

一 实现分销商注册页面文本框输入错误信息或者不输入会提示错误,填写好的文本框的文本会显示,而且空文本框会变红,输入的错误信息不但文本框变红,里面的文本会变蓝css

实现思路:前台输入的信息会传给后台,后台接受信息,在由文本框中设置的EL表达式进行接受,并显示java

1新建一个common.css,关键代码:jsp

.error{
	background-color:red;
	display:inline;color:blue;
}

目的是为了设置文本框背景颜色,和输入错误信息的文本为蓝编码

2.在addDistributorSelf.jsp中添加common的连接<link href="css/common.css" rel="stylesheet">spa

实现文本框中显示文本代码:value="${distributorForm.distributorId}"   (value=EL表达式)code

实现空白文本框为红色的代码:将input表达式改成<form:input path="distributorId" cssClass="form-control" cssErrorClass="form-control error" value="${distributorForm.distributorId}" />orm

<tr>
                                        	<td style="background-color: #f9f9f9;">登陆ID<></td>
											<td><form:input path="distributorId" cssClass="form-control" cssErrorClass="form-control error" value="${distributorForm.distributorId}" /></td>
											<td style="background-color: #f9f9f9;">密码</td>
											<td><form:input path="password" cssClass="form-control" type="password" cssErrorClass="form-control error" value="${distributorForm.password}" /></td>
											<td style="background-color: #f9f9f9;">密码确认</td>
											<td><form:input path="passwordConfirm" cssClass="form-control" cssErrorClass="form-control error" type="password" value="${distributorForm.passwordConfirm}"/></td>
										</tr>
										<tr>
                                        	<td style="background-color: #f9f9f9;">真实姓名</td>
											<td><form:input path="distributorName" cssClass="form-control" cssErrorClass="form-control error" value="${distributorForm.distributorName}"/></td>
											<td style="background-color: #f9f9f9;">手机</td>
											<td><form:input path="mobile" cssClass="form-control" cssErrorClass="form-control error" value="${distributorForm.mobile}"/></td>
											<td style="background-color: #f9f9f9;">支付宝ID</td>
											<td><form:input path="alipay" cssClass="form-control" cssErrorClass="form-control error" value="${distributorForm.alipay}"/></td>
										</tr>

二实现订单管理页面文本框输入错误信息或者不输入会提示错误,填写好的文本框的文本会显示,而且空文本框会变红,输入的错误信息不但文本框变红,里面的文本会变蓝ip

实现思路:前台输入的信息会传给后台,后台接受信息,在由文本框中设置的EL表达式进行接受,并显示支付宝

1新建一个common.css,关键代码:input

.error{
	background-color:red;
	display:inline;color:blue;
}

目的是为了设置文本框背景颜色,和输入错误信息的文本为蓝

2.在addPlaceOrder.jsp中添加common的连接<link href="css/common.css" rel="stylesheet">

实现文本框中显示文本代码:value="${distributorForm.distributorId}"   (value=EL表达式)

实现空白文本框为红色的代码:将input表达式改成<form:input path="distributorId" cssClass="form-control" cssErrorClass="form-control error" value="${distributorForm.distributorId}" />

<tr>
											<td style="background-color: #f9f9f9;">客户单位</td>
											<td><form:input path="guestCompany" cssClass="form-control" cssErrorClass="form-control error"  value="${placeOrderForm.guestCompany}"/></td>
											<td style="background-color: #f9f9f9;">联系人</td>    
											<td><form:input path="contacts" cssClass="form-control" cssErrorClass="form-control error" value="${placeOrderForm.contacts}"/></td>
											<td style="background-color: #f9f9f9;">手机</td>
											<td><form:input path="mobile" cssClass="form-control" cssErrorClass="form-control error" value="${placeOrderForm.mobile}"/></td>
										</tr>
									<tr><td style="background-color: #f9f9f9;">地址</td>
											<td><form:input path="address" cssclass="form-control" cssErrorClass="form-control error" value="${placeOrderForm.address}"/></td>
										</tr>
										<tr>
											<td style="background-color: #f9f9f9;">邮政编码</td>
											<td><form:input path="zip" cssClass="form-control" cssErrorClass="form-control error" value="${placeOrderForm.zip}"/></td>
											<td style="background-color: #f9f9f9;">固定电话</td>
											<td><form:input path="telephone" cssClass="form-control" cssErrorClass="form-control error" value="${placeOrderForm.telephone}"/></td>
											<td style="background-color: #f9f9f9;">订单日期</td>
											<td><form:input path="orderDate" cssClass="form-control" cssErrorClass="form-control error" id="orderDate" data-date-format="yyyy-mm-dd" value="${distributorForm.orderDate}"/></td>
										</tr>
										<tr>
											<td style="background-color: #f9f9f9;">备注</td>
											<td colspan="5"><form:input path="note" cssClass="form-control" cssErrorClass="form-control error" value="${placeOrderForm.note}"/></td>
										</tr>
相关文章
相关标签/搜索