FullCalendar事件从asp.net ASHX页面中无法显示

3
我将会用中文进行翻译。以下是内容:

我一直在尝试使用以下代码通过调用ASHX页面向fullCalendar添加一些事件。

页面脚本:

<script type="text/javascript">
    $(document).ready(function() {
        $('#calendar').fullCalendar({
           header: {
               left: 'prev,next today', center: 'title', right: 'month, agendaWeek,agendaDay'
           },
           events: 'FullCalendarEvents.ashx'

        })                  
     });
 </script>

C# 代码:

public class EventsData
{
    public int id { get; set; }
    public string title { get; set; }
    public string start { get; set; }
    public string end { get; set; }
    public string url { get; set; }
    public int accountId { get; set; }
}

public class FullCalendarEvents : IHttpHandler
{

    private static List<EventsData> testEventsData = new List<EventsData>
    {
        new EventsData {accountId = 0, title = "test 1", start = DateTime.Now.ToString("yyyy-MM-dd"), id=0},
        new EventsData{ accountId = 1, title="test 2", start = DateTime.Now.AddHours(2).ToString("yyyy-MM-dd"), id=2}
    };

    public void ProcessRequest(HttpContext context)
    {
        context.Response.ContentType = "application/json.";
        context.Response.Write(GetEventData());
    }

    private string GetEventData()
    {
        List<EventsData> ed = testEventsData;
        StringBuilder sb = new StringBuilder();

        sb.Append("[");

        foreach (var data in ed)
        {
            sb.Append("{");
            sb.Append(string.Format("id: {0},", data.id));
            sb.Append(string.Format("title:'{0}',", data.title));
            sb.Append(string.Format("start: '{0}',", data.start));
            sb.Append("allDay: false");
            sb.Append("},");
        }
        sb.Remove(sb.Length - 1, 1);
        sb.Append("]");
        return sb.ToString();
    }


}

ASHX页面被调用并返回以下数据:
[{id: 0,title:'test 1',start: '2010-06-07',allDay: false},{id: 2,title:'test 2',start: '2010-06-07',allDay: false}]
调用ASHX页面不显示任何结果,但如果我直接将返回的值粘贴到事件中,它会正确显示。我已经尝试让这段代码工作了一天,但我看不出为什么事件没有被设置。
如果您能提供帮助或建议,将不胜感激。
Steve
7个回答

3

如果有人遇到这个问题,请注意。我尝试了以上所有解决方案,但都没有成功。 对于我来说,问题是通过使用旧版本的jquery解决的。我从fullcalendar包中包含的1.5.2版本切换到1.3.2版本。


1

你的JSON数据缺少了end项:

{id: 0,title:'test 1',start: '2010-06-07',end: '2010-06-07',allDay: false}

1
Steve, 我遇到了类似的问题——如果JSON直接在fullCalendar调用中,它会呈现事件,但是来自外部URL的相同JSON不会呈现。最终,我通过修改JSON使得“id”、“title”、“start”、“end”和“allDay”周围有引号才让它正常工作。
所以,与您的示例JSON一起使用时,不是这样: [{id: 0,title:'test 1',start: '2010-06-07',allDay: false},{id: 2,title:'test 2',start: '2010-06-07',allDay: false}]
而是这样: [{"id": 0,"title":"test 1","start": "2010-06-07","allDay": false},{"id": 2,"title":"test 2","start": "2010-06-07","allDay": false}]
现在,为什么它在本地工作但在远程上不工作,我无法说。

0

从asp.net ASHX页面获取的FullCalendar事件未显示是解决此问题的正确方法。

我使用了长日期格式。

而且,@Steve,我们可以使用“-”而不是StringAppending:

System.Web.Script.Serialization.JavaScriptSerializer oSerializer =
new System.Web.Script.Serialization.JavaScriptSerializer();
String sJSON = oSerializer.Serialize(evList); 

evList是包含所有事件的列表,具有基本属性(如id,start,end,description,allDay等)。

我知道这个主题是一个旧主题,但这对其他用户将是有帮助的。

