MVC4中的Jquery Popup CSHTML视图

时间:2014-04-15 20:31:55

标签: javascript jquery html5 asp.net-mvc-4 bpopup

我正在尝试使用此源http://dinbror.dk/bpopup/来弹出视图(Calendar.cshtml)。我没有成功做到这一点,并希望有人可以帮助我。我一直在bpopup示例中使用#5但尚未使其正常工作。 Calendar.cshtml位于Views / Home / Calendar.cshtml中。是否有任何人可以帮助我在这里工作是我一直在努力做的事情。

    $('#calendar').bPopup({
            contentContainer: '#calendar',
            loadUrl: 'Calendar.cshtml',
            easing: 'easeOutBack', //uses jQuery easing plugin
            speed: 450,
            transition: 'slideDown'
        }); 

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

我觉得我没有正确地做到这一点。

编辑:

我想要完成的基本目标是使用bPopup在弹出窗口中显示一个jquery日历插件。

此函数创建日历并将其放在#calendar:

    function InitializeCalendar() {

        var date = new Date();
        var d = date.getDate();
        var m = date.getMonth();
        var y = date.getFullYear();

        $('#calendar').fullCalendar({
            header: {
                left: 'prev,next today',
                center: 'title',
                right: 'month,basicWeek,basicDay'
            },
            editable: true,
            events: [
                {
                    title: 'All Day Event',
                    start: new Date(y, m, 1)
                },
                {
                    title: 'Long Event',
                    start: new Date(y, m, d - 5),
                    end: new Date(y, m, d - 2)
                },
                {
                    id: 999,
                    title: 'Repeating Event',
                    start: new Date(y, m, d - 3, 16, 0),
                    allDay: false
                },
                {
                    id: 999,
                    title: 'Repeating Event',
                    start: new Date(y, m, d + 4, 16, 0),
                    allDay: false
                },
                {
                    title: 'Meeting',
                    start: new Date(y, m, d, 10, 30),
                    allDay: false
                },
                {
                    title: 'Lunch',
                    start: new Date(y, m, d, 12, 0),
                    end: new Date(y, m, d, 14, 0),
                    allDay: false
                },
                {
                    title: 'Birthday Party',
                    start: new Date(y, m, d + 1, 19, 0),
                    end: new Date(y, m, d + 1, 22, 30),
                    allDay: false
                },
                {
                    title: 'Click for Google',
                    start: new Date(y, m, 28),
                    end: new Date(y, m, 29),
                    url: 'http://google.com/'
                }
            ]
        });
    }

截至目前,点击该按钮后,日历显示在页面底部,但不显示在bpopup中。

0 个答案:

没有答案