MForm.js 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384
  1. /*
  2. 外部方法
  3. getResult(verify, separator, isAlert, onlyModified, keepAllData )
  4. 返回:如果不校验或者通过了校验返回表单上的数据,如果不能通过校验返回null
  5. 参数:
  6. verify 是否校验,
  7. separator 多值域的分割符,
  8. isAlert 如果verify为true则是否提醒用户校验未通过,
  9. onlyModified只获取修改过的结果,
  10. keepAllData获取所有MDOMItem对象的值并保留未生成对象的data
  11. getItem( name )
  12. 根据name返回MDOMItem对象
  13. verify(isAlert)
  14. 校验用户是否已经填写了必填对象
  15. */
  16. MWF.xDesktop.requireApp("Template", "MDomItem", null, false);
  17. var MForm = new Class({
  18. Extends: MWF.widget.Common,
  19. Implements: [Options, Events],
  20. options : {
  21. style : "default",
  22. isNew : false,
  23. isEdited : false,
  24. emptyItemContainer : true,
  25. showNotEmptyFlag : false,
  26. //batch,所有item的错误都校验,每个item所有错误一起校验,错误显示在Item的字段后或指定区域;
  27. //batchSingle, 所有item的错误都校验,每个item只校验一个错误,错误显示在Item的字段后或指定区域;
  28. //alert,验证时遇到一个不成功的Item用app.notice()弹出消息后中断,
  29. //single,验证时遇到一个不成功的Item在字段后面或指定区域显示错误信息后中断
  30. verifyType : "alert",
  31. itemTemplateUrl : "",
  32. containerHtml : null,
  33. itemTemplate : null,
  34. hasColon : false
  35. },
  36. initialize: function (container, data, options , app, css ) {
  37. this.setOptions(options);
  38. this.path = "/x_component_Template/$MForm/";
  39. this.cssPath = "/x_component_Template/$MForm/"+this.options.style+"/css.wcss";
  40. this._loadCss();
  41. if( css ){
  42. this.css = Object.merge( this.css, css )
  43. }
  44. this.app = app;
  45. this.container = $(container);
  46. this.data = data;
  47. this.isSourceDataEmpty = false;
  48. if( !this.data || this.data == "" ){
  49. this.isSourceDataEmpty = true;
  50. this.data = [{}];
  51. }
  52. this.itemTemplateUrl = this.options.itemTemplateUrl;
  53. this.itemTemplate = this.options.itemTemplate;
  54. this.items = null;
  55. this.labelContainers = null;
  56. this.itemContainers = null;
  57. this.valSeparator = /,|;|\^\^|\|/g; //如果是多值对象,作为用户选择的多个值的分隔符
  58. },
  59. load: function () {
  60. this.fireEvent("queryLoad");
  61. this.loadTemplate( function(){
  62. //如果itemTemplate没有name赋值Key
  63. for( var it in this.itemTemplate ){
  64. if( !this.itemTemplate[it]["name"] ){
  65. this.itemTemplate[it]["name"] = it;
  66. }
  67. this.itemTemplate[it]["key"] = it;
  68. }
  69. //如果itemTemplate没有name和Key不一致,那么根据name赋值itemTemplate
  70. var json = {};
  71. for( var it in this.itemTemplate ){
  72. if( it != this.itemTemplate[it]["name"] ){
  73. json[ this.itemTemplate[it]["name"] ] = this.itemTemplate[it];
  74. }
  75. }
  76. for( var it in json ){
  77. this.itemTemplate[it] = json[it];
  78. }
  79. this.items = {};
  80. this.itemsByKey = {};
  81. if( this.options.containerHtml ){
  82. this.container.set("html",this.options.containerHtml);
  83. }
  84. this.labelContainers = this.container.getElements("[lable]");
  85. this.itemContainers = this.container.getElements("[item]");
  86. this.formatStyles();
  87. (this.options.isEdited || this.options.isNew) ? this.loadEdit() : this.loadRead();
  88. this.fireEvent("postLoad");
  89. }.bind(this) )
  90. },
  91. formatStyles: function(){
  92. this.container.getElements("[styles]").each(function(el){
  93. var styles = el.get("styles");
  94. if( styles && this.css[styles] ){
  95. el.setStyles( this.css[styles] )
  96. }
  97. }.bind(this));
  98. this.container.getElements("[class]").each(function(el){
  99. var className = el.get("class");
  100. if( className && this.css[className] ){
  101. el.setStyles( this.css[className] )
  102. }
  103. }.bind(this))
  104. },
  105. loadTemplate : function( callback ){
  106. if ( !this.itemTemplate && this.itemTemplateUrl) {
  107. MWF.getJSON(this.itemTemplateUrl, function(json){
  108. this.itemTemplate = json;
  109. if( callback )callback();
  110. }.bind(this));
  111. }else{
  112. if( callback )callback();
  113. }
  114. },
  115. loadEdit : function() {
  116. if (this.options.isNew) {
  117. this.formatEdit(this.itemTemplate, true);
  118. } else if (!this.isSourceDataEmpty) {
  119. if (typeOf(this.data) != "array") {
  120. this.data = [this.data]
  121. }
  122. for (var i = 0; i < this.data.length; i++) {
  123. var d = this.data[i];
  124. var items = this.itemTemplate;
  125. for (var it in d ) {
  126. if (items[it]) {
  127. items[it].value = d[it];
  128. }
  129. }
  130. this.formatEdit(items, false);
  131. }
  132. for (var it in this.itemTemplate ) {
  133. this.itemTemplate[it].value = "";
  134. }
  135. } else {
  136. this.formatEdit(this.itemTemplate, true);
  137. }
  138. },
  139. loadRead : function() {
  140. if (this.options.isNew) {
  141. this.formatRead(this.itemTemplate);
  142. } else if (!this.isSourceDataEmpty) {
  143. if ( typeOf(this.data) != "array") {
  144. this.data = [this.data]
  145. }
  146. for (var i = 0; i < this.data.length; i++) {
  147. var d = this.data[i];
  148. var items = this.itemTemplate;
  149. for (var it in d ) {
  150. if (items[it]) {
  151. items[it].value = d[it];
  152. }
  153. }
  154. this.formatRead(items);
  155. }
  156. for (var it in this.itemTemplate ) {
  157. this.itemTemplate[it].value = "";
  158. }
  159. }
  160. },
  161. //formatRead : function(itemData) {
  162. // var self = this;
  163. //
  164. // this.labelContainers.each(function( el ) {
  165. // var obj = itemData[el.get("lable")];
  166. // if (!obj)
  167. // return;
  168. // el.set("text",obj.text);
  169. // });
  170. //
  171. // this.itemContainers.each(function( el ) {
  172. // var obj = itemData[el.get("item")];
  173. // if (!obj)
  174. // return;
  175. //
  176. // if( obj.style ){
  177. // el.setStyles( obj.style )
  178. // }
  179. //
  180. // if( typeOf( obj.value ) == "function" ) {
  181. // var value = obj.value();
  182. // }else if( typeOf( obj.value ) == "boolean" ){
  183. // var value = obj.value.toString();
  184. // }else{
  185. // var value = (obj.value ? obj.value : "").toString();
  186. // }
  187. // if( obj.type == "hidden" ) {
  188. // el.hide();
  189. // el.set("html",value.replace( this.valSeparator, ",").replace(/\n/g,"<br/>") )
  190. // }else if( obj.type == "radio" || obj.type == "select" || obj.type == "checkbox" || obj.type == "multiselect" ) {
  191. // var values = value.split( this.valSeparator );
  192. // if( obj.selectText && obj.selectValue ){
  193. // var selectValues = this._getSelectOpt( obj.selectValue );
  194. // var selectTexts = this._getSelectOpt( obj.selectText );
  195. // var result = [];
  196. // for( i=0;i<selectValues.length;i++){
  197. // if( values.contains( selectValues[i] ) ){
  198. // result.push( selectTexts[i] )
  199. // }
  200. // }
  201. // el.set("html",result.join(","));
  202. // }else{
  203. // el.set("html",value.replace( this.valSeparator, ",").replace(/\n/g,"<br/>") )
  204. // }
  205. // }else if( obj.type == "rtf"){
  206. // el.set("html",value )
  207. // } else {
  208. // el.set("html",value.replace( this.valSeparator, ",").replace(/\n/g,"<br/>") )
  209. // }
  210. // }.bind(this))
  211. //},
  212. formatRead : function(itemData) {
  213. var self = this;
  214. this.labelContainers.each(function( el ) {
  215. var obj = itemData[el.get("lable")];
  216. if (!obj)
  217. return;
  218. el.set("text",obj.text + (self.options.hasColon ? ":" : "") );
  219. });
  220. this.itemContainers.each(function( el ) {
  221. var obj = itemData[el.get("item")];
  222. if (!obj)
  223. return;
  224. if (self.options.emptyItemContainer) {
  225. el.set("html","");
  226. }
  227. obj.isEdited = false;
  228. self.loadItem(obj, el);
  229. })
  230. },
  231. _getSelectOpt: function( option ){
  232. var opt = option;
  233. if( typeOf( opt ) == "function" ){
  234. opt = opt.call();
  235. }
  236. return typeOf( opt ) == "array" ? opt : opt.split( this.valSeparator );
  237. },
  238. formatEdit : function(itemData, isNew, unid) {
  239. var self = this;
  240. this.labelContainers.each(function( el ) {
  241. var obj = itemData[el.get("lable")];
  242. if (!obj)
  243. return;
  244. var text = obj.text + (self.options.hasColon ? ":" : "");
  245. if (self.options.showNotEmptyFlag && obj.notEmpty) {
  246. el.set("html", text + "<span style='color:red;'>*</span>")
  247. } else {
  248. el.set("text",text);
  249. }
  250. });
  251. this.itemContainers.each(function( el ) {
  252. var obj = itemData[el.get("item")];
  253. if (!obj)
  254. return;
  255. if (self.options.emptyItemContainer) {
  256. el.set("html","");
  257. }
  258. self.loadItem(obj, el);
  259. })
  260. },
  261. loadItem : function(template, container) {
  262. //if( template.disable )return;
  263. template.objectId = template.name;
  264. var item = new MDomItem(container, template, this, this.app, this.css );
  265. if( this.options.verifyType == "batchSingle" ){
  266. item.options.warningType = "single";
  267. }else{
  268. item.options.warningType = this.options.verifyType;
  269. }
  270. //item.parent = this;
  271. item.load();
  272. this.items[template.objectId] = item;
  273. this.itemsByKey[template.key] = item;
  274. },
  275. enableItem: function( itemName ){
  276. if( itemName && this.items[itemName] ){
  277. var item = this.items[itemName];
  278. if( item.options.disable ){
  279. item.enable();
  280. }
  281. }
  282. },
  283. disableItem: function( itemName ){
  284. if( itemName && this.items[itemName] ){
  285. var item = this.items[itemName];
  286. if( !item.options.disable ){
  287. item.disable();
  288. }
  289. }
  290. },
  291. verify : function(isShowWarming) {
  292. var flag = true;
  293. for (var it in this.items ) {
  294. if (!this.items[it].verify(isShowWarming)) {
  295. if (this.options.verifyType == "batch" || this.options.verifyType == "batchSingle") {
  296. flag = false;
  297. } else {
  298. return false;
  299. }
  300. }
  301. }
  302. return flag;
  303. },
  304. getItemsKeyValue : function(separator , onlyModified ) {
  305. //separator 多值合并分隔符
  306. var key_value = {};
  307. for (var it in this.items ) {
  308. var item = this.items[it];
  309. var value = onlyModified ? item.getModifiedValue() : item.getValue();
  310. if( value != null ){
  311. if (typeOf(value) === "array") {
  312. key_value[item.options.objectId] = ( typeOf(separator) == "string" ? value.join(separator) : value );
  313. } else {
  314. key_value[item.options.objectId] = value;
  315. }
  316. }
  317. }
  318. return key_value;
  319. },
  320. getResult : function(verify, separator, isShowWarming, onlyModified, keepAllData ) {
  321. if ( !verify || this.verify(isShowWarming)) {
  322. if( keepAllData ){
  323. var result = this.data[0];
  324. var keyValue = this.getItemsKeyValue(separator, onlyModified);
  325. for( var key in keyValue ){
  326. result[ key ] = keyValue[ key ];
  327. }
  328. return result;
  329. }else{
  330. return this.getItemsKeyValue(separator, onlyModified);
  331. }
  332. } else {
  333. return false;
  334. }
  335. },
  336. getItem : function( name ){
  337. return this.items[name] || this.itemsByKey[name];
  338. },
  339. clearWarning: function( type ){
  340. for (var it in this.items ) {
  341. var item = this.items[it];
  342. if( !type ){
  343. item.clearWarning( "empty" );
  344. item.clearWarning( "invalid" );
  345. }else{
  346. item.clearWarning( type )
  347. }
  348. }
  349. },
  350. reset: function(){
  351. for (var it in this.items ) {
  352. var item = this.items[it];
  353. item.reset();
  354. }
  355. },
  356. destroy : function(){
  357. Object.each(this.items, function(item){
  358. item.destroy();
  359. }.bind(this));
  360. this.container.empty();
  361. MWF.release(this);
  362. }
  363. });