查理布朗王_Blog

https://hackmd.io/s/rkITEOYX

在登入畫面，按住shift+點選重新啟動電腦，再點選排除疑難雜症，，之後即可進入點腦安全模式。

这个一般是返回的数据有问题，比如应该返回{data:[……]}而不是{tabledata:[……]}，或者数据为空因该返回{data:[]} 而不是{data:null}、{data:""}，dt识别不了所以报此错误 正确返回的数据格式为 {data:[{name:"datatables中文网",url:"datatables.club"}]}

http://datatables.club/faqs/

適用時機

• IEnumerable: 處理記憶體內的資料 ex. List / Array
• IQueryable: 處理遠端來源的資料 ex. Database / Service

https://dotblogs.com.tw/wasichris/archive/2015/03/04/150633.aspx

這篇想要達到的功能是用Mvc架構，搭配kendo的grid達到搜尋grid裡的資料功能。

需要做以下步驟

1. 把kendo的dll檔放入專案，在專案"參考"右鍵"加入參考"，加入"kendo.mvc.dll"

    2.在view的layout把kendo的kendo.aspnetmvc.min.js檔引用。

3.在controller加入搜尋功能get的action，加入[DataSourceRequest] DataSourceRequest request

程式如下

 public ActionResult GetUpFile([DataSourceRequest] DataSourceRequest request)
        {
            var data = _service.Get();
            return Json(data.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);

        }

4.在view前端，用<script>和加入一個<Input>和<button>

<form id="searchForm">
    <input type="text" id="txtDocumentName" class="k-textbox" />
    <button type="submit" class="k-button">Search</button>
</form>

<script>

 var txtDocumentName = document.getElementById("txtDocumentName");
            var searchForm = document.getElementById("searchForm");
            searchForm.onsubmit = function () {

              //.trim可以去除輸入值前後空白鍵
                var documentName = txtDocumentName.value.trim();
                var filter = {};    

               //判斷輸入textbox內是否是空值，如果是顯示全部，如果有值顯示搜尋資料
                if (documentName.length > 0) {
                    filter = { field: "DocumentName", operator: "contains", value: documentName };
                } else {
                    filter = {};
                }
                grid.dataSource.filter(filter);
                return false;

            };
        });

</script>

執行結果

grid畫面

搜尋完成後的grid畫面
 

參考資料:
http://docs.telerik.com/kendo-ui/api/javascript/data/datasource#configuration-filter.logic

http://docs.telerik.com/kendo-ui/api/javascript/data/datasource

http://docs.telerik.com/kendo-ui/api/javascript/ui/grid

https://www.w3schools.com/jsref/event_onsubmit.asp