引導日期選取器不能在第二個輸入上工作

我正在使用Twitter Bootstrap並使用this模板。引導日期選取器不能在第二個輸入上工作

我有這個問題關於datepicker，和這個模板中的一些其他類似的東西。當我第二次嘗試使用輸入時，例如：爲datepicker輸入，第二個日期選擇器甚至不會在我關注輸入時顯示日曆，只有第一個彈出。我如何重寫這個，以便顯示日曆？

<div class="par"> 
<label>Check In</label> 
<span class="field"> 
<input id="datepicker" type="text" name="datein" class="input-small"/> 
</span> 
</div> 

<div class="par"> 
<label>Check Out</label> 
<span class="field"> 
<input id="datepicker" type="text" name="dateout" class="input-small"/> 
</span> 
</div>

來源

2014-09-18 user2781911

首先，ID應該永遠是獨一無二的。你不能有多個具有相同id的元素，並且這背後的原因是，它不僅會給W3C驗證錯誤帶來麻煩，而且還會帶來很多問題，其中之一就是你現在面臨的問題。

改變你的元素ID類和使用類選擇，而不是

.... 
<input type="text" name="datein" class="input-small datepicker"/> 
    ..... 
<input type="text" name="dateout" class="input-small datepicker"/>

的JavaScript

$('.datepicker').datepicker()

我刪除你的元素ID ATTR，添加它，如果你需要它，但要確保其獨特

來源

2014-09-18 17:38:28 bipen

我需要在CSS的id選擇更改爲類選擇文件？ – user2781911 2014-09-18 17:50:19

是的，你需要..如果你有datepicker的CSS，並且想將這些CSS應用到你的元素。 – bipen 2014-09-18 17:51:50

Datepicker綁定到DOM的第一個元素。

使用唯一的ID

$('#datepicker1').datepicker(); 
$('#datepicker2').datepicker();

標記

<input id="datepicker1" type="text" name="datein" class="input-small"/> 
<input id="datepicker2" type="text" name="datein" class="input-small"/>

要綁定日期選擇不同的元素，或使用類

來源

2014-09-18 17:46:23 Manwal

引導日期選取器不能在第二個輸入上工作

回答

相關問題