Question

是否可以将headings添加到jEditable选择下拉菜单中？

我想在单个选择中为数据集添加标题。

这相当于OPTGROUP选择中的HTML。

如果可能的话？

如果是这样的话？

如果没有，我会开始延伸的任何想法允许这样做吗？

Answer 1

如果您使用jEditable的纯下载表单，则无法在select中实现选项分组。另一方面，jEditable不是一个如此复杂的java文件，你可能想尝试添加一个选项来插入OPTGROUP标签：

可能看起来像：

            $("#ddlGrouped").editable("url", {
            type: 'select',
            submit: 'OK',
            data: {
                   'Swedish Cars' : { 'volvo': 'Volvo', 'saab': 'Saab'},
                   'German Cars' : { 'mercedes': 'Mercedes', 'audi': 'Audi'}
                  }
        })

这是jEditable构建select的部分：

select: {
            element: function (settings, original) {
                var select = $('<select />');
                $(this).append(select);
                return (select);
            },
            content: function (data, settings, original) {
                /* If it is string assume it is json. */
                if (String == data.constructor) {
                    eval('var json = ' + data);
                } else {
                    /* Otherwise assume it is a hash already. */
                    var json = data;
                }
                for (var key in json) {
                    if (!json.hasOwnProperty(key)) {
                        continue;
                    }
                    if ('selected' == key) {
                        continue;
                    }
                    var option = $('<option />').val(key).append(json[key]);
                    $('select', this).append(option);
                }
                /* Loop option again to set selected. IE needed this... */
                $('select', this).children().each(function () {
                    if ($(this).val() == json['selected'] ||
                        $(this).text() == $.trim(original.revert)) {
                        $(this).attr('selected', 'selected');
                    }
                });
            }
        }

但是您还必须检查jEditable如何获取所选项目，并且也可以调整该代码。听起来很有趣，但目前我没有时间尝试并发布工作代码。

祝你好运。

Answer 2

根据拉斐尔的回答，我今晚创造了这个并让它为我的目的而努力。请注意我没有这么灵活，我只是为了我的目的而攻击它（2 OPTGROUP，总是相同的标题）。另外，我实际上并不知道如何在JS中编程（如您所见），所以这只是作为一个有效的解决方案发布的，当然不是最佳实践。

非常高兴人们也可以指出我的代码中的错误 - 只是发布在这里，以防其他人遇到同样的问题。

下面对jeditable的更新 - 对此的调用如Rafael的帖子所述（除了type是“selectactioner”。

        selectactioner: {
           element : function(settings, original) {
                var select = $('<select />');
                $(this).append(select);
                return(select);


            },
            content : function(data, settings, original) {

               var obj = jQuery.parseJSON(data);
               var json = obj.attendees;
               var json2 = obj.nonattendees;

                var optgroup = $('<optgroup />');
                optgroup.attr('label', 'Meeting Attendees');
                $('select', this).append(optgroup);

                for (var key in json) {
                    if (!json.hasOwnProperty(key)) {
                        continue;
                    }
                    if ('selected' == key) {
                        continue;
                    } 
                    var option = $('<option />').val(key).append(json[key]);
                    $('select', this).append(option);    
                }                    
                /* Loop option again to set selected. IE needed this... */ 
                $('select', this).children().each(function() {
                    if ($(this).val() == json['selected'] || 
                        $(this).text() == $.trim(original.revert)) {
                            $(this).attr('selected', 'selected');
                    }
                });




                var optgroup = $('<optgroup />');
                optgroup.attr('label', 'Other Users');
                $('select', this).append(optgroup);

                for (var key in json2) {
                    if (!json2.hasOwnProperty(key)) {
                        continue;
                    }
                    if ('selected' == key) {
                        continue;
                    } 
                    var option = $('<option />').val(key).append(json2[key]);
                    $('select', this).append(option);    
                }                    
                /* Loop option again to set selected. IE needed this... */ 
                $('select', this).children().each(function() {
                    if ($(this).val() == json2['selected'] || 
                        $(this).text() == $.trim(original.revert)) {
                            $(this).attr('selected', 'selected');
                    }
                });


            }
        }

是否可以将标题添加到jEditable选择下拉菜单中

2 个答案: