[英]How to do form validation with select2 and Wicked?
I have Select2 in wicket, and I want to add form validation on it.我在检票口中有 Select2,我想在上面添加表单验证。 I use atributte required, but it doesnt work.
我使用所需的属性,但它不起作用。 I want that select2 after unsuccessful validation have red background, or at least red border.
我希望验证失败后的 select2 有红色背景,或者至少有红色边框。 When I try to submit form with required attribute, It dont do any validation.
当我尝试提交具有必需属性的表单时,它不做任何验证。 Select where I try to do validation is origin country.
我尝试验证的 Select 是原产国。 Can someone give me a point, how to achive this behaiviour?
有人可以给我一点,如何实现这种行为? Thanks for any help.
谢谢你的帮助。
<wicket:head xmlns:wicket="http://wicket.apache.org/">
<style>
/*.form-group .form-control {*/
/* padding: 0;*/
/* height: 33px;*/
/* }*/
.p-0 {
padding: 0px !important;
height: 30px;
}
</style>
</wicket:head>
<wicket:panel xmlns="http://www.w3.org/1999/xhtml" xmlns:wicket="http://wicket.apache.org/">
<div class="col-xs-12">
<div class="col-xs-12">
<div class="form-group">
<div class="col-sm-3">
<input type="submit" value="Request" class="btn btn-danger"/>
</div>
<div class="col-sm-3">
<label for="quotationId" wicket:id="quotationIdLabel"></label>
<div>
<input wicket:id="quotationId" type="text" size="20"/>
</div>
</div>
<div class="col-sm-3">
<label for="product" wicket:id="productLabel"></label>
<div>
<select class="form-control" wicket:id="product"/>
</div>
</div>
<div class="col-sm-3">
<label for="contract" wicket:id="contractLabel"></label>
<div>
<input type="hidden" wicket:id="contract"/>
</div>
</div>
<div class="col-sm-3" style="padding: 0">
<label for="customer" wicket:id="customerLabel"></label>
<div>
<input class="form-control p-0" type="hidden"
wicket:id="customer" />
</div>
</div>
<div class="col-sm-3">
<label for="serviceLevel" wicket:id="serviceLevelLabel"></label>
<div>
<select class="form-control" wicket:id="serviceLevel"/>
</div>
</div>
<div class="col-sm-3">
<label for="equipmentType" wicket:id="equipmentTypeLabel"></label>
<div>
<input class="form-control p-0" type="hidden" wicket:id="equipmentType"/>
</div>
</div>
<div class="col-sm-3">
<label for="commodity" wicket:id="commodityLabel"></label>
<div>
<select class="form-control" wicket:id="commodity"/>
</div>
</div>
<span class="col-sm-3">
<label for="originCountry" wicket:id="originCountryLabel"></label>
<div>
<input type="hidden" wicket:id="originCountry" required/>
</div>
</span>
<div class="col-sm-3">
<label for="originDgfStation" wicket:id="originDgfStationLabel"></label>
<div>
<input type="hidden" wicket:id="originDgfStation"/>
</div>
</div>
<div class="col-sm-3">
<label for="destinationCountry" wicket:id="destinationCountryLabel"></label>
<div>
<input type="hidden" wicket:id="destinationCountry"/>
</div>
</div>
<div class="col-sm-3">
<label for="destinationDgfStation" wicket:id="destinationDgfStationLabel"></label>
<div>
<input type="hidden" wicket:id="destinationDgfStation"/>
</div>
</div>
<div class="col-sm-3">
<label for="shippingTerms" wicket:id="shippingTermsLabel"></label>
<div>
<select class="form-control" wicket:id="shippingTerms"/>
</div>
</div>
</div>
<br/>
</div>
</div>
<div class="clearfix"></div>
</wicket:panel>
I think the problem is with hidden fields which can not be declared as required in HTML.我认为问题在于无法在 HTML 中按要求声明的隐藏字段。 You might need to use some hack to use a regular text field and hide it with CSS.
您可能需要使用一些技巧来使用常规文本字段并使用 CSS 将其隐藏。 See this answer: make hidden field required
看到这个答案: make hidden field required
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.