Pergunta

Estou usando o excelente jeditable Plugin para uma edição no local na minha página. Há um local que preciso de um elemento de seleção múltiplo. Existe um plugin jedável que me permite fazer isso?

Eu tenho tentado usar o jeditable API do plugin do autor para criar meu próprio plug -in multisselecto, mas não há dados até agora. Parece que não há documentação suficiente sobre o que cada função faz na API. E todos os plug -in de exemplo que ele fornece parecem confiar em outros plugins jQuery. Eu só preciso de um elemento de seleção múltiplo básico ...

Foi útil?

Solução

Fiz um pequeno patch com a sugestão de Kalyan que o levou a não funcionar sem a opção "selecionada" opcional, e descrevi o atributo de tamanho. Então eu modifiquei para ser um plugin jedável, em vez de algo que você precisa colar no próprio jedável. No momento, estou usando isso em um site de clientes, embora eu o use exclusivamente preenchido por uma string json para que outros métodos ainda possam ser buggy.

$.editable.addInputType("multiselect", {
    element: function (settings, original) {
        var select = $('<select multiple="multiple" />');

        if (settings.width != 'none') { select.width(settings.width); }
        if (settings.size) { select.attr('size', settings.size); }

        $(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);
        }

        if ($(this).val() == json['selected'] ||
                            $(this).html() == $.trim(original.revert)) {
            $(this).attr('selected', 'selected');
        }

        /* Loop option again to set selected. IE needed this... */
        $('select', this).children().each(function () {
            if (json.selected) {
                var option = $(this);
                $.each(json.selected, function (index, value) {
                    if (option.val() == value) {
                        option.attr('selected', 'selected');
                    }
                });
            } else {
                if (original.revert.indexOf($(this).html()) != -1)
                    $(this).attr('selected', 'selected');
            }
        });
    }
});

Outras dicas

Eu tenho procurado o mesmo também. Tentando conseguir isso, mas nada parece funcionar.

A propósito, eu encontrei isso, mas isso também não funciona - http://pastebin.com/cbdndv5h

O plugin jedável faz isso. Exemplo:

$('.editable').editable('http://www.example.com/save.php', { 
 data   : " {'E':'Letter E','F':'Letter F','G':'Letter G', 'selected':'F'}",
 type   : 'select',
 submit : 'OK'
});
Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top