如何製作引導日期選擇按鈕

如標題所示，我想製作一個引導日期選擇器，當用戶點擊按鈕時，它將顯示出來。我一直在尋找整個2天的教程，只發現帶有輸入的datepickers教程。唯一一個表明它是可疑的網站是this one. 不幸的是，它沒有顯示它的代碼。這就是我在這裏的原因。我希望你們能幫助我從我的絕望:)如何製作引導日期選擇按鈕

來源

2013-10-29 Julius ShadowAspect Flimmel

您提供沒有代碼和努力。請嘗試...... – Dom

這是從Bootstrap Datepicker網站，你上面鏈接中提取，並適於使用，而不是一個類似按鈕的鏈接元素的按鈕：http://jsfiddle.net/VchBF/

HTML：

<button class="btn small" id="button" data-date-format="yyyy-mm-dd" data-date="2012-02-20">Your Date Picker</button>

JS：

$('#button').datepicker() 
.on('changeDate', function(ev){ 
    $('#button').datepicker('hide'); 
    alert(ev.date.valueOf()); 
});

來源

2013-10-29 20:08:32

它只是日期選擇器不是這個例子:( –

啊，我明白了，看看編輯吧，這個應該可以做到的， –

嗯，它顯示日曆在最近的角落，就像它不知道在哪裏畫它：/ –

你只需要定義標記您的輸入..

<div class="container"> 
<div class="input-append date" id="dp3" data-date="12-02-2012" data-date-format="dd-mm-yyyy"> 
    <input class="span2" size="16" type="text" value="12-02-2012" id="myDate"> 
    <span class="add-on"><i class="icon-th"></i></span> 
</div> 
</div>

然後使用jQuery使用日期時間選擇器上輸入..

$('#myDate').datepicker();

這裏有一個工作示例：http://bootply.com/86820

來源

2013-10-29 20:19:17 ZimSystem

感謝您的回答。但實際上這不是我想要的。這使得輸入和一個按鈕（圖標）。我只是想讓它只做一個按鈕。 –

這是我做什麼用Ruby on Rails的雖然使用jQuery

步驟：在html文件中粘貼這個

<input type="text" id="your-datepicker-id" style="display: none;">

在JS文件複製粘貼此

$('#your-datepicker-id').datepicker({ 
    dateFormat: "dd/mm/yy", 
    showOn: "button", 
    buttonText: '<i class="fa fa-calendar"></i>' 
})

輸出將是一個按鈕

<button type="button" class="ui-datepicker-trigger"><i class="fa fa-calendar"></i></button>

附加功能：

您可以添加自舉類爲

$(".ui-datepicker-trigger").addClass("btn btn-success")

你也可以做阿賈克斯呼籲

$('#your-datepicker-id').datepicker({ 
    dateFormat: "dd/mm/yy", 
    showOn: "button", 
    buttonText: '<i class="fa fa-calendar"></i>', 
    onSelect: function (dateText) { 
    jQuery.ajax({ 
     type: "GET", 
     dataType: "script", 
     url: your_url 
    }) 
    } 
})

注：（dateText ==日期被選擇）

這是輸出我得到

來源

2016-07-08 07:08:35

如何製作引導日期選擇按鈕

回答

相關問題