【前端碎片记录】datetimepicker和bootstrapValidator组合实现日期选择与验证问题

最近在尝试一个小项目的时候,表单提交用到了日期选择和验证插件,但是UI显式如图,位置一直不对,原代码如下:

<div class="form-group">
	<label for="dtp_input2" class="col-sm-2 control-label">出团日期<p style="color: #C7254E; display: inline-block;">*</p></label>
	<div class="input-group date form_date col-sm-6" style="padding-left: 15px;" data-date="" data-date-format="yyyy-MM-dd" data-link-field="dtp_inpu2" data-link-format="yyyy-mm-dd">		                        	
	 <input type="text" class="form-control" name="outTime" id="edit_outTime"/>
	 <span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>
	 <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span>
	 <input type="hidden" class="col-sm-2" id="dtp_input2" value="" />
  </div>
</div>

改了很多次都不对,后来在input中触发datetimepicker插件:

<div class="form-group">
	<label for="dtp_input2" class="col-sm-2 control-label">出团日期<p style="color: #C7254E; display: inline-block;">*</p></label>
    <div class="col-sm-6" >		                        	
		 <input type="text" class="input-group date form_date form-control" name="outTime" id="edit_outTime" data-date-format="yyyy-MM-dd" data-link-field="dtp_inpu2" data-link-format="yyyy-mm-dd"/>
	</div>
</div>

 验证后的√标志显式正确:

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值