Nonaktifkan waktu dalam pemilih waktu tanggal bootstrap

Saya menggunakan pemilih tanggal waktu bootstrap di aplikasi web saya, dibuat dalam PHP / HTML5 dan JavaScript. Saat ini saya menggunakan salah satu dari sini: http://tarruda.github.io/bootstrap-datetimepicker/

Ketika saya menggunakan kontrol tanpa waktu, itu tidak berfungsi. Itu hanya menampilkan kotak teks kosong.

Saya hanya ingin menghapus waktu dari pemilih waktu tanggal. Apakah ada solusi untuk ini?

<div class="well">
    <div id="datetimepicker4" class="input-append"> 
        <input data-format="yyyy-MM-dd" type="text"></input> 
        <span class="add-on"> 
            <i data-time-icon="icon-time" data-date-icon="icon-calendar"> </i> 
        </span> 
    </div> 
</div> 
<script type="text/javascript"> 
    $(function() { 
        $('#datetimepicker4').datetimepicker({ pickTime: false }); 
    }); 
</script>

Periksa cuplikan di bawah ini

<div class="container">
<div class="row">
    <div class='col-sm-6'>
        <div class="form-group">
            <div class='input-group date' id='datetimepicker4'>
                <input type='text' class="form-control" />
                <span class="input-group-addon"><span class="glyphicon glyphicon-time"></span>
                </span>
            </div>
        </div>
    </div>
    <script type="text/javascript">
        $(function() {              
           // Bootstrap DateTimePicker v4
           $('#datetimepicker4').datetimepicker({
                 format: 'DD/MM/YYYY'
           });
        });      
    </script>
</div>

Anda dapat merujuk http://eonasdan.github.io/bootstrap-datetimepicker/ untuk dokumentasi dan fungsi lainnya secara detail. Ini seharusnya berhasil.

Perbarui untuk mendukung i18n

Gunakan format moment.js yang dilokalkan:

• L hanya untuk kencan
• LT hanya untuk waktu
• L LT untuk tanggal dan waktu

