jEditable: отображать текст опции (а не значение) после отправки

Я использую jEditable в списке выбора. Работает прекрасно, за исключением следующего вопроса. jEditable отображает все, что сервер отправляет обратно после отправки. Это прекрасно работает для текстовых полей и т. Д., Где вы можете просто отправить отправленное значение обратно с сервера.

Однако в списках выбора это не имеет смысла, поскольку опубликованное значение является просто идентификатором элемента option. Если я отправлю это обратно, то мой текст изменится на Id, а не на дружественный текст, который был там раньше.

Как я могу отключить это поведение? Я не хочу снова извлекать текстовое значение, используя отправленный идентификатор из БД, просто чтобы отправить его обратно для отображения. Должен быть способ сохранить текст опции, а затем jEditable поместит его обратно в метку после отправки. Помогите?

Источник

6 ответов

Решение

Просто добавьте обратный вызов в редактируемый объект конфигурации, с помощью этого:

callback: function (value, settings) { 
      $(this).html(settings.data[value]);
 }
Источник

Почти готово. У меня были две проблемы с кодом Уильяма Ниу. Во-первых, вы не можете получить доступ к переменным данным таким образом, вместо этого используйте settings.data. Во-вторых, переменные данные - это не массив, а строка, поэтому data[value] не будет работать. Вот мой код, попробуйте это.

$(".editable").editable("yoursave.php", { 
    type   : 'select',
    data   : '{'E':'Letter E','F':'Letter F','G':'Letter G'}',
    callback: function(value, settings) {
        $(this).html(jQuery.parseJSON(settings.data)[value]);
    }
});
Источник

jEditable предоставляет различные функции обратного вызова для манипулирования данными. Это может зависеть от того, как вы получаете данные для заполнения select, Например, если у вас есть данные константной карты, вы можете легко найти значение по возвращенному ключу:

var data = {'E':'Letter E','F':'Letter F','G':'Letter G'};

$('#editable').editable('some url', {
    type: 'select',
    data: data,
    callback: function(value, settings) {
        $(this).html(data[value]);
    },
    submit: 'ok'
});

Пример: http://jsfiddle.net/william/mT4XV/

Источник 
return $(this).find('option:selected').text();

у меня в функции обратного вызова сработало:)

Источник

Функция обратного вызова в коде Хаммерса верна, но у меня были проблемы с анализом данных:

"JSON.parse: expected property name or '}' "

Данные должны соответствовать JSON, означает: данные: '{"E":"Letter E","F":"Letter F","G":"Letter G"}',

Так что правильный код

$(".editable").editable("yoursave.php", { 
    type   : 'select',
    data : '{"E":"Letter E","F":"Letter F","G":"Letter G"}',
    callback: function(value, settings) {
        $(this).html(jQuery.parseJSON(settings.data)[value]);
    }
});

Если у вас есть простой массив вместо ассоциативного массива, вы можете использовать обратный вызов Niu.

Источник

У меня была похожая проблема. Я использую почту, чтобы функционировать и loadurl.

Изменяя var str = settings.target.apply(self, [input.val(), settings]); в var str = settings.target.apply(self, [input.val(), settings, input]); У меня был контроль над элементом select в моей целевой функции

Источник
Другие вопросы по тегам