Question

我从bootstrap-year-calendar.com连接bootstrap年度日历与我的mysql基础有问题。

我创建了getEvents.php文件，该文件与base连接并获取事件数据。当我从这个文件打印结果时，一切正常，我看到了我的事件，但当我试图将这个结果包含在日历脚本中的DataSource时，我没有看到任何事件。

有人可以举例说明怎么做？

我的代码：

getEvents.php

 updateVisuals: function (time, effect) {
      // Check if parameter exists and property can be read
      if (this.breakpointsMap && typeof this.breakpointsMap[checkTime] !== "undefined") {
        if (effect === 'show') {
          // display the items that were fast forwarded
          var k = this.breakpointsMap[checkTime].length;
          while (k--) {
            try {
              this.breakpointsMap[checkTime][k].show();
            } catch (err) {}
          }
        } else if (effect === 'hide') {
          // display the items that were fast forwarded
          var k = this.breakpointsMap[checkTime].length;
          while (k--) {
            try {
              this.breakpointsMap[checkTime][k].hide();
            } catch (err) {}
          }
        }
      }
    }

日历脚本我改为

//MyPlayground.playground
import UIKit

class MyCustomView :UIView{

    //Write your code in drawRect
    override func draw(_ rect: CGRect) {
        let myBezier = UIBezierPath()
        myBezier.move(to: CGPoint(x: 0, y: 0))
        myBezier.addLine(to: CGPoint(x: 100, y: 0))
        myBezier.addLine(to: CGPoint(x: 50, y: 100))
        myBezier.close()
        UIColor.black.setStroke()
        myBezier.stroke()
    }

}

var view = MyCustomView(frame: CGRect(x: 0, y: 0, width: 100, height: 100))
view.backgroundColor = UIColor.white

现实化

@JeffHuijsmans我不知道如何解决它。

请告诉我如何从getEvents.php文件中获取dataSource函数结果？

来自getEvents文件的echo返回

<?php 

        require "bdd.php";
        $result = $bdd->prepare("SELECT `id`, `title`, `start`, `end`, `color`, `dsc`, `zlec`, `stanowisko` FROM `events`");
        $result->execute();
        $event_array = array();
        $result->setFetchMode(PDO::FETCH_ASSOC);
        while ($record = $result->fetch()) {
            $event_array[] = array(
                'id' => $record['event_id'],
                'title' => $record['event_name'],
                'start' => $record['start_event'],
                'end' => $record['end_event'],
            );
        }
    echo json_encode($event_array);

?>

dataSource中的默认数据如下所示：

dataSource: ['getEvents.php']

Answer 1

“解决方法”是迭代数据数组并生成包含日历格式数据的字符串。

这里工作正常，希望有所帮助。

样品：

private function convertYearData(array $yearData) : string
    {
        if (empty($yearData)) {
            return 'null';
        }
        $data = '';
        foreach ($yearData as $event) {
            if (empty($data)) {
                $data =  "[{id:{$event['id']}, name:'{$event['name']}', type:'{$event['type']}', startDate: new Date('{$event['startDate']}'), endDate: new Date('{$event['endDate']}')}";
            } else {
                $data .=  ", {id:{$event['id']}, name:'{$event['name']}', type:'{$event['type']}', startDate: new Date('{$event['startDate']}'), endDate: new Date('{$event['endDate']}')}";
            }   
        }
        $data .= ']';
        return $data;
    }

    $yearDataArr = [
        [
            'id' => '1',
            'name' => 'Pesquisa Teste',
            'type' => 'Pesquisa',
            'color' => '#4da539',
            'startDate' => '2017-04-28 02:00:00',
            'endDate' => '2017-04-30 12:00:00',
        ],
        [
            'id' => '2',
            'name' => 'Media Teste',
            'type' => 'Media',
            'color' => '#00afe8',
            'startDate' => '2017-04-25 02:00:00',
            'endDate' => '2017-05-12 12:00:00',
        ],
        [
            'id' => '3',
            'name' => 'Email Marketing Teste',
            'type' => 'Email Marketing',
            'color' => '#af2828',
            'startDate' => '2017-03-25 02:00:00',
            'endDate' => '2017-05-17 12:00:00',
        ],
    ];
    $yearData = $this->convertYearData($yearDataArr);

之后，在你的html中只是回显你的var $ yearDate：

$('#calendar').calendar({ 
    language:'pt',
    enableContextMenu: false,
    enableRangeSelection: true,
    selectRange: function(e) {
        editEvent({ startDate: e.startDate, endDate: e.endDate });
    },
    mouseOnDay: function(e) {
        if(e.events.length > 0) {
            var content = '';

            for(var i in e.events) {
                content += '<div class="event-tooltip-content">'
                            + '<div class="event-name" style="color:' + e.events[i].color + '">' + e.events[i].type + '</div>'
                            + '<div class="event-type">' + e.events[i].name + '</div>'
                        + '</div>';
            }

            $(e.element).popover({ 
                trigger: 'manual',
                container: 'body',
                html:true,
                content: content
            });

            $(e.element).popover('show');
        }
    },
    mouseOutDay: function(e) {
        if(e.events.length > 0) {
            $(e.element).popover('hide');
        }
    },
    dayContextMenu: function(e) {
        $(e.element).popover('hide');
    },
    dataSource: <?php echo $this->yearData; ?>
});

如何使用mysql base连接bootstrap年历

现实化

1 个答案: