Kendo ui 如何更改剑道MVC网格&x27;编辑命令模板?
我正在为ASP.NET MVC使用剑道UI。我有编辑命令的网格。编辑命令的默认外观是“button”,我想将其更改为link。但是命令没有Template()方法。那么如何将“编辑命令”按钮更改为“链接”Kendo ui 如何更改剑道MVC网格&x27;编辑命令模板?,kendo-ui,kendo-grid,kendo-asp.net-mvc,Kendo Ui,Kendo Grid,Kendo Asp.net Mvc,我正在为ASP.NET MVC使用剑道UI。我有编辑命令的网格。编辑命令的默认外观是“button”,我想将其更改为link。但是命令没有Template()方法。那么如何将“编辑命令”按钮更改为“链接” @(Html.Kendo().Grid<UI.Models.GridVM>() .Name("Grid") .Columns(columns => { columns.Bound(p => p.C
@(Html.Kendo().Grid<UI.Models.GridVM>()
.Name("Grid")
.Columns(columns =>
{
columns.Bound(p => p.CampaignID)
columns.Bound(p => p.CampaignStatus);
columns.Command(command => command.Edit().Text("Edit Me")); // How do i change this to link??
})
.Editable(editable => editable
.Mode(GridEditMode.PopUp)
.TemplateName("CampaignEdit")
.Window(w =>
{
w.Width(400);
w.Title("Edit Details");
}))
.Filterable()
.Pageable()
.Navigatable()
.Sortable()
.DataSource(dataSource => dataSource
.Ajax()
.ServerOperation(false)
.PageSize(20)
.Model(model => model.Id(p => p.CampaignID))
.Read(read => read.Action("GetCampaigns", "Home"))
.Update(update => update.Action("UpdateCampaign", "Home"))
)
)
Telerik可以根据定义创建自己的自定义命令。但是我的网格被配置为使用GridEditMode.Popup
,它与内置的编辑命令配合使用非常好。若我创建自定义命令,那个么我想我必须连接弹出窗口和其他所有东西
我只是想把“按钮”改成链接
@(Html.Kendo().Grid())
.名称(“网格”)
.列(列=>
{
columns.Bound(p=>p.campaiid)
columns.Bound(p=>p.status);
columns.Command(Command=>Command.Edit().Text(“编辑我”);//如何将其更改为链接??
})
.可编辑(可编辑=>可编辑
.Mode(GridEditMode.PopUp)
.TemplateName(“活动编辑”)
.Window(w=>
{
w、 宽度(400);
w、 标题(“编辑详情”);
}))
.可过滤()
.Pageable()
.Navigatable()
.Sortable()
.DataSource(DataSource=>DataSource
.Ajax()
.ServerOperation(错误)
.页面大小(20)
.Model(Model=>Model.Id(p=>p.Id))
.Read(Read=>Read.Action(“GetCampaigns”、“Home”))
.Update(Update=>Update.Action(“updatecompaign”、“Home”))
)
)
更新1@史蒂夫·格林,谢谢。您的方法在主网格上确实有效。但我也有子细节网格,它有编辑链接。这种方法不适用于细节网格。剑道抛出错误。
我认为我们必须转义模板表达式,以便在子/细节上下文中进行计算。但是我不确定语法是什么
@(Html.Kendo().Grid<UI.Models.GridVM>()
.Name("Grid")
.Columns(columns =>
{
columns.Bound(p => p.CampaignID)
columns.Bound(p => p.CampaignStatus);
columns.Template(@<text></text>)
.ClientTemplate(@"<a class=""k-grid-edit"" href=""\#"">Edit Master</a>");
//Worked in master grid
})
.Editable(editable => editable
.Mode(GridEditMode.PopUp)
.TemplateName("CampaignEdit")
.Window(w =>
{
w.Width(400);
w.Title("Edit Details");
}))
.Filterable()
.Pageable()
.Navigatable()
.Sortable()
.DataSource(dataSource => dataSource
.Ajax()
.ServerOperation(false)
.PageSize(20)
.Model(model => model.Id(p => p.CampaignID))
.Read(read => read.Action("GetCampaigns", "Home"))
.Update(update => update.Action("UpdateCampaign", "Home"))
)
.ClientDetailTemplateId("detailtemplate")
)
<script id="detailtemplate" type="text/kendo-tmpl">
@(Html.Kendo().Grid<UI.Models.DetailGridVM>()
.Name("detailgrid_#=CampaignID#")
.Columns(columns =>
{
columns.Bound(o => o.CampaignDetailID);
columns.Bound(o => o.Notes);
columns.Bound(o => o.CreatedBy);
columns.Template(@<text></text>)
.ClientTemplate(@"<a class=""k-grid-edit"" href=""\#"">Edit Detail</a>");
// Does not work in detail grid
})
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(5)
.Read(read => read.Action("GetCampaignDetails", "Home", new { campaignID = "#=CampaignID#" }))
.Update(update => update.Action("UpdateCampaignDetails", "Home"))
.Model(model => model.Id(m => m.CampaignDetailID))
)
.Pageable()
.Sortable()
.ToClientTemplate())
</script>
@(Html.Kendo().Grid())
.名称(“网格”)
.列(列=>
{
columns.Bound(p=>p.campaiid)
columns.Bound(p=>p.status);
columns.Template(@)
.ClientTemplate(@“”);
//在主网格中工作
})
.可编辑(可编辑=>可编辑
.Mode(GridEditMode.PopUp)
.TemplateName(“活动编辑”)
.Window(w=>
{
w、 宽度(400);
w、 标题(“编辑详情”);
}))
.可过滤()
.Pageable()
.Navigatable()
.Sortable()
.DataSource(DataSource=>DataSource
.Ajax()
.ServerOperation(错误)
.页面大小(20)
.Model(Model=>Model.Id(p=>p.Id))
.Read(Read=>Read.Action(“GetCampaigns”、“Home”))
.Update(Update=>Update.Action(“updatecompaign”、“Home”))
)
.ClientDetailTemplateId(“detailtemplate”)
)
@(Html.Kendo().Grid())
.Name(“detailgrid_35;=活动ID#”)
.列(列=>
{
columns.Bound(o=>o.campativedetailid);
columns.Bound(o=>o.Notes);
columns.Bound(o=>o.CreatedBy);
columns.Template(@)
.ClientTemplate(@“”);
//在详细信息网格中不起作用
})
.DataSource(DataSource=>DataSource
.Ajax()
.页面大小(5)
.Read(Read=>Read.Action(“GetCampaignDetails”,“Home”,new{campaignID=“#=campaignID#“}))
.Update(Update=>Update.Action(“updateCompaignDetails”,“Home”))
.Model(Model=>Model.Id(m=>m.activitydetailid))
)
.Pageable()
.Sortable()
.ToClientTemplate())
例如,您可以仅使用css
执行此操作:
td[role=gridcell] > a.k-button.k-button-icontext.k-grid-edit :hover {
cursor: pointer;
}
td[role=gridcell] > a.k-button.k-button-icontext.k-grid-edit {
-webkit-box-shadow: none !important;
box-shadow: none !important;
background: transparent;
border: none;
}
使用包含k-grid-edit类的列模板(使用k-grid-delete进行销毁):
.Columns(Columns=>
{
columns.Bound(p=>p.campaiid)
columns.Bound(p=>p.status);
columns.Template(@).ClientTemplate(@“”).Width(30);
columns.Template(@).ClientTemplate(@“”).Width(30);
})
或对于较小的按钮和引导:
column.Template(@<text></text>).ClientTemplate(@"<a class=""btn btn-info btn-xs k-grid-edit"" href=""\#"">Edit</a>").Width(30);
column.Template(@<text></text>).ClientTemplate(@"<a class=""btn btn-danger btn-xs k-grid-delete"" href=""\#"">Delete</a>").Width(30);
column.Template(@).ClientTemplate(@“”).Width(30);
列.Template(@).ClientTemplate(@“”).Width(30);
不确定这将如何处理嵌套。可能需要检查渲染的内容或使用此技术:找到它。为了更改detailgrid模板,我必须使用escape chracters.ClientTemplate(@“”)代码>您知道当点击按钮时网格如何更改文本或更好地更改图标吗?谢谢。使用jquery尝试编辑事件@火星-o你只是想展示其他领域之一吗?您可以添加一个etc。哈希语法将起作用:.ClientTemplate(@“#=MyField#”)
column.Template(@<text></text>).ClientTemplate(@"<a class=""btn btn-info btn-xs k-grid-edit"" href=""\#"">Edit</a>").Width(30);
column.Template(@<text></text>).ClientTemplate(@"<a class=""btn btn-danger btn-xs k-grid-delete"" href=""\#"">Delete</a>").Width(30);