如何为Kendo ComboBox自定义带图标HTML Helper及空引用报错解决

问题原因 #

空引用异常触发的核心原因是：你调用方法时没有传入第三个参数htmlAttributes，该参数使用默认值null，而Kendo UI的HtmlAttributes()方法不支持传入null值，会直接触发空引用。
另外你方法的目标是生成Kendo ComboBox，但代码里错误调用了TextBoxFor()方法，虽然不是本次报错的直接原因，但会导致生成的控件不符合预期。

解决方案 #

按下面的步骤修改代码即可：

1. 预处理htmlAttributes参数，避免传入null #

在调用Kendo控件生成方法前，先判断htmlAttributes是否为null，为空的话赋值为空匿名对象，这是本次问题的核心修复点。

2. 替换为正确的ComboBoxFor方法 #

你要生成下拉框，需要把TextBoxFor改为ComboBoxFor，如果确实要生成文本框可以忽略这步。

3. 可选：用你传入的inputId参数给控件赋值id #

你当前方法定义了inputId参数但未使用，可以在HtmlAttributes里追加id配置，让参数生效。

4. 可选：优化图标布局 #

原代码中span的padding-left:40px会把图标推到输入框右侧外部，导致控件整体宽度异常，修改为绝对定位的方式可以让图标悬浮在输入框内部右侧，视觉效果更符合Kendo原生组件的设计风格。

修改后的完整代码示例 #

using Kendo.Mvc.UI;
using Microsoft.AspNetCore.Mvc.Rendering;
using System.Linq.Expressions;
using System.Text;
using Microsoft.AspNetCore.Routing;

public static IHtmlContent CpaKendoComboBoxFor<TModel, TProperty>(this IHtmlHelper<TModel> htmlHelper,
    Expression<Func<TModel, TProperty>> expression, string inputId, object htmlAttributes = null)
{
    var propertyId = string.Join("_", expression.Body.ToString().Split('.').Skip(1));
    StringBuilder result = new StringBuilder();

    // 处理htmlAttributes为null的情况，核心修复点
    htmlAttributes ??= new { };
    // 追加传入的inputId到属性中（可选）
    var attributeDict = new RouteValueDictionary(htmlAttributes)
    {
        ["id"] = inputId
    };

    // 替换为ComboBoxFor，传入处理后的属性字典
    result.Append(htmlHelper.Kendo().ComboBoxFor(expression)
        .HtmlAttributes(attributeDict)
        .ToHtmlString());

    var spanEditBtn = new TagBuilder("span");
    spanEditBtn.MergeAttribute("name", TagBuilder.CreateSanitizedId("btnEdit" + propertyId, ""));
    spanEditBtn.GenerateId("btnEdit" + propertyId, "");
    spanEditBtn.AddCssClass("k-icon k-edit-value k-i-edit");
    // 调整样式为绝对定位，图标悬浮在输入框右侧
    spanEditBtn.MergeAttribute("style", "position:absolute;right:8px;top:50%;transform:translateY(-50%);cursor:pointer;");
    spanEditBtn.MergeAttribute("role", "button");
    spanEditBtn.MergeAttribute("unselectable", "on");

    result.Append(spanEditBtn.ToHtmlString());

    // 外层加相对定位容器，保证图标定位正确
    return htmlHelper.Raw($"<div style='position:relative;display:inline-block;'>{result}</div>");
}

内容的提问来源于stack exchange，提问作者Amir Ranjbarian