『To Do をガントチャートで表示する』のカスタマイズについて

kintone カスタマイズ
1

いつもカスタマイズの参考にさせて頂いております。

『To Do をガントチャートで表示する』

https://cybozudev.zendesk.com/hc/ja/articles/202640940-To-Do-%E3%82%92%E3%82%AC%E3%83%B3%E3%83%88%E3%83%81%E3%83%A3%E3%83%BC%E3%83%88%E3%81%A7%E8%A1%A8%E7%A4%BA%E3%81%99%E3%82%8B 

をベースにカスタマイズを行っておりますが、行き詰ってしまったのでご相談させて下さい。

 

ガントチャートをonclickで、当該レコードの詳細画面にジャンプしたいのですが、

どのように記載したらよいか全く分かりません。

お分かりになる方がいたら教えて頂ければ幸いです。

宜しくお願い致します。

2

鈴木 圭さん
cstapの瀧ヶ平です

 

上記リンクのコードの106行目に書かれている

var obj = {
id: escapeHtml(records[i]['$id']['value']),
name: escapeHtml(records[i]['To_Do']['value']),
values: [{
from: convertDateTime(records[i]['From']['value']),
to: convertDateTime(records[i]['To']['value']),
desc: descGantt,
label: escapeHtml(records[i]['To_Do']['value']),
customClass: escapeHtml(colorGantt)
}]
};

を

var obj = {
id: escapeHtml(records[i]['$id']['value']),
name: escapeHtml(records[i]['To_Do']['value']),
values: [{
from: convertDateTime(records[i]['From']['value']),
to: convertDateTime(records[i]['To']['value']),
desc: descGantt,
label: escapeHtml(records[i]['To_Do']['value']),
customClass: escapeHtml(colorGantt),
dataObj: records[i]
}]
};

と修正し、

121行目あたりに書かれている

$(elGantt).gantt({
source: data,
navigate: "scroll",
scale: "days", // days,weeks,months
maxScale: "months",
minScale: "days",
months: ganttMonths,
dow: ganttDow,
left: "70px",
itemsPerPage: 100,
waitText: ganttWaitmessage,
scrollToToday: true
});

の部分を

$(elGantt).gantt({
source: data,
navigate: "scroll",
scale: "days", // days,weeks,months
maxScale: "months",
minScale: "days",
months: ganttMonths,
dow: ganttDow,
left: "70px",
itemsPerPage: 100,
waitText: ganttWaitmessage,
scrollToToday: true,
onItemClick: function(data){
window.open(location.pathname + "show#record=" + data['$id'].value);
}
});

とすることで可能かと思います。

3

cstap 瀧ヶ平 様

いつも助けていただいてありがとうございます。

やりたいことが実現できました。

ついでにCSSにcursor:pointerを追加してそれらしくすることもできました。

ありがとうございました。