从bootstrap datetimepicker获取日期和时间

时间:2018-03-09 02:38:11

标签: javascript jquery twitter-bootstrap bootstrap-datetimepicker

我无法从我的bootrap datetimepicker获取日期和时间。 我在这里读了很多关于正确语法的帖子,似乎没有任何工作。

我必须遗漏一些小东西,或者我错误地创建了我的选择器。 任何帮助将不胜感激。

HTML:

<div class="modal fade" id="newEventModal" role="dialog">
    <div class="modal-dialog">

        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">New Event</h4>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-sm-12" style="text-align:left">
                        <div class="form-group">
                            <label for="newEventTitle">Event Title:</label>
                            <input type="text" class="form-control" id="newEventTitle">
                        </div>
                    </div>
                    <div class="col-sm-12" style="text-align:left">
                        <div class="form-group">
                            <label for="newEventDate">Date and Time:</label>
                            <div class='input-group date' id='datetimepicker' style="color:#000000">
                                <input type='text' class="form-control" id="newEventDate" style="color:#000000;"/>
                                <span class="input-group-addon" style="color:#000000;">
                                        <span class="fa fa-calendar" style="color:#4d8c40;"> 
                                        </span>
                                    </span>
                            </div>
                        </div>
                    </div>
                    <div class="col-sm-12" style="text-align:left">
                        <div class="form-group">
                            <label for="newEventComment">Comment:</label>
                            <input type="text" class="form-control" id="newEventComment">
                        </div>
                    </div>
                    <div class="col-sm-12" style="text-align:center">
                        <div class="form-group">
                            &emsp;
                            <br/><br/>
                            <input style="background-color: #4d8c40; color: #ffffff;" value="Create"
                                   class="btn btn-secondary" id="CreateEventBtn"/>
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>

    </div>
</div>

JQuery使选择器工作:

//enable date time picker and add icons
$(function () {
    $('#datetimepicker').datetimepicker({
        icons: {
            time: "fa fa-clock-o",
            date: "fa fa-calendar",
            up: "fa fa-arrow-up",
            down: "fa fa-arrow-down"
        }
    });
});

JQuery获取日期:

$('body').on('click', '#newEventBtn', function () {
    $('#newEventDate').val();
    $('#newEventTitle').val();
    $('#newEventComment').val();

    console.log($('#newEventTitle').val());
    console.log($('#datetimepicker').data('datetimepicker').date());
    console.log($('#datetimepicker').data('datetimepicker').getDate());
    console.log($('#datetimepicker').data('datetimepicker').getFormattedDate('yyyy-mm-dd'));
    console.log($('#newEventComment').val());
    //$('input[name=ImageFile]').val('')
    //CreateEvent(data);
    //format('DD/MM/YYYY HH:mm A')
});

正如你所看到的,我试过,。getDate(),. date(),以及.val()和.getFormattedDate,每个都是null或者给我错误

  

无法读取属性

提前致谢。

1 个答案:

答案 0 :(得分:3)

尝试:

console.log($('#datetimepicker').data('DateTimePicker').date());

... DateTimePicker就像那样大写。

相关问题