select2 显示第一个选项而不是占位符

Question

我的 .cshtml 中有这个

@Html.DropDownListFor(m => m.Attendance.Time02InId, new SelectList(Model.ClockingLocations, "Id", "Name"), new {@class = "form-control select2-allow-clear"})

Model.ClockingLocations = Clock 列表

public class Clock
{
    public int Id { get; set; }
    public string Name { get; set; }
}

这是我准备好的文档的 jquery

    var placeholder = "Select...";

    $(".select2-allow-clear").prepend("<option></option>");

    $(".select2-allow-clear").select2({
        allowClear: true,
        placeholder: placeholder,
        width: null
    });

但是，当m.Attendance.Time02InId 没有值时，我的选择列表仍然显示我的Model.ClockingLocations 的第一项，而不是我的占位符。

Answer 1

尝试更新您的 JQuery 代码

var placeholder = "Select...";

$(".select2-allow-clear").prepend("<option></option>");

$(".select2-allow-clear").select2({
    allowClear: true,
    placeholder: placeholder,
    width: null
});

与

var placeholder = "Select...";

$(".select2-allow-clear").prepend("<option value='' selected='selected'></option>");

$(".select2-allow-clear").select2({
    allowClear: true,
    placeholder: placeholder,
    width: null
});

你也可以尝试替换

$(".select2-allow-clear").prepend("<option></option>");

与

$(".select2-allow-clear").prepend("<option value=''></option>").val('');

希望对你有所帮助。