实际效果： http://www.weiqihome.com/scotttable.jsp

 

本节介绍如何显示单元格，包括如何以text，checkbox，radio来显示单元格。

 

Render_base = Class.create();

Render_base.prototype = {
 initialize: function(grid) {
  this.grid = grid;
 },

 getRenderHTML: function(val) {}
}

Render_text = Class.create();

Object.extend(Object.extend(Render_text.prototype, Render_base.prototype), {
 getRenderHTML: function(val) {
  if (val == null || val == "") {
   return " ";
  }
  return val;
 }
});

Render_check = Class.create();

Object.extend(Object.extend(Render_check.prototype, Render_base.prototype), {
 getRenderHTML: function(val) {
  if (val == "") {
   val = "0";
  }
  if (val == "1" || val == "0") {
   return "<img src='"+this.grid.imgURL+"item_chk"+val+".gif'>";
  } else if (val == null) {
   return "&nbsp;";
  } else
   return val;
 }
});

Render_radio = Class.create();

Object.extend(Object.extend(Render_radio.prototype, Render_base.prototype), {
 getRenderHTML: function(val) {
  if (val == "") {
   val = "0";
  }
  if (val == "1" || val == "0") {
   return "<img src='"+this.grid.imgURL+"radio_chk"+val+".gif'>";
  } else if (val == null) {
   return "&nbsp;";
  } else
   return val;
 }
});

可见，只要实现不同的getRenderHTML就可以了。

可以很方便的扩展其他显示类，如price，color等。