外键列在编辑模式下禁用，但在添加模式下可编辑答案

【问题标题】：Foreign key column disabled in edit mode but editable in add mode外键列在编辑模式下禁用，但在添加模式下可编辑
【发布时间】：2026-02-12 01:55:02
【问题描述】：

我有一个看起来像这样的剑道网格：

 @(Html.Kendo().Grid<UserHolidayRightDto>()
.Name("gridHoliday")
.ToolBar(tool=>tool.Create())
.Columns(columns =>
{
columns.Bound(p => p.Date).Format("{0:MM/dd/yyyy}").Title("Date added");
columns.Bound(p => p.ValidForYear).Title("For year");
columns.ForeignKey(p => p.RightTypeId,  
System.Collections.IEnumerable)     
 @Model.HolidayRightsView, "Id", "Name").Title("Right type").HtmlAttributes(new   
{@Id="HolidayRightsDropDown"});
columns.Bound(p => p.Days).Title("Days");
columns.Bound(p => p.Comment).Title("Comment");
columns.Command(command => { command.Edit(); command.Destroy(); }).Width(172);
}) 
.Scrollable(s=>s.Height(200)) 
.Editable(editable => editable.Mode(GridEditMode.InLine))
.Events(e=>e.Edit("edit"))
.Events(e=>e.DataBound("onDataBound"))
.DataSource(dataSource => dataSource
.Ajax() 
.Model(model =>
{
model.Id(p => p.Id);
model.Field(p => p.ValidForYear).Editable(false).DefaultValue(@DateTime.Now.Year);
model.Field(p => p.Date).Editable(false); 
}) 
.Events(e=>e.RequestEnd("UpdateWindow")) 
.Read(read=>read.Action("ReadData","HolidayRights",new {id=@Model.Employee.PersonID}))
.Create(update => update.Action("EditingInline_Create", "HolidayRights",new    
{personId=@Model.Employee.PersonID})) 
.Update(update => update.Action("EditingInline_Update", "HolidayRights"))
.Destroy(update => update.Action("EditingInline_Destroy", "HolidayRights"))
 ))

我想让我的外键列在创建模式下可编辑并在编辑模式下禁用。我试过像这样的解决方案： $("#HolidayRightsDropDown").attr("readonly", true);

或 var d = document.getElementById("HolidayRightsDropDown"); d.disabled = true;

或 closecell() - 但此函数仅适用于单元格编辑但没有成功。

有什么建议吗？

【问题讨论】：

标签： kendo-ui kendo-grid

【解决方案1】：

Id 属性只会应用于列元素 (td)，而不是下拉菜单的实际输入。为您的网格编辑功能尝试下面的代码

function gridEdit(e) {
    if (!e.model.isNew()) {
        var input = $("input[name='RightTypeId_input']");
        input.prop('disabled', true);
        input.addClass("readonly"); // add custom css class to make it looks 'disabled' 
        // avoid clicking on Kendo spans
        input.next('span.k-select').unbind("click");
    }
}

css

input.readonly
{
-webkit-touch-callout:none;
-webkit-user-select:none;
-khtml-user-select:none;
-moz-user-select:none;
-ms-user-select:none;
-o-user-select:none;
background-color:#E6E6E6 !important;
}

【讨论】：