custform.js 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404
  1. $(function() {
  2. var controlID = 0;
  3. $.fn.custform = {
  4. init : function() {
  5. this.tables = {};
  6. $('div[type=subtable]').each(
  7. function() {
  8. var table = $(this);
  9. //没有show类型的属于表内编辑模式
  10. var row = $(this).find('[formType=form]');
  11. //表单
  12. var form;
  13. //窗口编辑模式
  14. if(row.length > 0) {
  15. form = $(this).find('[formType=window]');
  16. }
  17. //页内编辑模式
  18. else {
  19. row = $(this).find('[formType=edit]');
  20. }
  21. table.data('row', $('<div></div>').append(row.clone()).html());
  22. row.css('display', 'none').html('');
  23. //窗口编辑模式
  24. if(form) {
  25. table.data('form', '<form>' + $('<div></div>').append(form.clone()).html() + '</form>');
  26. form.remove();
  27. }
  28. var tableName = $(this).attr('tableName');
  29. $.fn.custform.tables[tableName] = table;
  30. //子表的权限
  31. var canWrite = ($(this).attr('right') == 'w');
  32. var canRead = canWrite || ($(this).attr('right') == 'r');
  33. $(this).find('[formType="newrow"]').each(function() {
  34. $(this).find('[name^=s]:visible').each(function() {
  35. $(this).attr('name', $(this).attr('name') + ':' + controlID++);
  36. });
  37. if(canWrite) {
  38. $.fn.custform.addBind($(this), table);
  39. }
  40. });
  41. if(canWrite) {
  42. var menu = $.ligerMenu({
  43. top : 100,
  44. left : 100,
  45. width : 130,
  46. items : [
  47. {
  48. text : '添加',
  49. click : function() {
  50. $.fn.custform.add($(menu.target).closest('div[type=subtable]'));
  51. }
  52. }
  53. ]
  54. });
  55. $(this).find('[formType]:first').prev().bind("contextmenu", function(e) {
  56. menu.target = e.target;
  57. menu.show({
  58. top : e.pageY,
  59. left : e.pageX
  60. });
  61. return false;
  62. });
  63. }
  64. if(!canRead) {
  65. $(this).css('display', 'none');
  66. }
  67. });
  68. this.initUI();
  69. },
  70. initUI : function(parent) {
  71. var filter;
  72. if (!parent) {
  73. parent = $('body div[type=custform]');
  74. filter = 'input,textarea';
  75. } else {
  76. filter = 'input,textarea,.dicComboTree,.dicComboBox,.dicCombo';
  77. }
  78. $.metadata.setType("attr", "validate");
  79. parent.find(filter).each(function() {
  80. if ($(this).attr('ltype') == 'text') {
  81. $(this).ligerTextBox({
  82. width : $(this).width() - 2
  83. });
  84. } else if ($(this).attr('ltype') == 'number') {
  85. $(this).ligerSpinner({
  86. width : $(this).width() - 2
  87. });
  88. } else if ($(this).attr('ltype') == 'date') {
  89. $(this).ligerDateEditor({
  90. width : $(this).width() - 2
  91. });
  92. } else if ($(this).is('.dicComboTree,.dicComboBox,.dicCombo')) {
  93. $(this).htDicCombo();
  94. }
  95. });
  96. if (parent.is('form')) {
  97. parent.data('validate', this.getValidate(parent));
  98. } else {
  99. this.valid = this.getValidate(parent.closest('form'));
  100. }
  101. },
  102. add : function(table, beforeElement) {
  103. if (table.data('form')) {
  104. this.openWin('添加', $(table.data('form')), table, beforeElement, function(form, table, beforeElement) {
  105. var v = form.data('validate');
  106. if (!v.checkForm()) {
  107. v.showErrors();
  108. return false;
  109. } else {
  110. var record = {};
  111. var hidden = $('<div type="hidden"></div>');
  112. form.find('input[name], textarea[name]').each(function() {
  113. hidden.append($('<input type="hidden"/>').attr('name', $(this).attr('name')).val($(this).val()));
  114. record[$(this).attr('name')] = $(this).val();
  115. });
  116. var row = $(table.data('row'));
  117. row.append(hidden);
  118. row.find('[fieldName]').each(function() {
  119. var fieldName = $(this).attr('fieldName');
  120. var value = record[fieldName];
  121. if (!value)
  122. value = '';
  123. $(this).text(value);
  124. });
  125. $.fn.custform._add(table, row, beforeElement);
  126. v.showErrors();
  127. return true;
  128. }
  129. });
  130. } else {
  131. var row = $(table.data('row'));
  132. row.find('[name^=s]').each(function() {
  133. $(this).attr('name', $(this).attr('name') + ':' + controlID++);
  134. });
  135. this._add(table, row, beforeElement);
  136. }
  137. },
  138. _add : function(table, newRow, beforeElement) {
  139. if (beforeElement) {
  140. $(beforeElement).before(newRow);
  141. } else {
  142. table.find('[formType]:last').after(newRow);
  143. }
  144. this.initUI(newRow);
  145. this.addBind(newRow, table);
  146. },
  147. addBind: function(row, table) {
  148. //是否需要编辑按钮
  149. var needEdit = ($.fn.custform.tables[table.attr('tableName')].data('form') != null);
  150. var menu = $.fn.custform.getMenu(needEdit);
  151. row.bind("contextmenu", function(e) {
  152. menu.target = e.target;
  153. menu.show({
  154. top : e.pageY,
  155. left : e.pageX
  156. });
  157. return false;
  158. });
  159. },
  160. edit : function(table, row) {
  161. var tableName = table.attr('tableName');
  162. var form = $(this.tables[tableName].data('form'));
  163. form.find('[name]').each(function() {
  164. var value = row.find('[name="' + $(this).attr('name') + '"]').val();
  165. $(this).val(value);
  166. });
  167. form.data('row', row);
  168. this.openWin('编辑', form, table, null, function(form, table) {
  169. var v = form.data('validate');
  170. if (!v.checkForm()) {
  171. v.showErrors();
  172. } else {
  173. var record = {};
  174. var row = form.data('row');
  175. var hidden = row.find('div[type=hidden]').empty();
  176. form.find('input[name], textarea[name]').each(function() {
  177. hidden.append($('<input type="hidden"/>').attr('name', $(this).attr('name')).val($(this).val()));
  178. record[$(this).attr('name')] = $(this).val();
  179. });
  180. $(row).find('[fieldName]').each(function() {
  181. var fieldName = $(this).attr('fieldName' );
  182. var value = record[fieldName];
  183. if (!value)
  184. value = '';
  185. $(this).text(value);
  186. });
  187. v.showErrors();
  188. return true;
  189. }
  190. });
  191. },
  192. getValidate : function(target) {
  193. return target.validate({
  194. debug : false,
  195. errorPlacement : function(lable, element) {
  196. if(element.hasClass("l-text-field")) {
  197. element = element.parent();
  198. }
  199. element.addClass('validError');
  200. element.mouseover(function() {
  201. element.ligerTip({
  202. content : lable.html(),
  203. appendIdTo : lable
  204. });
  205. });
  206. element.mouseout(function() {
  207. lable.ligerHideTip();
  208. });
  209. lable.element = element;
  210. },
  211. success : function(lable) {
  212. lable.element.removeClass('validError');
  213. lable.element.unbind('mouseover');
  214. //lable.element.unbind('mouseout');
  215. lable.ligerHideTip();
  216. }
  217. /*,
  218. submitHandler : function() {
  219. $("form .l-text,.l-textarea").ligerHideTip();
  220. //$.fn.custform.submit();
  221. }
  222. */
  223. });
  224. },
  225. validate: function() {
  226. return this.valid.checkForm();
  227. },
  228. showError: function() {
  229. this.valid.showErrors();
  230. },
  231. /*
  232. submit : function() {
  233. $.post('../bpmFormHandler/save.ht', {
  234. data: this.getData()
  235. }, function(data) {
  236. alert(data);
  237. });
  238. },
  239. */
  240. getData: function() {
  241. // 主表数据
  242. var main = {
  243. tableId: $('#tableId').val(),
  244. tableName: $('#tableName').val(),
  245. fields:{}
  246. };
  247. $('input[name^=m], textarea[name^=m]').each(function() {
  248. var name = $(this).attr('name');
  249. main.fields[name.replace(/.*:/, '')] = $(this).val();
  250. });
  251. //子表数据
  252. var sub = [];
  253. $('div[type=subtable]').each(function() {
  254. var table = {
  255. tableName: $(this).attr('tableName'),
  256. fields: []
  257. };
  258. $(this).find('[formtype]:visible').each(function() {
  259. var row = {};
  260. $(this).find('input,textarea').each(function() {
  261. var name = $(this).attr('name').split(':')[2];
  262. row[name] = $(this).val();
  263. });
  264. table.fields.push(row);
  265. });
  266. sub.push(table);
  267. });
  268. //意见
  269. var opinion = [];
  270. $('textarea[name^=opinion]').each(function() {
  271. opinion.push({
  272. name: $(this).attr('name').split(':')[1],
  273. value: $(this).val()
  274. });
  275. });
  276. var data = {main: main, sub: sub, opinion: opinion};
  277. return JSON2.stringify(data);
  278. },
  279. openWin : function(title, form, table, beforeElement, callback) {
  280. form.data('beforeElement', beforeElement);
  281. var win = form.ligerWindow({
  282. width : 400,
  283. height : 300,
  284. left : ($(window).width() - 400) / 2,
  285. top : ($(window).height() - 300) / 2,
  286. title : title,
  287. showMax : true,
  288. onClose : true,
  289. showButton : true,
  290. buttons : [ {
  291. text : "确定",
  292. handler : function() {
  293. var result = callback(form, table, form.data('beforeElement'));
  294. if(result) {
  295. win.close();
  296. }
  297. }
  298. } ]
  299. });
  300. this.initUI(form);
  301. win.show();
  302. },
  303. getMenu : function(needEdit) {
  304. if ((needEdit && this.menuWithEdit) || (!needEdit && this.menu)) {
  305. return needEdit ? this.menuWithEdit : this.menu;
  306. } else {
  307. var menu;
  308. var items = [ {
  309. text : '在前面插入记录',
  310. click : function() {
  311. var row = $(menu.target).closest('[formType]');
  312. var table = row.closest('div[type=subtable]');
  313. $.fn.custform.add(table, row);
  314. }
  315. }, {
  316. text : '在后面插入记录',
  317. click : function() {
  318. var row = $(menu.target).closest('[formType]');
  319. var table = row.closest('div[type=subtable]');
  320. row = row.next('[formType]:visible');
  321. if (row.length == 0) {
  322. row = null;
  323. }
  324. $.fn.custform.add(table, row);
  325. }
  326. }, {
  327. line : true
  328. }, {
  329. text : '编辑',
  330. click : function() {
  331. var row = $(menu.target).closest('[formType]');
  332. var table = row.closest('div[type=subtable]');
  333. $.fn.custform.edit(table, row);
  334. }
  335. }, {
  336. text : '删除此记录',
  337. click : function() {
  338. var t = $(menu.target).closest('[formType]');
  339. t.remove();
  340. }
  341. }, {
  342. line : true
  343. }, {
  344. text : '向上移动',
  345. click : function() {
  346. var t = $(menu.target).closest('[formType]');
  347. var prev = t.prev('[formType]:visible');
  348. if (prev.length > 0) {
  349. prev.before(t);
  350. }
  351. }
  352. }, {
  353. text : '向下移动',
  354. click : function() {
  355. var t = $(menu.target).closest('[formType]');
  356. var next = t.next('[formType]:visible');
  357. if (next.length > 0) {
  358. next.after(t);
  359. }
  360. }
  361. } ];
  362. if (!needEdit) {
  363. items.splice(3, 1);
  364. }
  365. menu = $.ligerMenu({
  366. top : 100,
  367. left : 100,
  368. width : 130,
  369. items : items
  370. });
  371. if (needEdit) {
  372. this.menuWithEdit = menu;
  373. }
  374. else
  375. {
  376. this.menu = menu;
  377. }
  378. return menu;
  379. }
  380. }
  381. };
  382. $.fn.custform.init();
  383. });