如何使用从mysql服务器(phpmyAdmin)检索的数组在FullCalendar中添加事件?

时间:2014-06-26 07:33:51

标签: php fullcalendar

我很感激我收到的任何帮助。如果我的错误很明显,我也会道歉。我的问题是我似乎无法找到关于如何显示我的数组的所有元素以填充我的事件的想法。

        for(var i = 0;i < count;i++)
        {
            // these are the arrays that contain my events
            var primaryAsset = primaryAssets[i];
            var release_Date = releaseDates[i];


            $('#calendar').fullCalendar({
            header: {
                left: 'prev,next today',
                center: 'title',
                right: 'month,agendaWeek,agendaDay'
            },
            editable: true,
            weekMode: 'liquid',
            weekends: true,

            events: [
                {
                    title: primaryAsset,
                    start:  release_Date,
                    end: release_Date
                }
            ]
          });
        }

3 个答案:

答案 0 :(得分:0)

请先创建事件数组然后传入完整日历,如

var evt = [
    {
        title  : 'event1',
        start  : '2014-01-01'
    },
    {
        title  : 'event2',
        start  : '2014-01-05',
        end    : '2014-01-07'
    },
    {
        title  : 'event3',
        start  : '2014-01-09T12:30:00',
        allDay : false 
    }
];

然后添加到fullcalendar

 $('#calendar').fullCalendar({
        header: {
            left: 'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
        },
        editable: true,
        weekMode: 'liquid',
        weekends: true,

        events: evt
      });

答案 1 :(得分:0)

这是我从php文件中获取json数据的脚本。这可能适合你。

<script>
$('#calendar').fullCalendar(
{
    header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
    },
    editable: true,
    events:
    {   // Render the events in the calendar
        url: 'calendarData.php', // Get the URL of the json feed
        error: function() 
        {
            alert('There Was An Error While Fetching Events Or The Events Are Not Found!');
        }
    }
});
</script>

日历Data.php

$return_array = array();
        while ($row = mysql_fetch_array($sth)) 
        {
            $event_array = array();
            $event_array['id'] = $row['e_id'];
            $date_start = $row['e_date_start'];
            $date_end   = $row['e_date_end'];
                $date_start = explode(" ",$date_start);
                $date_end   = explode(" ", $date_end);
                $date_start[0] = str_replace('-' , '/' , trim($date_start[0]));
                $date_end[0] = str_replace('-' , '/' , trim($date_end[0]));
                //Event Title Structure
            if($row['e_title'] != "")
            {
                $event_array['title'] = $row['e_title'];
                    //Start Date Structure
                    if($date_start[0] != "0000/00/00" && $date_start[1] != "00:00:00")
                    {

                        $event_array['start'] = date(DATE_ISO8601, strtotime($date_start[0]." ".$date_start[1]));
                    }

                    //End Date Structure
                    if($date_end[0] != "0000/00/00" && $date_end[1] != "00:00:00")
                    {

                        $event_array['end'] = date(DATE_ISO8601, strtotime($date_end[0]." ".$date_end[1]));
                    }

                    //All Day Event Structure
                    if($row['e_allday'] == '1')
                    {
                        $event_array['allDay'] = true;

                    }
                    elseif($row['e_allday'] == '0') 
                    {
                        $event_array['allDay'] = false;
                    }

                array_push($return_array, $event_array);
            }
        }
        echo json_encode($return_array);

答案 2 :(得分:0)

以下是我采取的步骤,其工作非常顺利:
1.使用fullCalendar文档中的基本代码加载日历:

    <script>
    $(document).ready(function() {
    // page is now ready, initialize the calendar...
    $('#calendar').fullCalendar({
    // put your options and callbacks here
    })
    });
    </script>
  1. 确保您实际上可以从数组中提取数据(它不需要在日历中,只需将其加载到页面上以验证它是否有效)。这样的事情应该这样做:(注意,我没有测试过这段代码,但它很接近。虽然可能需要调整)但

    if ( have_posts() ) :
      //start a while statement
      while ( have_posts() ) :
        the_post();
        $content_types = get_the_terms( $post_id, $taxonomy_categories );
        $tag_link = get_field('tag_link');
        $tag_host = parse_url($tag_link);
        $tag_page = $tag_host['scheme'] . '://' . $tag_host['host'];
    
        echo the_title();
        echo the_field('date');
      endwhile;
    endif;
    
  2. 添加静态数组,以测试数组元素是否会显示在日历上。使用来自fullCalendar文档的代码:

    $('#calendar').fullCalendar({
    events: [
      {
          title  : 'event1',
        start  : '2010-01-01'
      },
      {
        title  : 'event2',
        start  : '2010-01-05',
        end    : '2010-01-07'
      },
      {
        title  : 'event3',
        start  : '2010-01-09T12:30:00',
        allDay : false // will make the time show
      }
    ]
    });
    
  3. 最后,一旦到目前为止一切正常,请用动态数据替换静态数据。你可以通过循环包装它,并通过PHP获取必要的字段。这是我使用的代码:

    <script>
     $(document).ready(function() {
     // page is now ready, initialize the calendar...
     $('#calendar').fullCalendar({
     // put your options and callbacks here
       events: [
         //start if
         <?php
         if ( have_posts() ) :
           //start a while statement
           while ( have_posts() ) :
             the_post();
             $content_types = get_the_terms( $post_id, $taxonomy_categories );
             $tag_link = get_field('tag_link');
             $tag_host = parse_url($tag_link);
             $tag_page = $tag_host['scheme'] . '://' . $tag_host['host'];
            ?>
            {
              title  : '<?php the_title();?>',
              start  : '<?php the_field('date');?>'
    
              //only need one item in the array, because with the while loop, this will repeat until all the posts are added.
    
            },
                <?php
                endwhile;
                endif;
                ?>
            ]
        })
    
    });