jquery-edit-in-place передает динамически параметр

Question

Я использую плагин jquery: https://code.google.com/archive/p/jquery-in-place-editor/. В следующем разделе я использую "JEIP" вместо полного имени.

Я пытаюсь привязать JEIP не к идентификатору, а ко многим объектам по классу CSS.

<div class="jeip" id='key1' data-type='elephant'>Text 1</div>
<div class="jeip" id='key2' data-type='mouse'>Text 2</div>

Теперь я тоже хочу передать элемент типа данных динамически. Я понял, что параметр "params" позволяет передавать дополнительные данные. Но это, кажется, не динамично.

Для инициализации JEIP я использую:

    $(".editInPlace").editInPlace({
            url: "http://submitUrl/",
            params: "datatype="+$(this).data('type'),
            callback: function(){   
                 console.log( $(this).data('type') );
            },                
     }

Но параметры неверны. Я получаю unifiend только в сценариях сервера, которые получают действие отправки. Когда я использую функцию обратного вызова, я могу получить консольный вывод с правильными данными. Как передать данные-элементы на Сервер?

Спасибо за помощь.

Answer 1

Предполагая, что все элементы находятся на месте во время выполнения сценария (т.е. они не добавляются динамически в какой-то более поздний момент), вы можете просто зациклить элементы и вызвать подключаемую функцию editInPlace с соответствующими значениями:

$('.editInPlace').each(function(i, el){
    var $el = $(el); // cache the jQuery object corresponding to the current element
    var dataType = $el.data('type');

    // call the editInPlace plugin directly on the element
    $el.editInPlace({
        url      : 'http://submitUrl/',
        params   : 'datatype=' + dataType,
        callback : function(){   
            console.log(dataType);
        }
    });
});