将动态数据属性传递给 dhtmlxScheduler

Question

是否可以通过数据属性将数据动态传递给 dhtmlxScheduler？

我正在尝试传递动态数据，特别是日期，然后用于阻止调度程序显示我尝试传递的日期之前的事件。 调度程序已经接收到api-url、api-root 和read-only 之类的数据，但是当我尝试使用data-attribute 添加更多数据时，我得到了undefined。我尝试使用.data() 和.attr()。这是我迄今为止尝试过的：

Blade.php 模板

 <x-scheduler :api-url="route('portal.schedule.events', $project)"
              api-root="/portal/schedules"
              :read-only="true"
              :data-project-start-date="$projectStartDate"
/>

Scheduler.js

 const schedulerElement = $('#scheduler');
 const api_url = schedulerElement.data('api-url');
 const api_root = schedulerElement.data('api-root');

 const project_start_date = schedulerElement.attr('data-project-start-date');
 //const project_start_date = schedulerElement.data('project-start-date');

Answer 1

是的，从技术上讲，您可以将“数据属性”添加到调度程序容器中（正如我所见，您正在尝试做这件事）。

我尝试使用纯 javascript（而不是 jQuery $ 和 attr 方法）重现您的问题，代码如下：

function customAddData(){
    var el = document.querySelector("#scheduler_here")
    el.dataset.projectStartDate = new Date()
}
scheduler.init("scheduler_here",new Date(2020,5,30),"week");

customAddData()  
var schedulerElement = document.querySelector("#scheduler_here")
var project_start_date = schedulerElement.dataset.projectStartDate;
console.log(project_start_date)

并且正确添加了data属性，下面是一个demo： http://snippet.dhtmlx.com/5/3fba66b31

顺便说一句，我可能会误解您到底应该做什么，但如果您只是不想在某个日期之前显示事件 - 您只需使用 Filter 功能即可： https://docs.dhtmlx.com/scheduler/filtering.html