文本框中輸入錯誤信息,提交時填寫的內容顯示而且文本框變爲紅色

1.將文本框中輸入的內容,點擊按鈕後不消失css

功能實現思路:前臺接收文本框輸入數據由後臺接收,再將內容由文本框中設置EL表達式接收顯示java

2.輸入錯誤信息或必填項未輸入時文本框顯示爲紅色
字體

功能實現思路:寫一個樣式,使文本框背景變爲紅色。而後將樣式表加載到JSP頁面中,改寫input標籤來應用設置的樣式spa

注:<input>標籤中不能使用樣式表,因此須要改寫爲<form:input>code

(1)建立一個CSS樣式顯示將文本框背景變爲紅色,字體變爲藍色   common.cssorm

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

(2)在JSP頁面中加載樣式表input

<link href="css/common.css" rel="stylesheet">

(3)改寫<input>標籤來應用設置的樣式io

<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>

原input標籤:<input name="guestCompany" class="form-control" value="${placeOrderForm.guestCompany}" />form

相關文章
相關標籤/搜索