获取选定日期到表单JQuery Full Calendar

Question

我正在加载一个弹出表单，以通过单击每个日期单元格中的+图标在“日历”界面中添加约会。 我使用下面给定的方法在日期单元格中添加+图标，当用户单击它时，将出现模式框。

viewDisplay:function (view) {
            if(i==0){
                $(".fc-day-number").before("<button class=\"remove-b\" style=\"border:none; background:none\" data-toggle=\"modal\" data-target=\"#myModal\"><i class=\"icon-plus add_appt\"></i></button>");
                i++;
            }        
},

当用户单击+图标保存到数据库时，我想将选定的日期加载到表单中的字段中。

谁能帮助我知道有哪些可能的方法？

Answer 1

这就是我能够解决类似问题的方式。 仅供参考，我使用的是fullCalendar版本1.6.4。

        $(document).ready(function () {


            /* Add mouseover for the day cells so we can keep track of the day the mouse is over.
            * This is so we know which day a mouse click occured on when clicking an icon or div
            * in the day cell.
            */
            $('td.fc-day').mouseover(function () {

                // Get the date.
                var mouseoverDate = $(this).data('date');

                // Add to hidden input field.
                $('#hiddenMouseOverDate').val(mouseoverDate);

                /* Since the mouseover is not fully reliable we will
                * select and highlight the cell for visual representation
                * to the user so they know what date the event will actually 
                * be added to.
                */
                $('#calendar').fullCalendar('unselect');
                $('.fc-cell-overlay').removeClass('fc-cell-overlay');
                $('#calendar').fullCalendar('select', strDate, strDate, true);
                $(this).addClass('fc-cell-overlay');

            });

            /* We do the same thing for fc-day-number. */
            $('td.fc-day-number').mouseover(function () {

                // Get the date.
                var mouseoverDate = $(this).data('date');

                // Add to hidden input field.
                $('#hiddenMouseOverDate').val(mouseoverDate);

                // Select and highlight the cell.
                $('#calendar').fullCalendar('unselect');
                $('.fc-cell-overlay').removeClass('fc-cell-overlay');
                $('#calendar').fullCalendar('select', strDate, strDate, true);
                $("td.fc-day").filter("[data-date='" + strDate + "']").addClass('fc-cell-overlay');
            });

            /* Then in your plus icon click event you would need to store the date you saved 
             * in the '#hiddenMouseOverDate' field and copy it to some other field you want.
             * (This is to prevent using an incorrect date due to the user moving his/her mouse
             * into another day cell after they clicked on the plus icon)
             */
            $('.icon-plus').click(function (e) {


                var useDate = $('#hiddenMouseOverDate').val();

                // Rest of you code here...
                // .....

            });

        });

我做了一些调整以适应您的问题，所以我没有测试过，但是逻辑就在那里。