Question

这是我使用bootstrap实现daterangepicker1的代码。

<div class="input-group input-large custom-date-range" data-date="13/07/2013" data-date-format="mm/dd/yyyy">
                                            <input type="text" class="form-control dpd1" name="from_total"  required placeholder="Start date" id="from_total">
                                            <span class="input-group-addon">To</span>
                                            <input type="text" class="form-control dpd1" name="to_total"   required placeholder="End date" id="to_total">
                                        </div>

这是我如何实现Second daterangepicker ...

的代码

 <div class="input-group input-large custom-date-range" data-date="13/07/2013" data-date-format="mm/dd/yyyy">
                                            <input type="text" class="form-control dpd1" name="from_owner"  placeholder="Start date" id="from_owner" >
                                            <span class="input-group-addon">To</span>
                                            <input type="text" class="form-control dpd1" name="to_owner" placeholder="End date" id="to_owner"  >
                                        </div>

两个daterangepickers工作正常，因为点击每个输入框日历打开，我可以获得值，关于字段＆＃39; from_total＆＃39;和＆＃39; to_total＆＃39; [前两个]当我选择＆＃39; from_total＆＃39;它直接去了'to_toal＆＃39;这很好，它正是我想要的,,,,但是问题出现在第二个日期范围选择器中，当我选择＆＃39; from_owner＆＃39;它并没有进入to_owner＆＃39;而光标移动到＆＃39; to_total＆＃39;这是第一个daterangepicker中的第二个输入字段，它不对，我希望它将它移动到＆＃39; to_owner＆＃39;如果你曾经使用BOOTSTRAP在单页上使用过两个DATERANGEPICKERS，那么我希望你能理解我并提供帮助。提前谢谢.....

Answer 1

您可以为datepickers

指定不同的ID

<div class="input-group input-large custom-date-range" data-date="13/07/2013" data-date-format="mm/dd/yyyy" id="date1">
<input type="text" class="form-control dpd1" name="from_total"  required placeholder="Start date" id="from_total">
<span class="input-group-addon">To</span>
<input type="text" class="form-control dpd1" name="to_total"   required placeholder="End date" id="to_total">
</div>

<div class="input-group input-large custom-date-range" data-date="13/07/2013" data-date-    format="mm/dd/yyyy" id="date2">
<input type="text" class="form-control dpd1" name="from_owner"  placeholder="Start date" id="from_owner" >
<span class="input-group-addon">To</span>
<input type="text" class="form-control dpd1" name="to_owner" placeholder="End date" id="to_owner"  >
</div>

如何在同一页面上使用两个bootstrap daterangepicker

1 个答案: