翻譯|使用教程|編輯:董玉霞|2022-02-28 10:49:23.643|閱讀 307 次
概述:在dhtmlxScheduler的使用教程中,您將找到有關如何在沒有任何框架的情況下使用PHP創建調度程序的具體操作過程。我們將使用MySQL作為數據存儲和數據訪問的PDO接口,創建調度程序的先決條件是啟用PDO_MYSQL擴展的PHP5.4或更高版本以及MySQL或MariaDB。
# 界面/圖表報表/文檔/IDE等千款熱門軟控件火熱銷售中 >>
在dhtmlxScheduler的使用教程中,您將找到有關如何在沒有任何框架的情況下使用PHP創建調度程序的具體操作過程。我們將使用MySQL作為數據存儲和數據訪問的PDO接口,創建調度程序的先決條件是啟用PDO_MYSQL擴展的PHP5.4或更高版本以及MySQL或MariaDB。
下面,我們將分布介紹具體操作方法:
我們從在應用程序準備一個新目錄開始,讓我們創建一個空的項目文件夾并命名它scheduler-howto-php-plain。
現在我們需要用我們的調度器創建一個頁面,在文件夾中創建一個index.html文件,scheduler-howto-php-plain并用以下內容填充它:
<!doctype html> <html> <head> <title> Getting started with dhtmlxScheduler</title> <meta charset="utf-8"> <script src="http://cdn.dhtmlx.com/scheduler/edge/dhtmlxscheduler.js"></script> <link rel="stylesheet" type="text/css" charset="utf-8"> <style> html, body{ margin:0px; padding:0px; height:100%; overflow:hidden; } </style> </head> <body> <div id="scheduler_here" class="dhx_cal_container" style='width:100%; height:100%;'> <div class="dhx_cal_navline"> <div class="dhx_cal_prev_button"> </div> <div class="dhx_cal_next_button"> </div> <div class="dhx_cal_today_button"></div> <div class="dhx_cal_date"></div> <div class="dhx_cal_tab" name="day_tab"></div> <div class="dhx_cal_tab" name="week_tab"></div> <div class="dhx_cal_tab" name="month_tab"></div> </div> <div class="dhx_cal_header"></div> <div class="dhx_cal_data"></div> </div> <script> scheduler.init('scheduler_here', new Date(2019,0,20), "week"); scheduler.load("data/api.php"); var dp = new dataProcessor("data/api.php"); dp.init(scheduler); dp.setTransactionMode("JSON"); // use to transfer data with JSON </script> </body> </html>
現在您可以運行應用程序以查看調度程序在頁面上呈現:
通過以上步驟我們就擁有一個空的調度程序,是時候創建一個數據庫并將其連接到我們的應用程序了。
您可以從您最喜歡的mysql客戶端(例如 phpMyAdmin)或通過控制臺創建數據庫,這是用于創建帶有日歷事件表的新數據庫:
CREATE DATABASE IF NOT EXISTS `scheduler_howto_php`; USE `scheduler_howto_php`; DROP TABLE IF EXISTS `events`; CREATE TABLE `events` ( `id` int(11) AUTO_INCREMENT, `start_date` datetime NOT NULL, `end_date` datetime NOT NULL, `text` varchar(255) DEFAULT NULL, PRIMARY KEY (`id`) ) DEFAULT CHARSET=utf8;
要通過mysql控制臺導入,請使用上面的代碼創建一個dump.sql文件,并在shell中執行以下命令:
$ mysql -uuser -ppass scheduler < mysql_dump.sql
創建數據庫后,我們需要用實際數據填充調度程序,我們在項目文件夾中創建一個名為data的新文件夾。
首先,在配置data/config.php文件中定義數據庫連接參數:
<?php $dsn = "mysql:host=localhost;dbname=scheduler_howto_php"; $username = "root"; $password = ""; $options = array( PDO::MYSQL_ATTR_INIT_COMMAND => "SET NAMES 'utf8'", PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION, PDO::ATTR_DEFAULT_FETCH_MODE => PDO::FETCH_ASSOC, );
添加一個php腳本,該腳本將從客戶端調用以從數據庫加載數據或將調度程序更改保存回數據庫。
api.php在文件夾中創建一個名為的新文件data并添加以下代碼以創建和打開連接:
<?php require_once("config.php"); $db = new PDO($dsn, $username, $password, $options);
然后,我們可以實現一個函數來獲取連接并從數據庫中讀取調度程序數據:
function read($db, $requestParams){ $queryParams = []; $queryText = "SELECT * FROM `events`"; $query = $db->prepare($queryText); $query->execute($queryParams); $events = $query->fetchAll(); return $events; }
最后,我們可以創建我們的請求處理程序:
switch ($_SERVER["REQUEST_METHOD"]) { case "GET": $result = read($db, $_GET); break; case "POST": // we'll implement this later break; default: throw new Exception("Unexpected Method"); break; } header("Content-Type: application/json"); echo json_encode($result);
現在,如果您將一些事件添加到數據庫中,它們將出現在您的調度程序中。
目前,調度程序可以從后端讀取數據。我們把它將更改寫回數據庫。 客戶端將以JSON模式工作,這意味著它將發送事件操作的POST請求,檢查請求的格式以及調度程序將使用的所有路由。
現在是時候添加“創建”、“更新”和“刪除”函數來執行諸如創建新事件、更新現有事件以及從數據庫中刪除事件等操作了。
返回data/api.php并將以下代碼添加到文件中:
// create a new event function create($db, $event){ $queryText = "INSERT INTO `events` SET `start_date`=?, `end_date`=?, `text`=?"; $queryParams = [ $event["start_date"], $event["end_date"], $event["text"] ]; $query = $db->prepare($queryText); $query->execute($queryParams); return $db->lastInsertId(); } // update an event function update($db, $event, $id){ $queryText = "UPDATE `events` SET `start_date`=?, `end_date`=?, `text`=? WHERE `id`=?"; $queryParams = [ $event["start_date"], $event["end_date"], $event["text"], $id ]; $query = $db->prepare($queryText); $query->execute($queryParams); } // delete an event function delete($db, $id){ $queryText = "DELETE FROM `events` WHERE `id`=? ;"; $query = $db->prepare($queryText); $query->execute([$id]); }
之后,我們可以調用這個函數來處理一個POST請求:
$db = new PDO($dsn, $username, $password, $options); switch ($_SERVER["REQUEST_METHOD"]) { case "GET": $result = read($db, $_GET); break; case "POST": $requestPayload = json_decode(file_get_contents("php://input")); $id = $requestPayload->id; $action = $requestPayload->action; $body = (array) $requestPayload->data; $result = [ "action" => $action ]; if ($action == "inserted") {; $databaseId = create($db, $body); $result["tid"] = $databaseId; } elseif($action == "updated") { update($db, $body, $id); } elseif($action == "deleted") { delete($db, $id); } break; default: throw new Exception("Unexpected Method"); break; } header("Content-Type: application/json"); echo json_encode($result);
最后,我們將配置客戶端以利用我們剛剛實現的API:
scheduler.init("scheduler_here", new Date(2019, 0, 20), "week"); scheduler.setLoadMode("day"); // load data from the backend scheduler.load("data/api.php"); // send updates to the backend var dp = new dataProcessor("data/api.php"); dp.init(scheduler); // set data exchange mode dp.setTransactionMode("JSON");
如果您現在重新啟動應用程序,您應該能夠在調度程序中創建刪除和修改事件,所有更改都將在您重新加載頁面后出現。
現在你有了一個基本的調度器,它將其事件存儲在 mysql 數據庫中。
dhtmlxScheduler是一個客戶端組件,出于靈活性考慮,它沒有內置的安全保護措施。此外,僅客戶端無法提供可靠的安全措施。
這意味著應用程序的安全性由后端開發人員負責,需要注意的最明顯的方面如下:
如果您已完成上述步驟以實現調度程序與PHP的集成,但調度程序未在頁面上呈現事件,請查看解決后端集成問題的文章,它具體描述了識別問題根源的方法。
以上就是關于在使用dhtmlxScheduler 時如何在沒有任何框架的情況下使用PHP創建調度程序的具體內容。
dhtmlxScheduler 是一個類似于Google日歷的JavaScript日程安排控件,日歷事件通過Ajax動態加載,支持通過拖放功能調整事件日期和時間。事件可以按天,周,月三個種視圖顯示。
本站文章除注明轉載外,均為本站原創或翻譯。歡迎任何形式的轉載,但請務必注明出處、不得修改原文相關鏈接,如果存在內容上的異議請郵件反饋至chenjj@fc6vip.cn