Интеграция Jqgrid и jqxeditor

Question

Я пытаюсь интегрировать редактор jqx с jqgrid. Он отлично работает для части редактирования строки (оператор получения), но у меня все еще возникают проблемы для добавляемой части (оператор набора). Диалоговое окно появляется с редактором, но я не знаю, как получить данные из jqxeditor. Как реализовать функцию custom_value в этом случае (текстовое поле)? Спасибо!

$Notegrid.jqGrid({ 
     url: al.rooturl + suffix, 
     datatype: "json", 
     mtype: "POST", 
     loadonce: false, 
     altRows: false, 
     colNames: ["ID", "Note","Liée à","Actions"], 
     colModel: [ 
      { name: "id", index: "id", width: 80, align: "center",sorttype: "int" }, 
      { name: "text", index: "text",editable: true, edittype:"custom", editoptions:{ 
        custom_element:function(value, options) { 
         elm = $('<div id="'+options.id+'"></div>');       
         // give the editor time to initialize 
         setTimeout(function() { 
          elm.jqxEditor({ 
           tools: 'bold italic underline size', 
           width: '100%', 
           height: '100%' 
          }); 
          elm.val(value); 
          }, 100 
         ); 

         return elm; 
        }, 
        custom_value:function(element, oper, gridval) {  
         if(oper === 'set'){ 
          // how to set the data ? 
         }else{ 
          if(oper === 'get') { 
           return element.jqxEditor('val'); 
          } 
        } 

        }}, width: 500, formatter: formatText },... 

Answer 1

Я не знаю jqxEditor, но отладка ваших демо показывает, что редактирование работ, но сохраненный текст содержит двойной текст. Чтобы решить эту проблему, вы можете попробовать использовать

return element.jqxEditor('val')[0]; 

вместо

return element.jqxEditor('val'); 

См http://jsfiddle.net/OlegKi/nfo2aaj1/18/

ОБНОВЛЕНО: теперь лучше я понимаю вашу проблему. Прежде всего вы пытались использовать редактирование форм локальных данных, которые не поддерживаются из коробки в jqGrid 4.6. Он реализован в jqGrid, начиная с версии 4.7. Следующая проблема заключается в использовании div, созданного в custom_element для jqxEditor. Проблема заключается в следующем. Нужно создать элемент DOM и вернуть его (или обертка jQuery на нем, как и вы) с обратного вызова custom_element. jqGrid назначает id и name элементу. Поэтому назначение id в вашей реализации обратного вызова custom_element не требуется. Проблема, которая имеет в редактировании формы, jqxEditor, кажется, переписывает атрибуты. В качестве обходного пути я предлагаю создать дополнительные внешние<div> вместе с основным <div>, переадресованным на jqxEditor. Соответствующий код будет

custom_element: function (value, options) { 
    var elm = $("<div><div></div></div>");       
    // give the editor time to initialize 
    setTimeout(function() { 
     elm.children("div").jqxEditor({ 
      tools: 'bold italic underline size', 
      width: '100%', 
      height: '100px' 
     }); 
     elm.children("div").val(value); 
    }, 100); 

    return elm; 
}, 
custom_value: function (element, oper, gridval) { 
    if (oper === 'set') { 
     // how to set the data ? 
    } else { 
     if (oper === 'get') { 
      return element.children("div").jqxEditor('val'); 
     } 
    } 
} 

Соответствующая демонстрация http://jsfiddle.net/OlegKi/nfo2aaj1/23/, похоже, работает. Я использовал последнюю версию (4.9.2) бесплатного jqGrid в демо. Он поддерживает редактирование локальных данных. Демо демонстрирует как встроенное, так и редактируемое редактирование, и оба, кажется, работают без проблем.