Lihat format lokal lainnya di dokumentasi moment.js ( https://momentjs.com/docs/#/displaying/format/ )

Saya mencoba semua solusi yang diposting di sini tetapi tidak ada yang berhasil untuk saya. Saya berhasil menonaktifkan waktu dengan menggunakan baris kode ini di jQuery saya:

$('#datetimepicker4').datetimepicker({
    format: 'YYYY-MM-DD'
});

Ini mengatur format menjadi hanya tanggal dan menonaktifkan waktu sepenuhnya. Semoga ini membantu.

Ini untuk: Bootstrap Datetimepicker milik Eonasdan

Pertama-tama saya akan memberikan idatribut untuk <input>dan kemudian menginisialisasi datetimepicker secara langsung untuk itu <input>(dan bukan untuk wadah induk):

<div class="container">
  <input data-format="yyyy-MM-dd" type="text" id="datetimepicker"/>
</div>
<script type="text/javascript">
  $(function() {
    // Bootstrap DateTimePicker v3
    $('#datetimepicker').datetimepicker({
      pickTime: false
    });
    // Bootstrap DateTimePicker v4
    $('#datetimepicker').datetimepicker({
      format: 'DD/MM/YYYY'
    });
  });
</script>

Untuk v3: Bertentangan dengan jawaban Ck Maurya :

• pickDate: false akan menonaktifkan tanggal dan hanya mengizinkan untuk memilih waktu
• pickTime: false akan menonaktifkan waktu dan hanya mengizinkan untuk memilih tanggal (yang Anda inginkan).

Untuk v4: Bootstrap Datetimepicker sekarang menggunakan format untuk menentukan apakah ada komponen waktu. Jika tidak ada komponen waktu, Anda tidak dapat memilih waktu (dan menyembunyikan ikon jam).

Saya menghabiskan beberapa waktu mencoba mencari tahu ini karena pembaruan dengan DateTimePicker. Anda akan masuk dalam format berdasarkan dokumentasi moment.js . Anda dapat menggunakan jawaban lain yang menunjukkan:

$('#datetimepicker').datetimepicker({ format: 'DD/MM/YYYY' });

Atau Anda dapat menggunakan beberapa format lokal yang disediakan moment.js untuk melakukan kencan, seperti:

$('#datetimepicker').datetimepicker({locale: 'fr', format: 'L' });

Dengan menggunakan ini, Anda hanya dapat menampilkan waktu ( LT) atau tanggal ( L) berdasarkan lokal . Dokumentasi untuk datetimepicker tidak jelas bagi saya yang secara otomatis menyesuaikan dengan masukan yang diberikan (tanggal atau hanya waktu) melalui moment.jsformat. Semoga ini bisa membantu bagi mereka yang masih mencari.

$('#datetimepicker').datetimepicker({ 
    minView: 2, 
    pickTime: false, 
    language: 'pt-BR' 
});

Silakan coba jika itu berhasil untuk Anda juga

Inisialisasi datetimepicker Anda seperti ini

Untuk menonaktifkan waktu

$(document).ready(function(){
    $('#dp3').datetimepicker({
      pickTime: false
    });
});

Untuk menonaktifkan tanggal

$(document).ready(function(){
    $('#dp3').datetimepicker({
      pickDate: false
    });
});

Untuk menonaktifkan tanggal dan waktu

$(document).ready(function(){
   $("#dp3").datetimepicker('disable'); 
});

silakan lihat dokumentasi berikut jika Anda ragu

http://eonasdan.github.io/bootstrap-datetimepicker/#options

<div class="container">
  <input type="text" id="datetimepicker"/>
</div>

<script type="text/javascript">
  $(function() {
    // trigger datepicker
    $('#datetimepicker').datetimepicker({
       pickTime: false,
        minView: 2,
        format: 'dd/mm/yyyy',
        autoclose: true,
    });
  });
</script>

Ini hanya menunjukkan tanggal:

$('#myDateTimePicker').datetimepicker({
        format: 'dd.mm.yyyy',
        minView: 2,
        maxView: 4,
        autoclose: true
      });

Lebih lanjut tentang subjek di sini

    $(function () {
        $('#datetimepicker9').datetimepicker({
            viewMode: 'years',
            format: 'DD/MM/YYYY' /*Add this line to remove time format*/
        });
    });

Kriteria pemilih sekarang menjadi atribut tag DIV.

contohnya adalah ...

data-date-format="dd MM yyyy" 
data-date-format="dd MM yyyy - HH:ii p
data-date-format="hh:ii"

jadi contoh bootstrap untuk dd mm yyyy adalah: -

<div class="input-group date form_date col-md-5" data-date="" 
    data-date-format="dd MM yyyy" data-link-field="dtp_input2" data-link-format="yyyy-mm-dd">
..... etc ....
</div>

pengaturan Javascript saya adalah sebagai berikut: -

            var picker_settings = {
                language:  'en',
                weekStart: 1,
                todayBtn:  1,
                autoclose: 1,
                todayHighlight: 1,
                startView: 2,
                minView: 2,
                forceParse: 0
            };

        $(datePickerId).datetimepicker(picker_settings);

Anda dapat melihat contoh kerja ini jika Anda mengunduh file bootstrap-datetimepicker-master. Ada folder contoh, masing-masing dengan index.html.

Untuk versi bootstrap 4 kode ini berfungsi;

$('#payment-date-time-select').datetimepicker({
    startView:2,
    minView:2,
});

Nonaktifkan waktu di alat pilih waktu boostrap ...

   $(document).ready(function () {
        $('.timepicker').datetimepicker({
            format: "dd-mm-yy",
        });
    });

Nonaktifkan tanggal di alat pilih waktu boostrap ...

   $(document).ready(function () {
        $('.timepicker').datetimepicker({
            format: "HH:mm A",
        });
    });

your same code work's fine, just add some link reference

<!DOCTYPE HTML>
<html>
    <head>
        <link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css" rel="stylesheet">
        <link rel="stylesheet" type="text/css" media="screen"
              href="http://tarruda.github.com/bootstrap-datetimepicker/assets/css/bootstrap-datetimepicker.min.css">


    </head>
    <body>
        <div class="well">
            <div id="datetimepicker4" class="input-append"> 
                <input data-format="yyyy-MM-dd" type="text"></input> 
                <span class="add-on"> 
                    <i data-time-icon="icon-time" data-date-icon="icon-calendar"> </i> 
                </span> 
            </div> 
        </div> 

        <script type="text/javascript"
                src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.8.3/jquery.min.js">
        </script> 
        <script type="text/javascript"
                src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/js/bootstrap.min.js">
        </script>
        <script type="text/javascript"
                src="http://tarruda.github.com/bootstrap-datetimepicker/assets/js/bootstrap-datetimepicker.min.js">
        </script>
        <script type="text/javascript"
                src="http://tarruda.github.com/bootstrap-datetimepicker/assets/js/bootstrap-datetimepicker.pt-BR.js">
        </script>
        <script type="text/javascript">
            $(function () {
                $('#datetimepicker4').datetimepicker({pickTime: false});
            });
        </script>

    </body>
    </html>

<script type="text/javascript">
        $(function () {
                  $('#datepicker').datetimepicker({
                     format: 'YYYY/MM/DD'
               });
            });
</script>

Hal ini memungkinkan untuk menampilkan waktu di bidang masukan tetapi menyembunyikan tombol pemilih waktu, yang merupakan elemen li kedua dalam akordeon

.bootstrap-datetimepicker-widget .list-unstyled li:nth-child(2){
    display: none;
}

Saya tahu ini terlambat, tetapi jawabannya hanyalah menghilangkan "waktu" dari kata, datetimepickeruntuk mengubahnya menjadi datepicker. Anda dapat memformatnya dengan dateFormat.

      jQuery( "#datetimepicker4" ).datepicker({
        dateFormat: "MM dd, yy",
      });

Inilah solusinya untuk Anda. Sangat mudah untuk menambahkan kode seperti ini:

    $('#datetimepicker4').datetimepicker({ 

    pickTime: false 

    minview:2;(Please see here.)

    }); 

 $("#datetimepicker4").datepicker({
    dateFormat: 'mm/dd/yy',
    changeMonth: true,
    changeYear: true,
    showOtherMonths: true,
    selectOtherMonths: true,
    pickTime: false,
    format: 'YYYY-MM-DD'
});

Bukan sebagai menunda waktu dan bahasa pada saat saya meletakkan ini dan tidak bekerja

$(function () {
    $('#datetimepicker2').datetimepicker({
              locale: 'es',
              pickTime: false
          });
});