Textarea.js 8.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217
  1. MWF.xDesktop.requireApp("process.Xform", "$Input", null, false);
  2. /** @class Textarea 多行文本组件。
  3. * @example
  4. * //可以在脚本中获取该组件
  5. * //方法1:
  6. * var field = this.form.get("fieldId"); //获取组件对象
  7. * //方法2
  8. * var field = this.target; //在组件本身的脚本中获取,比如事件脚本、默认值脚本、校验脚本等等
  9. *
  10. * var data = field.getData(); //获取值
  11. * field.setData("字符串值"); //设置值
  12. * field.hide(); //隐藏字段
  13. * var id = field.json.id; //获取字段标识
  14. * var flag = field.isEmpty(); //字段是否为空
  15. * field.resetData(); //重置字段的值为默认值或置空
  16. * @extends MWF.xApplication.process.Xform.$Input
  17. * @category FormComponents
  18. * @hideconstructor
  19. */
  20. MWF.xApplication.process.Xform.Textarea = MWF.APPTextarea = new Class({
  21. Implements: [Events],
  22. Extends: MWF.APP$Input,
  23. _loadUserInterface: function(){
  24. this._loadNode();
  25. if (this.json.compute == "show"){
  26. this._setValue(this._computeValue());
  27. }else{
  28. this._loadValue();
  29. }
  30. },
  31. _loadNode: function(){
  32. if (this.readonly || this.json.isReadonly){
  33. this._loadNodeRead();
  34. }else{
  35. this._loadNodeEdit();
  36. }
  37. },
  38. _loadNodeRead: function(){
  39. this.node.empty();
  40. this.node.set({
  41. "nodeId": this.json.id,
  42. "MWFType": this.json.type
  43. });
  44. },
  45. _setValue: function(value){
  46. if (!value) value = "";
  47. var p = o2.promiseAll(value).then(function(v){
  48. if (o2.typeOf(v)=="array") v = v[0];
  49. this._setBusinessData(v);
  50. if (this.node.getFirst()) this.node.getFirst().set("value", v || "");
  51. if (this.readonly || this.json.isReadonly){
  52. var reg = new RegExp("\n","g");
  53. var reg2 = new RegExp("\u003c","g"); //尖括号转义,否则内容会截断
  54. var reg3 = new RegExp("\u003e","g");
  55. var text = value.replace(reg2,"&lt").replace(reg3,"&gt").replace(reg,"<br/>");
  56. this.node.set("html", text);
  57. }
  58. //this.__setValue(v);
  59. }.bind(this), function(){});
  60. this.moduleValueAG = p;
  61. p.then(function(){
  62. this.moduleValueAG = null;
  63. }.bind(this), function(){
  64. this.moduleValueAG = null;
  65. }.bind(this));
  66. // this.moduleValueAG = o2.AG.all(value).then(function(v){
  67. // this.moduleValueAG = null;
  68. // if (o2.typeOf(v)=="array") v = v[0];
  69. // this._setBusinessData(v);
  70. // if (this.node.getFirst()) this.node.getFirst().set("value", v || "");
  71. // if (this.readonly || this.json.isReadonly){
  72. // var reg = new RegExp("\n","g");
  73. // var reg2 = new RegExp("\u003c","g"); //尖括号转义,否则内容会截断
  74. // var reg3 = new RegExp("\u003e","g");
  75. // var text = value.replace(reg2,"&lt").replace(reg3,"&gt").replace(reg,"<br/>");
  76. // this.node.set("html", text);
  77. // }
  78. // }.bind(this));
  79. //
  80. // if (this.moduleValueAG) this.moduleValueAG.then(function(){
  81. // this.moduleValueAG = null;
  82. // }.bind(this));
  83. return value;
  84. // if (value && value.isAG){
  85. // this.moduleValueAG = value;
  86. // value.addResolve(function(v){
  87. // this._setValue(v);
  88. // }.bind(this));
  89. // }else{
  90. // this._setBusinessData(value);
  91. // if (this.node.getFirst()) this.node.getFirst().set("value", value || "");
  92. // if (this.readonly || this.json.isReadonly){
  93. // var reg = new RegExp("\n","g");
  94. // var reg2 = new RegExp("\u003c","g"); //尖括号转义,否则内容会截断
  95. // var reg3 = new RegExp("\u003e","g");
  96. // var text = value.replace(reg2,"&lt").replace(reg3,"&gt").replace(reg,"<br/>");
  97. // this.node.set("html", text);
  98. // }
  99. // return value;
  100. // }
  101. },
  102. // _setValue: function(value){
  103. // this._setBusinessData(value);
  104. // if (this.node.getFirst()) this.node.getFirst().set("value", value || "");
  105. // if (this.readonly || this.json.isReadonly){
  106. // var reg = new RegExp("\n","g");
  107. // var reg2 = new RegExp("\u003c","g"); //尖括号转义,否则内容会截断
  108. // var reg3 = new RegExp("\u003e","g");
  109. // var text = value.replace(reg2,"&lt").replace(reg3,"&gt").replace(reg,"<br/>");
  110. // this.node.set("html", text);
  111. // }
  112. // },
  113. _resetNodeEdit: function(){
  114. var input = new Element("textarea", {"styles": {
  115. "background": "transparent",
  116. "width": "100%",
  117. "border": "0px"
  118. }});
  119. var node = new Element("div", {"styles": {
  120. "ovwrflow": "hidden",
  121. "position": "relative",
  122. "padding-right": "2px"
  123. }}).inject(this.node, "after");
  124. input.inject(node);
  125. this.node.destroy();
  126. this.node = node;
  127. },
  128. _loadNodeEdit: function(){
  129. if (!this.json.preprocessing) this._resetNodeEdit();
  130. var input = this.node.getFirst();
  131. input.set(this.json.properties);
  132. if( this.form.json.textareaDisableResize )input.setStyle("resize","none");
  133. this.node.set({
  134. "id": this.json.id,
  135. "MWFType": this.json.type
  136. });
  137. this.node.addEvent("change", function(){
  138. this._setBusinessData(this.getInputData());
  139. }.bind(this));
  140. this.node.getFirst().addEvent("blur", function(){
  141. this.validation();
  142. }.bind(this));
  143. this.node.getFirst().addEvent("keyup", function(){
  144. this.validationMode();
  145. }.bind(this));
  146. },
  147. _afterLoaded: function(){
  148. if (!this.readonly){
  149. this.loadDescription();
  150. }
  151. },
  152. loadDescription: function(){
  153. if (this.readonly || this.json.isReadonly)return;
  154. var v = this._getBusinessData();
  155. if (!v){
  156. if (this.json.description){
  157. var size = this.node.getFirst().getSize();
  158. var w = size.x-3;
  159. if( this.json.showIcon!='no' && !this.form.json.hideModuleIcon ){
  160. w = size.x-23;
  161. }
  162. this.descriptionNode = new Element("div", {"styles": this.form.css.descriptionNode, "text": this.json.description}).inject(this.node);
  163. this.descriptionNode.setStyles({
  164. "width": ""+w+"px",
  165. "height": ""+size.y+"px",
  166. "line-height": ""+size.y+"px"
  167. });
  168. this.setDescriptionEvent();
  169. }
  170. }
  171. },
  172. setDescriptionEvent: function(){
  173. if (this.descriptionNode){
  174. if (COMMON.Browser.Platform.name==="ios"){
  175. this.descriptionNode.addEvents({
  176. "click": function(){
  177. this.descriptionNode.setStyle("display", "none");
  178. this.node.getFirst().focus();
  179. }.bind(this)
  180. });
  181. }else if (COMMON.Browser.Platform.name==="android"){
  182. this.descriptionNode.addEvents({
  183. "click": function(){
  184. this.descriptionNode.setStyle("display", "none");
  185. this.node.getFirst().focus();
  186. }.bind(this)
  187. });
  188. }else{
  189. this.descriptionNode.addEvents({
  190. "click": function(){
  191. this.descriptionNode.setStyle("display", "none");
  192. this.node.getFirst().focus();
  193. }.bind(this)
  194. });
  195. }
  196. this.node.getFirst().addEvents({
  197. "focus": function(){
  198. this.descriptionNode.setStyle("display", "none");
  199. }.bind(this),
  200. "blur": function(){
  201. if (!this.node.getFirst().get("value")) this.descriptionNode.setStyle("display", "block");
  202. }.bind(this)
  203. });
  204. }
  205. }
  206. });