새 이벤트를 백엔드 컨트롤러에 게시

Question

Spring MVC와 함께 JQuery 전체 일정을 사용하려고합니다.

나는 that과 같은 데모를 만들었습니다.

대상 : 이벤트를 입력 한 후 UPDATED 캘린더의 데이터를 컨트롤러로 보내서 처리해야합니다.

문제 : 컨트롤러에 내가 이전에 캘린더를 다시 보내달라고했습니다. 그러나 이벤트를 입력 한 후 업데이트 된 캘린더의 데이터를 처리 할 컨트롤러에 보낼 수 없습니다.

프리 마커 :

<script type="text/javascript"> 
    var calendar; 
    var calendarData;   

    function doAjax() { 
     var test = JSON.stringify(calendarData, censor(calendarData)); 
      var x=$('#calendar').value; 
     $.ajax(
     { 
      url:"[@spring.url '/vacation/setVacation'/]", 
      type: "POST", 
      data :x , 
      dataType: "json", 
      contentType: "application/json" 
     }); 
    } 

    $(document).ready(function() { 
     var date = new Date(); 
     var d = date.getDate(); 
     var m = date.getMonth(); 
     var y = date.getFullYear(); 
     $.getJSON('[@spring.url '/vacation/getVacation'/]', function (data) { 
      calendar = $('#calendar').fullCalendar({ 
       header: { 
        left: 'prev,next today', 
        center: 'title', 
        right: 'month,agendaWeek,agendaDay' 
       }, 
       selectable: true, 
       selectHelper: true, 
       select: function(start, end, allDay) { 
        var title = prompt('Event Title:'); 
        if (title) { 
         calendar.fullCalendar('renderEvent', 
         { 
          title: title, 
          start: start, 
          end: end, 
          allDay: allDay 
         }, 
           true // make the event "stick" 
           ); 
        } 
        calendar.fullCalendar('unselect'); 
       }, 
       editable: true, 
       events:data 
      }); 
      calendarData = data; 
     }); 
    }); 

</script> 

Answer 1

내가 원하는 것을 달성하기 위해, 나는 해결 방법을했습니다. 해결 방법은 json 개체를 작성하여 컨트롤러로 보내는 것입니다. 사용자가 캘린더에 새 이벤트를 입력하면이 이벤트를 이전에 저장된 이전 이벤트에 추가합니다.

참고 : JSON Stringify changes time of date because of UTC

프리 마커 : 내가 언급 여기에 해결로 캐릭터 라인 화 날짜를 변경하는 것을 발견했습니다

<script type="text/javascript"> 
    var resourceVacation; 

    function censor(censor) { 
     return (function() { 
      var i = 0; 
      return function(key, value) { 
       if (i !== 0 && typeof(censor) === 'object' && typeof(value) == 'object' && censor == value) 
        return '[Circular]';     

       ++i; // so we know we aren't using the original object anymore 

       return value; 
      } 
     })(censor); 
    } 


    function doAjax() { 

     $.each(resourceVacation, function(index) { 
      var tmpDate = resourceVacation[index].start; 
      tmpDate.setHours(tmpDate.getHours() - tmpDate.getTimezoneOffset()/60); 
      resourceVacation[index].start=tmpDate; 

     }); 
//  var arrays = [ 
//   {"id":111,"title":"event1","start":"2012-04-15T22:00:00.000Z","url":"http://yahoo.com/"} 
//  ]; 
//  var objects = {"id":111,"title":"event2","start":"2012-04-16T22:00:00.000Z","url":"http://yahoo2.com/"}; 
// 
//  arrays.push(objects); 
     var test = JSON.stringify(resourceVacation, censor(resourceVacation)); 
     var x = test; 
     $.ajax(
     { 
      url:"[@spring.url '/vacation/saveResourceVacation'/]", 
      type: "POST", 
      data :x , 
      dataType: "json", 
      contentType: "application/json" 
     }); 
    } 


    $(document).ready(function() { 

     var date = new Date(); 
     var d = date.getDate(); 
     var m = date.getMonth(); 
     var y = date.getFullYear(); 
     $.getJSON('[@spring.url '/vacation/loadResourceVacation'/]', function (data) { 
      var calendar = $('#calendar').fullCalendar({ 
       header: { 
        left: 'prev,next today', 
        center: 'title', 
        right: 'month,agendaWeek,agendaDay' 
       }, 
       selectable: true, 
       selectHelper: true, 
       select: 
         function(start, end, allDay) { 
          var title = prompt('Event Title:'); 

          if (title) { 
           start.setHours(start.getHours() - start.getTimezoneOffset()/60); 
//        var dat=$.fullCalendar.formatDate(start, "yyyy/MM/dd") 


           var newVacation= {id:133,title:'title',start:start,url: 'title'}; 
           resourceVacation.push(newVacation); 
           calendar.fullCalendar('renderEvent', 
           { 
            title: title, 
            start: start, 
            end: end, 
            allDay: allDay 
           }, 
             true // make the event "stick" 
             ); 
          } 
          calendar.fullCalendar('unselect'); 
         }, 

       editable: true, 
       events:data 
      }); 
      resourceVacation = data; 
     }); 
    }); 


</script> 

컨트롤러 :

 @RequestMapping(value = "/vacation/loadResourceVacation", method = RequestMethod.GET) 
     public 
     @ResponseBody 
     String loadResourceVacation(HttpServletResponse response) throws Exception { 


      //Here I build my vacationFormBean 
      List<VacationFormBean> vacationFormBeanList= buildVacationFormBean(); 
      // Convert to JSON string. 
      String json = new Gson().toJson(vacationFormBeanList); 

      // Write JSON string. 
      response.setContentType("application/json"); 
      response.setCharacterEncoding("UTF-8");  

     return json; 
    } 

    @RequestMapping(value = "/vacation/saveResourceVacation", method = RequestMethod.POST) 
    public 
    @ResponseBody 
    void saveResourceVacation(@RequestBody String jsonString, Principal principal) throws Exception { 
     List<String> resourceVacations = extractVacationDatesFromJsonObject(jsonString); 

    } 

VacationFormBean :

public class VacationFormBean { 
    int id; // (With Setter & Getter) 
    String title; // (With Setter & Getter) 
    String start; // (With Setter & Getter) 
    String url; // (With Setter & Getter) 
}