Pregunta

Estoy usando la excelente jEditable plug-in para algunos la edición in situ en mi página . Hay un punto en que necesito un elemento de selección múltiple. ¿Existe un plugin jEditable que me permite hacer esto?

He estado tratando de utilizar el jEditable API de plugins de autor para crear mi propia selección múltiple plug-in, pero no dados hasta ahora. No solo no parece ser suficiente documentación sobre lo que hace cada función en la API. Y cada plugin de ejemplo que ofrece parece basarse en otros plugins jQuery. Sólo necesito un elemento de selección múltiple básica ...

¿Fue útil?

Solución

Me hizo un pequeño parche a la sugerencia de Kalyan que provocó que no funcionara sin la opción "seleccionado" opcional y unhardcoded el atributo de tamaño. A continuación, he modificado para ser un plugin jEditable en lugar de algo que tienes que pegar en sí jEditable. Actualmente estoy usando esto en un sitio web del cliente, aunque lo uso poblado exclusivamente por una cadena JSON para que otros métodos pueden todavía tener errores.

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

Otros consejos

He estado buscando el mismo también. Tratando de lograr eso, pero nada parece funcionar.

Por cierto, he encontrado esto, pero esto no se parece al trabajo, ya sea - http://pastebin.com/cbDndv5h

El plugin jeditable hacer esto. Ejemplo:

$('.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 bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top