日期選擇器

使用到的函式庫(JS、CSS)

請照順序放

1. jquery (只有JS)
2. jquery-ui
3. bootstrap
4. bootstrap-datepicker

HTML

<input type="text" class="datepicker" name="gdo">

日期開始與結束

<div class="input-daterange input-group" data-plugin-datepicker data-date-format="yyyy-mm-dd">
    <span class="input-group-addon">🕑</span>
    <input type="text" class="form-control datepicker"  data-plugin-datepicker="" data-date-format="yyyy-mm-dd"  
    id="gupdate" name="gup" readonly>
    <span class="input-group-addon">to</span>
    <input type="text" class="form-control datepicker"  data-plugin-datepicker="" data-date-format="yyyy-mm-dd"  
    id="gdodate" name="gdo" readonly>
</div>

單一日期

<div class="input-daterange input-group" data-plugin-datepicker data-date-format="yyyy-mm-dd">
    <span class="input-group-addon">🕑</span>
    <input type="text" class="form-control datepicker"  data-plugin-datepicker="" data-date-format="yyyy-mm-dd" id="gupdate" name="gup" readonly>
</div>

javascript

$('.datepicker').datepicker();