我是使用 Telerik 的新手,我目前正在研究ASP.Net Core Grid
所以我讓它作業了,但現在我想添加搜索欄工具列,所以我將它添加為:
@(Html.Kendo().Grid(Model)
.Name("grid")
.ToolBar(t => t.Search())
.Search(s =>
{
s.Field(o => o.PrimaryContact.FirstName, "contains");
})
問題是它PrimaryContact.FirstName可以為空,所以當我嘗試搜索某些東西時,它會引發一個控制臺錯誤:
未捕獲的型別錯誤:無法讀取 null 的屬性(讀取“名字”)
同樣的事情發生在列上,我解決它添加ClientTemplate為:
columns.Bound(x => x.PrimaryContact.FirstName)
.ClientTemplate("#= PrimaryContact ? PrimaryContact.FirstName : '' #")
但是搜索沒有客戶端模板來處理這個
我嘗試使用 jQuery 將字串空的 null 值更改為:
function onDataBound(e) {
for (let i = 0; i < rows.length; i )
{
const row = $(rows[i]);
const dt = e.sender.dataItem(row);
const firstName = dt.get("PrimaryContact.FirstName");
if (firstName === null)
{
row[0].cells[2].innerHTML = "";
}
}
}
但它不起作用。
如何避免搜索中的空值?問候
全碼:
@(Html.Kendo().Grid(Model)
.Name("grid")
.ToolBar(t =>
{
t.Excel();
t.Pdf();
t.Search();
})
.DataSource(dataSource => dataSource
.Custom()
.PageSize(20)
.Schema(schema =>
{
schema.Data(x => "function(d) { return validateData(d); }");
})
)
.Pageable(pager => pager
.Numeric(true)
.Info(true)
.PreviousNext(true)
.PageSizes(new [] { 10 ,25 ,50 })
.Position(GridPagerPosition.Bottom)
.Messages(m =>
{
m.ItemsPerPage("entries");
m.Display("Showing {0} - {1} of {2} entries");
})
)
.Sortable()
.Search(s =>
{
s.Field(o => o.Name, "contains");
s.Field(o => o.PrimaryContact.FirstName, "contains");
s.Field(o => o.PrimaryContact.PhoneNumber, "contains");
s.Field(o => o.PrimaryContact.EmailAddress, "contains");
s.Field(o => o.IsActive, "contains");
})
.Events(events => events.DataBound("onDataBound"))
.Columns(columns =>
{
columns.Bound(x => x.AdvertiserId)
.Hidden();
columns.Bound(x => x.Name)
.Title("Advertiser Name");
columns.Bound(x => x.PrimaryContact.FirstName)
.ClientTemplate("#= PrimaryContact ? PrimaryContact.FirstName : '' #")
.Title("Contact Name");
columns.Bound(x => x.PrimaryContact.PhoneNumber)
.ClientTemplate("#= PrimaryContact ? PrimaryContact.PhoneNumber : '' #")
.Title("Contact Phone");
columns.Bound(x => x.PrimaryContact.EmailAddress)
.ClientTemplate("#= PrimaryContact ? PrimaryContact.EmailAddress : '' #")
.Title("Contact Email");
columns.Bound(x => x.IsActive)
.Title("Status")
.ClientTemplate("<span class='badgeTemplate'></span>")
.Sortable(false);
columns.Template("<div class='btn-group'></div>")
.Title("").Width(100);
})
)
<script type="text/javascript">
function validateData(data)
{
for (const item of data) {
if (!item.hasOwnProperty("PrimaryContact")) {
item["PrimaryContact.FirstName"] = { "FirstName": ""};
}
}
return data;
}
</script>
我也嘗試過使用BeforeEdit event
.Events(events => events.DataBound("onDataBound").BeforeEdit("onBeforeEdit")
function onBeforeEdit(e) {
if(e.model.isNew()){
e.PrimaryContact.FirstName = "";
}
}
但它也不起作用
uj5u.com熱心網友回復:
盡可能避免使用嵌套屬性。您應該有一個自定義 ViewModel 來展平所有內容(無論您的Model類是什么)。其次,asp.net API 的功能不如原生 javascript 庫。無論如何,這只是在頁面上生成 javascript 的一種傳遞方式,因此如果需要,請不要害怕添加 javascript。
你試圖做的事情是不可能的。您可以構建一個適當的平面 ViewModel,或者您可以在將資料加載到網格之前攔截資料并進行變異。您可以使用schema資料源上的屬性來執行此操作。您將定義一個自定義 javascript 方法。
還有一件事,我認為您的問題不是FirstName缺少,而是PrimaryContact為空。您可以輕松地修復此服務器端。但這是客戶端修復它的方法,例如,如果您從第 3 方 API 獲取此問題。
.DataSource(ds =>
{
ds
.Custom()
.Transport(t =>
{
// ...
})
.Schema(x => .Data(x => "function(d) { return validateData(d); }"))
// ...
;
})
或者,如果您只使用 javascript 定義
dataSource: {
// ...
schema: { data: validateData }
}
然后這是使用您需要修復的任何屬性來清理模型的 javascript 方法:
function validateData(data)
{
for (const item of data) {
if (!item.hasOwnProperty("PrimaryContact")) {
item["PrimaryContact"] = { "FirstName": ""};
}
}
return data;
}
完整的道場示例在這里
轉載請註明出處,本文鏈接:https://www.uj5u.com/shujuku/523532.html
標籤:C#asp.net-mvc泰利里克剑道网格剑道-asp.net-mvc
下一篇:無法從文本框中獲取更新的值
