1

Spring MVC + Freemarker とともに JQuery Full Calendar を使用しようとしています。

そんなデモを作りました。

ターゲット: コントローラーに渡したばかりのカレンダーのデータを処理するために送信する必要があります。

問題: データをコントローラーに送信すると、コントローラーで受信した文字列パラメーターに「undefined=undefined」が含まれています!!

フリーマーカー:

[#ftl /]
<script type="text/javascript">
    var calendar;
    var calendarData;
    function sendDataViaAjax() {
         $.ajax(
            {
              url:"[@spring.url '/vacation/setVacation'/]",
              type: "POST",
              data: calendarData,
              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>
<style type='text/css'>


    body {
        margin-top: 40px;
        text-align: center;
        font-size: 14px;
        font-family: "Lucida Grande", Helvetica, Arial, Verdana, sans-serif;
    }

    #calendar {
        width: 900px;
        margin: 0 auto;
    }

</style>
<body>
<div id='calendar'></div>

<button value="Test" onclick="sendDataViaAjax()"
</body>

String パラメーターが "undefined=undefined" の Java コントローラー:

 @RequestMapping(value = "/vacation/setVacation", method = RequestMethod.POST)
      public
      @ResponseBody
      String setVacation( @RequestBody String  response) {

       //Rest of code
      }

フリーマーカーを次のように少し変更しました。

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

    function doAjax() {
        var test = JSON.stringify(calendarData);

        $.ajax(
        {
            url:"[@spring.url '/vacation/setVacation'/]",
            type: "POST",
            data :test ,
            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]   //To allow Calendar to render data ,I use events:data instead
            });
            calendarData = data;
        });
    });


</script>

このようにして、json String をコントローラーに投稿し、そこから必要なことを続けることができます。初期化中に渡したイベントなしでカレンダーが空になるのは、私を殺していることです。ただし、上記のコメントで述べたように、Calendar データをレンダリングするために小さな変更を加えます。このようにして、json文字列を投稿しようとすると、次のエラーが表示されます:「Uncaught TypeError: 循環構造をJSONに変換しています」. 私は多くの試行を行いましたが、言及された問題はまだあります!! そこで何が起こっているのか、誰もが知っています!!

4

1 に答える 1

0

あなたが解決するのに役立つと私が考えることができるもののいくつかは次のとおりです

  1. 変数 "calendar" の値をアラートまたは firebug で確認してください。それはあなたが期待する値ですか？
  2. ajax POST の代わりに、REST パターン「PUT」の他のオプションを試して、コントローラーでも同じように変更できます。
  3. RequestParam アノテーションを RequestBody と共に使用してみることができます。
于 2012-04-15T13:10:38.480 に答える