รูปแบบ bootstrap datepicker

แก้ไขปัญหา:

jsFiddle: http://jsfiddle.net/s4d0fxd2/1/

ป้อนคำอธิบายรูปภาพที่นี่

ตามภาพด้านบนแสดง ฉันกำลังพยายามแจ้งเตือนวันที่ที่เลือกจาก bootstrap datepicker แต่ฉันไม่สามารถทำให้มันแสดงรูปแบบที่ฉันต้องการได้ (รูปแบบ: YYYY-mm-dd)

HTML:

<div class="datepicker" id="datepicker1" ></div>

JS:

$('.datepicker').datepicker({ format: 'yyyy-mm-dd', multidate: true, multidateSeparator: ",", calendarWeeks: true, todayHighlight: true }).on('changeDate', function(e){ alert($('#datepicker1').datepicker('getDates')); });

แม้ว่าฉันจะได้รับรูปแบบที่เหมาะสมเมื่อใช้ <input> และแสดงปฏิทินเมื่ออินพุตถูกโฟกัสแทนที่จะเป็น inline ปฏิทิน แต่นั่นไม่ใช่ตัวเลือก

เอกสารสำหรับ bootstrap-datepicker: http://bootstrap-datepicker.readthedocs.org/en/release/

jsFiddle: http://jsfiddle.net/s4d0fxd2/


jquery twitter-bootstrap twitter-bootstrap-3 bootstrap-datepicker
person Joel    schedule 29.09.2014    source แหล่งที่มา
comment
หมายความว่าคุณต้องการให้ datepicker ทำงานอย่างถูกต้องกับ DIV มากกว่า INPUT TYPE TEXT OK หรือไม่   -  person Pratik    schedule 29.09.2014
comment
คุณให้ jsFiddle สำหรับปัญหาของคุณได้ไหม   -  person Pratik    schedule 29.09.2014
comment
ใช่ ซอจะมาเร็วๆ นี้   -  person Joel    schedule 29.09.2014
comment
หมายความว่าคุณต้องการให้ datepicker ทำงานอย่างถูกต้องกับ DIV มากกว่า INPUT TYPE TEXT OK หรือไม่   -  person Pratik    schedule 29.09.2014
comment
jsfiddle.net/s4d0fxd2   -  person Joel    schedule 29.09.2014

คำตอบ (1)


arrow_upward
2
arrow_downward

ตามเอกสารประกอบ getDates ควรส่งคืนรายการวัตถุวันที่ที่แปลแล้วซึ่งเป็นตัวแทนของวัตถุวันที่ภายใน ไม่มีวิธีการโดยตรงที่สามารถกำหนดวันที่ที่จัดรูปแบบได้โดยตรงตามที่คุณต้องการ สิ่งที่คุณสามารถทำได้คือเมื่ออาร์เรย์ของวันที่ที่เลือกส่งคืนโดยวิธี getDates ให้ใช้ฟังก์ชันที่กำหนดเองเพื่อจัดรูปแบบและแสดงผล

$(document).ready(function() {

    $('.datepicker').datepicker({
    format: 'yyyy-mm-dd',
    multidate: true,
    multidateSeparator: ",",
    calendarWeeks: true,
    todayHighlight: true

    }).on('changeDate', function(e){
    var selecteddates = $('.datepicker').datepicker('getDates');
        var formatedSelectedDates = [];
        for(var date in selecteddates)
        {
          formatedSelectedDates.push(convertDate(selecteddates[date]));
        }
        alert(formatedSelectedDates);
      });           
    });

และ ฟังก์ชันตัวจัดรูปแบบตาม ความต้องการของคุณ:

 function convertDate(d) {
          function pad(s) { return (s < 10) ? '0' + s : s; }
          return [ d.getFullYear(),pad(d.getMonth()+1),pad(d.getDate())].join('-');
        }

สาธิต

person SSA    schedule 29.09.2014
comment
ขอขอบคุณสำหรับความช่วยเหลือ! :) ในด้านการสอน ฉันซาบซึ้งมาก! - person Joel; 29.09.2014