C#多语言应用：下拉框统一德语样式与日期时间格式设置

我来帮你搞定这个多语言应用里的两个问题——让时长选择下拉框不管是英语还是德语环境都保持德语样式，同时设置正确的日期时间格式。下面分步骤给你说具体怎么做：

一、把下拉框样式统一成德语环境的样子 #

1. 强制Kendo下拉框用德语文化渲染 #

Kendo控件的部分渲染逻辑会跟着加载的文化走，所以咱们直接给下拉框指定de-DE文化，不管当前应用是什么语言，它都会按德语的规则来渲染：

假设你的时长下拉框是Grid里的一个列编辑器，先在Grid列定义里指定模板：

columns.Bound(p => p.Duration)
       .Title(Html.LabelFor(m => m.Duration).ToString())
       .Width(120)
       .EditorTemplateName("DurationDropDown") // 指定编辑器模板
       .ClientTemplate("#: getGermanDurationText(Duration) #"); // 前端显示用德语文本

然后在对应的编辑器模板（比如DurationDropDown.cshtml）里，初始化DropDownList时加上Culture("de-DE")：

@model int?

@(Html.Kendo().DropDownListFor(m => m)
    .Name("Duration")
    .Culture("de-DE") // 关键：强制用德语文化
    .DataTextField("Text")
    .DataValueField("Value")
    .BindTo(ViewBag.DurationOptions) // 绑定你的时长选项
    .HtmlAttributes(new { style = "width: 100%;" })
)

2. 用CSS强制覆盖样式（如果是样式差异） #

要是不同文化下Kendo默认的CSS样式不一样，咱们直接写自定义CSS把下拉框的样式固定成德语环境的样子：

/* 覆盖下拉框按钮的样式 */
.k-dropdown .k-dropdown-wrap .k-select {
    border-left: 1px solid #ccc;
    /* 把德语环境下这个元素的CSS属性都复制过来 */
}

/* 覆盖下拉菜单的样式 */
.k-dropdown .k-list-container {
    font-family: "Segoe UI", Arial, sans-serif;
    /* 其他德语环境下的样式属性 */
}

3. 固定下拉框的显示文本模板 #

如果下拉框的显示文本是从语言资源里取的，那咱们直接在前端写个函数，返回德语的文本：

function getGermanDurationText(duration) {
    // 这里可以直接写死德语选项，或者从后端传的德语选项里匹配
    const durationMap = {
        1: "1 Stunde",
        2: "2 Stunden",
        4: "4 Stunden",
        // 其他时长选项...
    };
    return durationMap[duration] || duration;
}

二、设置正确的日期时间格式 #

1. 让日期格式适配当前语言（或强制德语格式） #

如果要对应不同语言显示正确格式，就用Kendo的Format方法结合文化；要是想统一用德语格式，直接指定德语的格式字符串就行：

方式一：适配当前语言

columns.Bound(p => p.ActivationTime)
       .Title(Html.LabelFor(m => m.ActivationTime).ToString())
       .Width(160)
       .Format("{0:d}") // 用当前文化的短日期格式
       .ParseFormats(new string[] { "yyyy-MM-dd HH:mm:ss" }); // 解析后端传的日期格式

方式二：强制德语格式

columns.Bound(p => p.ActivationTime)
       .Title("Aktivierungszeit")
       .Width(160)
       .Format("{0:dd.MM.yyyy HH:mm}"); // 德语常用的日.月.年 时:分格式

2. 确保Kendo文化脚本加载正确 #

要让日期格式生效，别忘了在页面里加载德语的Kendo文化脚本，并且设置当前文化：

<script src="@Url.Content("~/Scripts/kendo.culture.de-DE.js")"></script>
<script>
    // 可以根据应用当前语言设置，或者直接强制设为德语
    kendo.culture("de-DE");
</script>

三、整合到你的Grid里的完整示例 #

把上面的代码整合到你现有的Grid中，大概是这样：

@(Html.Kendo().Grid<WorkTimesViewModel>(Model.WorkTimes)
    .Name("grid")
    .Columns(columns => {
        columns.Bound(p => p.Project)
               .Title(Html.LabelFor(m => m.Projekt).ToString())
               .Width(140)
               .ClientTemplate("#: Project.Name #");
        // 时长选择列
        columns.Bound(p => p.Duration)
               .Title(Html.LabelFor(m => m.Duration).ToString())
               .Width(120)
               .EditorTemplateName("DurationDropDown")
               .ClientTemplate("#: getGermanDurationText(Duration) #");
        // 日期时间列
        columns.Bound(p => p.ActivationTime)
               .Title(Html.LabelFor(m => m.ActivationTime).ToString())
               .Width(160)
               .Format("{0:dd.MM.yyyy HH:mm}");
        // 其他列继续你的原有定义...
    })
    .Editable(editable => editable.Mode(GridEditMode.InLine))
    .DataSource(dataSource => dataSource
        .Ajax()
        .Model(model => model.Id(p => p.Id))
        .Read(read => read.Action("GetWorkTimes", "Work"))
        .Update(update => update.Action("UpdateWorkTime", "Work"))
    )
)

<script>
    function getGermanDurationText(duration) {
        // 也可以从后端传的德语选项数组里匹配，更灵活
        const germanOptions = @Html.Raw(Json.Encode(ViewBag.GermanDurationOptions));
        const match = germanOptions.find(opt => opt.Value == duration);
        return match ? match.Text : duration;
    }

    // 强制设置Kendo文化为德语，保证控件和格式都正确
    kendo.culture("de-DE");
</script>

这样操作后，你的下拉框就会始终保持德语环境的样式，日期时间也会显示正确的格式啦～

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