jqGrid顯示用於行內編輯的“編輯”圖標

Question

我正在使用帶有內聯編輯選項的jqGrid。 如果單元格沒有任何值，我想顯示一個編輯圖標。

所以我寫了一個格式化程序：

 function aFormatter(cellvalue, options, row) {
        if(cellvalue == null){          
              return 'you can edit this';
        }else{
            return cellvalue;
        }
 }

將顯示you can edit this文本，當我單擊它時正確顯示了一個輸入框，但是作為初始值的輸入框you can edit this ？

我該如何解決？

---

我正在通過struts 2 jquery tags plugin使用jqGrid，它是基於jqGrid版本構建的

Answer 1

我認為您應該與格式化程序一起定義unformatter（ unformat ）。 例如，

formatter: function (cellvalue) {
   if (cellvalue == null) {          
      return "<span class='ui-icon ui-icon-pencil'></span>";
   } else {
      return cellvalue;
   };
},
unformat: function (cellValue, options, elem) {
    return $(elem).text();
}

我不確定如何在struts2網格插件中指定unformat 。

另一種方法是通過以下方式定義格式化程序

(function ($) {
    "use strict";
    /*jslint unparam: true */
    $.extend($.fn.fmatter, {
        yourFormatterName: function (cellValue, options) {
            if (cellvalue == null) {          
                return "<span class='ui-icon ui-icon-pencil'></span>";
            } else {
                return cellvalue;
            };
        }
    });

    $.extend($.fn.fmatter.yourFormatterName, {
        unformat: function (cellValue, options, elem) {
            return $(elem).text();
        }
    });
}(jQuery));

它將允許您以與可以使用標准格式器 "integer" ， "date"等相同的方式來使用formatter: "yourFormatterName" （或在struts2中可能是formatter = "yourFormatterName" ）。

Answer 2

這將在網格中顯示一個“編輯”圖標，而不是“您可以編輯此”圖標

function aFormatter(cellvalue, options, row) {
   if(cellvalue == null) {          
      return '<span class="ui-icon ui-icon-pencil"></span>'
   } else {
      return cellvalue;
   }
}