Question

我正在使用FullCalendar.js API开发具有日历功能的Web应用程序。当我选择日期和时间时，格式为 06/08/2016 3:36 PM 。将数据保存到DB并再次获取后。然后格式更改为 Wed Jun 06 2016 03:36:00 GMT + 1000（AUS东部标准时间）。我想保留相同的格式，例如 06/08/2016 3:36 PM 。

当我从/向数据库保存/获取日期时，我将其转换为适合格式。我使用SimpleDateFormat类在插入数据之前和之后将日期从/转换为String。即使这样，CalendarUI中的格式也不会更改为dd / mm / yyyy。

有人可以指导我如何保留格式吗？

已更新

我附上了我的源代码

private Timestamp convertJSDateToJavaDate(String dat) {
    java.util.Date date = null;
    SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd hh:mm:ss");
    try {
        date = new SimpleDateFormat("dd/MM/yyyy hh:mm a").parse(dat);
        String newDate = sdf.format(date);
        date = sdf.parse(newDate);
    } catch (ParseException e) {
        e.printStackTrace();
    }
    return new java.sql.Timestamp(date.getTime());
}

private String convertJavaDateToJSDate(String dat) {
    java.util.Date date = null;
    String finalDate = "";
    SimpleDateFormat sdf = new SimpleDateFormat("dd/MM/yyyy HH:mm");
    try {
        if (dat != null) {
            date = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss").parse(dat);
            finalDate = sdf.format(date);
            System.out.println("sdf - " + sdf.format(date));
        }
    } catch (ParseException e) {
        e.printStackTrace();
    }
    return finalDate;
}

在上面的代码中，第一种方法是从Java Script获取日期并转换为SQL date-timestamp并存储到DB中。第二种方法与第一种方法完全相反。

var calendar = $('#calendar').fullCalendar({
        header: {
            left: 'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
        },
        selectable: true,
        selectHelper: true,
        select: function(start, end, allDay) {              
            $("#calendarModal").modal({keyboard:true}); 
            calendar.fullCalendar('unselect');
        },
        editable: true,
        events: '../displays/getEventCalendar.action',
        eventClick: function(calEvent, jsEvent, view) {
              $("#calendarModal").modal({keyboard:true});
              $("#addEventCalendar_eventBean_start").val(calEvent.start);
              $("#addEventCalendar_eventBean_end").val(calEvent.end);
              $("#addEventCalendar_eventBean_title").val(calEvent.title);
              $("#addEventCalendar_eventBean_description").val(calEvent.description);
              $("#addEventCalendar_eventBean_allDay").val(calEvent.allDay);
    },
    timeFormat:'h:mm'
    });

     $('.modal form').on('submit', function(event) {
            event.preventDefault();
        var url = "addEventCalendar.action"; 
        $.ajax({
               type: "POST",
               url: url,
               data: $("#addEventCalendar").serialize(), // serializes the form's elements.
               success: function(data)
               {
                   if(data.status){     
                       $('#calendar').fullCalendar('removeEvents');
                        $('#calendar').fullCalendar('refetchEvents');
                        }
                }
            });
        });

我也在使用Struts框架。事件以JSON形式返回，并分配给日历中的Events变量。

调试时，Java Object返回的日期为 06/08/2016 3:36 ，此特定变量为Java中的String。但不知何故，它被转换为Java Date Object并显示冗长的。

Answer 1

感谢您的建议。

我能够将Date转换为JavaScript Date对象，并以我想要的格式形成日期String。我还使用bootstrap-datetimepicker在屏幕上选择日期和时间。

附上日期和时间转换发生的代码摘录。

eventClick: function(calEvent, jsEvent, view) {

            var a = new Date(calEvent.start);
            var start =  ("0" + a.getDate()).slice(-2)+ "/"+("0" + (a.getMonth() + 1)).slice(-2) + "/" + a.getFullYear() + " "+("0" + a.getHours()).slice(-2) +":" + ("0" + a.getMinutes()).slice(-2);
            a = new Date(calEvent.end);
            var end =  ("0" + a.getDate()).slice(-2)+ "/"+("0" + (a.getMonth() + 1)).slice(-2) + "/" + a.getFullYear() + " "+("0" + a.getHours()).slice(-2) +":" + ("0" + a.getMinutes()).slice(-2);

              $("#calendarModal").modal({keyboard:true});
              $("#addEventCalendar_eventBean_id").val(calEvent.id);
              $("#addEventCalendar_eventBean_start").val(start);
              $("#addEventCalendar_eventBean_end").val(end); });

FullCalendarJS中的日期和时间格式

1 个答案: