Kendo UI Grid 摺疊明細裡面再一個Grid 的抓法 | How to get Kendo UI Grid with children detail's grid

markdown

#背景
同事在寫的應用:一個GRID裡面有子GRID
資料在展開master row時才會去抓
但不知道怎麼抓

#解法
我第一個想法是在master grid展開前先記住外面row的uid，
再用uid反推index，再用index去抓到row，再抓到裡面的grid，但很麻煩；

他研究很久後發現在master grid 的detailInit事件做detail grid宣告，
detail grid裡的databound事件
可以用
```
$(this.element[0]).data("kendoGrid"); ```
來抓到裡面的grid，簡單明瞭

Kendo UI Grid Filter DatePicker 過濾時分秒 | Kendo UI Grid Filter DatePicker truncate time

markdown

#背景
當grid使用server端做分頁排序篩選時，查詢的邏輯就是靠`ToDataSourceResult`來控制，
所以改不了內容在幹嘛，
當前端Grid需要篩選某日期欄位，該欄位又有時分秒，且使用者不想設定秒數時，
預設的時間篩選欄位只會傳入年月日到後端，時分秒為零，
但這樣在做小於等於或者等於的查詢時就會遇到時分秒不相同而查不到資料的問題，
如果是自己做api，這種小地方可以調整用`System.Data.Entity.DbFunctions.TruncateTime()`來過濾時間，但用Telerik的類別處理時就不行了，

後來查到官方的解法如連結
https://docs.telerik.com/kendo-ui/controls/data-management/grid/how-to/filtering/filter-by-date
大致上就是說要在filter menu初始化時，複寫套用的按鈕的事件，
例如原本設"等於"條件時，只會傳入一個邏輯就是相等一個日期時間值，
我們要調整為兩個邏輯，
用大於等於當天的零點零分零秒與 小於等於當天的23點59分59秒兩個條件傳入後端，
這樣就可以避免對不上時間的問題了

```
filterMenuInit: function (e) { //當日期條件設定為小於/等於時 只會傳入年月日 不會傳入時分秒 //但這樣會撈不到當天0點之後的資料 所以要幫他加到23:59:59來方便處理 //(因為沒辦法調整語法為trunc time) var menu = $(e.container); if (e.field === "ColumnDateTime") { var firstDropDown = $('[data-bind="value: filters[0].operator"]').data('kendoDropDownList'); menu.find('button[type="submit"]').click(function (ev) { if (firstDropDown.value() === 'eq') { ev.preventDefault(); var selectedDate = menu.find('[data-role="datepicker"]').first().data('kendoDatePicker').value(); if (!selectedDate) { $(ev.target).closest('[data-role="popup"]').data('kendoPopup').close(); return; } var startOfFilterDate = new Date(selectedDate.getFullYear(), selectedDate.getMonth(), selectedDate.getDate()); var endOfFilterDate = new Date(selectedDate.getFullYear(), selectedDate.getMonth(), selectedDate.getDate(), 23, 59, 59); var filter = { logic: "and", filters: [ { field: "ColumnDateTime", operator: "gte", value: startOfFilterDate }, { field: "ColumnDateTime", operator: "lte", value: endOfFilterDate } ] }; e.sender.dataSource.filter(filter); $(ev.target).closest('[data-role="popup"]').data('kendoPopup').close(); return; } else if (firstDropDown.value() === 'le') { ev.preventDefault(); var selectedDate = menu.find('[data-role="datepicker"]').first().data('kendoDatePicker').value(); if (!selectedDate) { $(ev.target).closest('[data-role="popup"]').data('kendoPopup').close(); return; } var endOfFilterDate = new Date(selectedDate.getFullYear(), selectedDate.getMonth(), selectedDate.getDate(), 23, 59, 59); var filter = { logic: "and", filters: [ { field: "ColumnDateTime", operator: "lte", value: endOfFilterDate } ] }; e.sender.dataSource.filter(filter); $(ev.target).closest('[data-role="popup"]').data('kendoPopup').close(); return; } }); } }, ```

Kendo ui Combobox 在 blur 時觸發change 事件 | Kendo ui Combobox blur trigger change event

同事遇到的BUG，
在Kendo ui Combobox選完值，blur時會觸發change事件，
經過實驗(還有我一直google)同時發現，
如果在text field使用number類型欄位，就會這樣，
而且官方好像沒有要改的意思

ref: https://github.com/telerik/kendo-angular/issues/1137

Telerik 舊版本安裝包下載方式 | How to get old version Telerik install package

Telerik 舊版本安裝包下載方式
1.登入官網
2.右上頭像選單→Account OverView

3.Downloads

4.選擇你的安裝框架
5.Version下拉選單切換版本

6.選取Installation安裝檔下載即可