Question

我正在尝试创建optgroup下拉列表，但我无法找出应该从服务器发送哪些数据以获得我想要的结果。

JobsSelected: {
    title: "Name",
    edit: true,
    create: true,
    list: false,
    inputClass: 'multiselect',
    options: function (data) {
        if (data.source == 'create') {
            data.clearCache();
            return '/Jobs/Options';
        }
    }
},

这是jtable代码，我调用服务器并从我的数据库中获取gruped作业，并希望在表单上显示它们。

[HttpPost]
public JsonResult Options()
{
    var data = jobs.GroupBy(x => x.Department)
                    .Select(g => new {
                        DisplayText = g.Key,
                        Value = g.Select(i => new
                        {
                            DisplayText = i.Name,
                            Value = i.Sifra
                        }).ToList()
                    }).ToList();

    return data;
}

这是来自服务器的分组数据。但它只是显示包含来自g.Key的值的列表，我需要将其设置为optgroup。我不知道这样可能吗？我怎样才能做到这一点？

Answer 1

尝试将您的值显示为jQuery的下拉列表的optgroup未实现jTable。您只能显示由DisplayText字段和Value组成的项目。

如果您想这样做，请尝试自定义jTable插件，因为它可以在GitHub上使用。这应该是_fillDropDownListWithOptions函数

Answer 2

严格修改jquery.jtable.js以支持OptGroup值。

    _fillDropDownListWithOptions: function ($select, options, value) {
        $select.empty();
        for (var i = 0; i < options.length; i++) {
            if (options[i].OptGroup) {
                $('<optgroup />').attr('label', options[i].DisplayText)
                    .appendTo($select);
            } else {
                $('<option' + (options[i].Value == value ? ' selected="selected"' : '') + '>' + options[i].DisplayText + '</option>')
                    .val(options[i].Value)
                    .appendTo($select);                
            }
        }
    },

注意似乎没有关于optgroup嵌套的规范，因此只支持平面选项。

jQuery jTable optgroup

2 个答案: