Combox.js 8.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257
  1. MWF.xDesktop.requireApp("process.Xform", "$Input", null, false);
  2. /** @class Combox 组合框组件。
  3. * @example
  4. * //可以在脚本中获取该组件
  5. * //方法1:
  6. * var field = this.form.get("fieldName"); //获取组件对象
  7. * //方法2
  8. * var field = this.target; //在组件本身的脚本中获取,比如事件脚本、默认值脚本、校验脚本等等
  9. * @extends MWF.xApplication.process.Xform.$Input
  10. * @category FormComponents
  11. * @hideconstructor
  12. */
  13. MWF.xApplication.process.Xform.Combox = MWF.APPCombox = new Class(
  14. /** @lends MWF.xApplication.process.Xform.Combox# */
  15. {
  16. Implements: [Events],
  17. Extends: MWF.APP$Input,
  18. iconStyle: "selectIcon",
  19. options: {
  20. "moduleEvents": ["load", "queryLoad", "postLoad", "commitInput", "change"]
  21. },
  22. initialize: function(node, json, form, options){
  23. this.node = $(node);
  24. this.node.store("module", this);
  25. this.json = json;
  26. this.form = form;
  27. this.field = true;
  28. },
  29. _loadNode: function(){
  30. if (this.readonly){
  31. this._loadNodeRead();
  32. }else{
  33. this._loadNodeEdit();
  34. }
  35. },
  36. _loadNodeRead: function(){
  37. this.node.empty();
  38. this.node.set({
  39. "nodeId": this.json.id,
  40. "MWFType": this.json.type
  41. });
  42. //new Element("select").inject(this.node);
  43. },
  44. _loadNodeEdit: function(){
  45. this.node.empty();
  46. MWF.require("MWF.widget.Combox", function(){
  47. this.combox = select = new MWF.widget.Combox({
  48. "onlySelect": this.json.onlySelect==="y",
  49. "count": this.json.count.toInt() || 0,
  50. "splitStr": this.json.splitStr || ",\\s*|;\\s*|,\\s*|;\\s*",
  51. "splitShow": this.json.splitShow || ", ",
  52. "list": this.getOptions(),
  53. "onCommitInput": function(item){
  54. this.fireEvent("commitInput");
  55. }.bind(this),
  56. "onChange": function(){
  57. this.fireEvent("change");
  58. }.bind(this),
  59. "optionsMethod": this._searchOptions()
  60. });
  61. }.bind(this), false);
  62. // var select = new Element("select");
  63. // select.set(this.json.properties);
  64. select.inject(this.node);
  65. //this.node.destroy();
  66. // this.areaNode = this.node;
  67. // this.node = select;
  68. this.node.set({
  69. "id": this.json.id,
  70. "MWFType": this.json.type
  71. });
  72. this.combox.addEvent("change", function(){
  73. this.validationMode();
  74. if (this.validation()) this._setBusinessData(this.getInputData("change"));
  75. }.bind(this));
  76. },
  77. _searchOptions: function(){
  78. if (this.json.itemType === "dynamic"){
  79. return function(value, callback){
  80. var event = {
  81. "value": value,
  82. "callback": callback
  83. };
  84. this.form.Macro.fire(((this.json.itemDynamic) ? this.json.itemDynamic.code : ""), this, event);
  85. }.bind(this);
  86. }else{
  87. return null;
  88. }
  89. },
  90. /**
  91. * @summary 获取选择项数组.
  92. * @example
  93. * var array = this.form.get('fieldName').getOptions();
  94. * @return {Array} 选择项数组,如果配置为脚本返回计算结果.
  95. */
  96. getOptions: function(){
  97. var list = [];
  98. if (this.json.itemType === "values"){
  99. list = this.json.itemValues;
  100. }else if (this.json.itemType === "script"){
  101. list = this.form.Macro.exec(((this.json.itemScript) ? this.json.itemScript.code : ""), this);
  102. }
  103. if (list.length){
  104. var options = [];
  105. list.each(function(v){
  106. if (typeOf(v)==="object"){
  107. options.push(v);
  108. }else{
  109. v = v.toString();
  110. arr = v.split("|");
  111. var o = { "text": "", "keyword": "", "value": "" };
  112. switch (arr.length){
  113. case 0: break;
  114. case 1:
  115. o.text = arr[0];
  116. o.keyword = arr[0];
  117. o.value = arr[0];
  118. break;
  119. case 2:
  120. o.text = arr[0];
  121. o.keyword = arr[0];
  122. o.value = arr[1];
  123. break;
  124. case 3:
  125. o.text = arr[0];
  126. o.keyword = arr[1];
  127. o.value = arr[2];
  128. break;
  129. default:
  130. o.text = arr[0];
  131. o.keyword = arr[1];
  132. o.value = arr[2];
  133. }
  134. options.push(o);
  135. }
  136. }.bind(this));
  137. return options;
  138. }
  139. return [];
  140. },
  141. /**
  142. * 当表单上没有对应组件的时候,可以使用this.data[fieldName] = data赋值。
  143. * @summary 为组件赋值。
  144. * @param value{String} .
  145. * @example
  146. * this.form.get("fieldName").setData("test"); //赋文本值
  147. * @example
  148. * //如果无法确定表单上是否有组件,需要判断
  149. * if( this.form.get('fieldName') ){ //判断表单是否有无对应组件
  150. * this.form.get('fieldName').setData( data );
  151. * }else{
  152. * this.data['fieldName'] = data;
  153. * }
  154. */
  155. setData: function(value){
  156. this._setBusinessData(value);
  157. this._setValue(value);
  158. },
  159. _setValue: function(value){
  160. if (!value) value = [];
  161. if (value.length==1 && (!value[0])) value = [];
  162. if (typeOf(value) !=="array") value = [value];
  163. if (this.combox){
  164. this.combox.clear();
  165. comboxValues = [];
  166. value.each(function(v){
  167. if (typeOf(v)==="object"){
  168. comboxValues.push({
  169. "text": v.text || v.title || v.subject || v.name,
  170. "value": v
  171. });
  172. }else{
  173. comboxValues.push(v.toString());
  174. }
  175. }.bind(this));
  176. this.combox.addNewValues(comboxValues);
  177. }else{
  178. value.each(function(v, i){
  179. var text = "";
  180. if (typeOf(v)==="object"){
  181. text = v.text || v.title || v.subject || v.name;
  182. }else{
  183. text = v.toString();
  184. }
  185. if (i<value.length-1) text += this.json.splitShow;
  186. new Element("div", {"styles": {
  187. "float": "left",
  188. "margin-right": "5px"
  189. },"text": text}).inject(this.node.getFirst() || this.node);
  190. }.bind(this));
  191. }
  192. },
  193. /**
  194. * @summary 重新计算下拉选项,该功能通常用在下拉选项为动态计算的情况.
  195. * @example
  196. * this.form.get('fieldName').resetOption();
  197. */
  198. resetOption: function(){
  199. if (this.combox){
  200. var list = this.getOptions();
  201. this.combox.setOptions({"list": list});
  202. }
  203. },
  204. /**
  205. * @summary 添加下拉选项.
  206. * @param text {String} 下拉选项文本
  207. * @param value {String} 下拉选项值
  208. * @example
  209. * this.form.get('fieldName').addOption("秘密","level1");
  210. */
  211. addOption: function(text, value){
  212. if (this.combox){
  213. var list = this.getOptions();
  214. list.push({
  215. "text": text,
  216. "value": value
  217. });
  218. this.combox.setOptions({"list": list});
  219. }
  220. },
  221. isEmpty : function(){
  222. var data = this.getData();
  223. if( typeOf(data) === "array" ){
  224. return data.length === 0;
  225. }else{
  226. return !data;
  227. }
  228. },
  229. getInputData: function(){
  230. if (this.combox) return this.combox.getData();
  231. return this._getBusinessData();
  232. },
  233. /**
  234. * @summary 获取选中的值和文本.
  235. * @example
  236. * var array = this.form.get('fieldName').getTextData();
  237. * @return {Object} 返回选中项值和文本,格式为 { 'value' : value, 'text' : text }.
  238. */
  239. getTextData: function(){
  240. var v = this.getData();
  241. return {"value": v, "text": v};
  242. //return this.node.get("text");
  243. },
  244. resetData: function(){
  245. this.setData(this.getValue());
  246. }
  247. });