只需汇总所有答案即可。


0

我曾经遇到过这个问题,后来通过使用 .ashx 处理程序解决了它,具体如下:

我的返回类看起来像是这样的...

 public class Event
    {
        public Guid id { get; set; }
        public string title { get; set; }
        public string description { get; set; }
        public long start { get; set; }
        public long end { get; set; }
        public bool allDay { get; set; }
    }

在编程中,将DateTime值转换为long值的方法是使用...

private long ConvertToTimestamp(DateTime value)
    {
        long epoch = (value.ToUniversalTime().Ticks - 621355968000000000) / 10000000;
        return epoch;
    }

而 ProcessRequest 看起来像...

public void ProcessRequest(HttpContext context)
    {
        context.Response.ContentType = "text/html";
        DateTime start = new DateTime(1970, 1, 1);
        DateTime end = new DateTime(1970, 1, 1);
        try
        {
            start = start.AddSeconds(double.Parse(context.Request.QueryString["start"]));
            end = end.AddSeconds(double.Parse(context.Request.QueryString["end"]));
        }
        catch
        {
            start = DateTime.Today;
            end = DateTime.Today.AddDays(1);
        }
        List<Event> evList = new List<Event>();
        using (CondoManagerLib.Linq.CondoDataContext Dc = new CondoManagerLib.Linq.CondoDataContext(AppCode.Common.CGlobals.DsnDB))
        {
            evList = (from P in Dc.DataDailySchedules
                      where P.DateBeg>=start && P.DateEnd<=end
                      select new Event
                      {   description = P.Description,
                          id = P.RecordGuid,
                          title = P.Reason,
                          start = ConvertToTimestamp(P.DateBeg),
                          end = ConvertToTimestamp(P.DateEnd),
                          allDay = IsAllDay(P.DateBeg, P.DateEnd)
                      }).ToList();
        }
        System.Web.Script.Serialization.JavaScriptSerializer oSerializer = new System.Web.Script.Serialization.JavaScriptSerializer();
        String sJSON = oSerializer.Serialize(evList);
        context.Response.Write(sJSON);
    }

我的文档已准备好...

>  $(document).ready(function () {
>             $('#calendar').fullCalendar({
>                 header: { left: 'title', center: 'prev,today,next', right: 'month,agendaWeek,agendaDay' },
>                 editable: false,
>                 aspectRatio: 2.1,
>                 events: "CalendarEvents.ashx",
>                 eventRender: function (event, element) {
>                     element.qtip({
>                         content: event.description,
>                         position: { corner: { tooltip: 'topLeft', target: 'centerLeft'} },
>                         style: { border: { width: 1, radius: 3, color: '#000'},
>                             padding: 5,
>                             textAlign: 'center',
>                             tip: true, 
>                             name: 'cream' 
>                         }
>                     });
>                 }
>             })
>         });

qTip插件可以在http://craigsworks.com/projects/qtip/找到。

希望这能帮到你。


我想用日期范围和星期几来做同样的事情。我能够使用startDate和endDate显示日历,但是如何使用ashx处理程序实现范围功能呢? - sohaiby

0

让我们看看我们知道的并排除可能性:

  • ASHX页面被调用并返回数据:

    因此,服务器端部分运行良好,并且调用服务器端的代码也正常工作。

  • 我直接将返回的值粘贴到事件中,它正确显示。

    因此,处理响应的代码是正确的。

从逻辑上讲,我们可以看到连接服务器响应和日历输入的代码不起作用。不幸的是,我对jQuery fullCalendar方法不熟悉,但也许您缺少回调声明?


谢谢您的回复,Joel,我已经根据fullcalendar文档中的代码创建了fullcalendar脚本:$('#calendar').fullCalendar({ events: "/myfeed.php" });将php页面替换为我的ascx,因此不需要回调,除非php页面处理方式不同。 - Steve Howard

0

我认为这可能与您的日期数值有关。


谢谢你,但如果与日期有关,我希望我直接粘贴到日历中的结果值不起作用。 - Steve Howard

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接