API tools faq
paste
Advertisement
ptrawt

jquery.edatagrid2

ptrawt
Nov 1st, 2014
421
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
JavaScript 11.96 KB | None | 0 0
raw download clone embed print report
  1. /**
  2.  * edatagrid - jQuery EasyUI
  3.  *
  4.  * Licensed under the GPL:
  5.  *   http://www.gnu.org/licenses/gpl.txt
  6.  *
  7.  * Copyright 2011 stworthy [ stworthy@gmail.com ]
  8.  *
  9.  * Dependencies:
  10.  *   datagrid
  11.  *   messager
  12.  *
  13.  */
  14. (function($){
  15.     var currTarget;
  16.     $(function(){
  17.         $(document).unbind('.edatagrid').bind('mousedown.edatagrid', function(e){
  18.             var p = $(e.target).closest('div.datagrid-view,div.combo-panel');
  19.             if (p.length){
  20.                 if (p.hasClass('datagrid-view')){
  21.                     var dg = p.children('table');
  22.                     if (dg.length && currTarget != dg[0]){
  23.                         _save();
  24.                     }
  25.                 }
  26.                 return;
  27.             }
  28.             _save();
  29.            
  30.             function _save(){
  31.                 var dg = $(currTarget);
  32.                 if (dg.length){
  33.                     dg.edatagrid('saveRow');
  34.                     currTarget = undefined;
  35.                 }
  36.             }
  37.         });
  38.     });
  39.    
  40.     function buildGrid(target){
  41.         var opts = $.data(target, 'edatagrid').options;
  42.         $(target).datagrid($.extend({}, opts, {
  43.             onDblClickCell:function(index,field,value){
  44.                 if (opts.editing){
  45.                     $(this).edatagrid('editRow', index);
  46.                     focusEditor(field);
  47.                 }
  48.                 if (opts.onDblClickCell){
  49.                     opts.onDblClickCell.call(target, index, field, value);
  50.                 }
  51.             },
  52.             onClickCell:function(index,field,value){
  53.                 if (opts.editing && opts.editIndex >= 0){
  54.                     $(this).edatagrid('editRow', index);
  55.                     focusEditor(field);
  56.                 }
  57.                 if (opts.onClickCell){
  58.                     opts.onClickCell.call(target, index, field, value);
  59.                 }
  60.             },
  61.             onAfterEdit: function(index, row){
  62.                 opts.editIndex = -1;
  63.                 var url = row.isNewRecord ? opts.saveUrl : opts.updateUrl;
  64.                 if (url){
  65.                     $.post(url, row, function(data){
  66.                         if (data.isError){
  67.                             $(target).edatagrid('cancelRow',index);
  68.                             $(target).edatagrid('selectRow',index);
  69.                             $(target).edatagrid('editRow',index);
  70.                             opts.onError.call(target, index, data);
  71.                             return;
  72.                         }
  73.                         data.isNewRecord = null;
  74.                         $(target).datagrid('updateRow', {
  75.                             index: index,
  76.                             row: data
  77.                         });
  78.                         if (opts.tree){
  79.                             var idValue = row[opts.idField||'id'];
  80.                             var t = $(opts.tree);
  81.                             var node = t.tree('find', idValue);
  82.                             if (node){
  83.                                 node.text = row[opts.treeTextField];
  84.                                 t.tree('update', node);
  85.                             } else {
  86.                                 var pnode = t.tree('find', row[opts.treeParentField]);
  87.                                 t.tree('append', {
  88.                                     parent: (pnode ? pnode.target : null),
  89.                                     data: [{id:idValue,text:row[opts.treeTextField]}]
  90.                                 });
  91.                             }
  92.                         }
  93.                         opts.onSave.call(target, index, row);
  94.                     },'json');
  95.                 } else {
  96.                     opts.onSave.call(target, index, row);
  97.                 }
  98.                 if (opts.onAfterEdit) opts.onAfterEdit.call(target, index, row);
  99.             },
  100.             onCancelEdit: function(index, row){
  101.                 opts.editIndex = -1;
  102.                 if (row.isNewRecord) {
  103.                     $(this).datagrid('deleteRow', index);
  104.                 }
  105.                 if (opts.onCancelEdit) opts.onCancelEdit.call(target, index, row);
  106.             },
  107.             onBeforeLoad: function(param){
  108.                 if (opts.onBeforeLoad.call(target, param) == false){return false}
  109.                 // $(this).edatagrid('cancelRow');
  110.                 if (opts.tree){
  111.                     var node = $(opts.tree).tree('getSelected');
  112.                     param[opts.treeParentField] = node ? node.id : undefined;
  113.                 }
  114.             },
  115.             view: $.extend({}, opts.view, {
  116.                 onBeforeRender: function(target, rows){
  117.                     $(target).edatagrid('cancelRow');
  118.                     opts.view.onBeforeRender.call(this, target, rows);
  119.                 }
  120.             })
  121.         }));
  122.        
  123.        
  124.         function focusEditor(field){
  125.             var editor = $(target).datagrid('getEditor', {index:opts.editIndex,field:field});
  126.             if (editor){
  127.                 editor.target.focus();
  128.             } else {
  129.                 var editors = $(target).datagrid('getEditors', opts.editIndex);
  130.                 if (editors.length){
  131.                     editors[0].target.focus();
  132.                 }
  133.             }
  134.         }
  135.        
  136.         if (opts.tree){
  137.             $(opts.tree).tree({
  138.                 url: opts.treeUrl,
  139.                 onClick: function(node){
  140.                     $(target).datagrid('load');
  141.                 },
  142.                 onDrop: function(dest,source,point){
  143.                     var targetId = $(this).tree('getNode', dest).id;
  144.                     $.ajax({
  145.                         url: opts.treeDndUrl,
  146.                         type:'post',
  147.                         data:{
  148.                             id:source.id,
  149.                             targetId:targetId,
  150.                             point:point
  151.                         },
  152.                         dataType:'json',
  153.                         success:function(){
  154.                             $(target).datagrid('load');
  155.                         }
  156.                     });
  157.                 }
  158.             });
  159.         }
  160.     }
  161.    
  162.     $.fn.edatagrid = function(options, param){
  163.         if (typeof options == 'string'){
  164.             var method = $.fn.edatagrid.methods[options];
  165.             if (method){
  166.                 return method(this, param);
  167.             } else {
  168.                 return this.datagrid(options, param);
  169.             }
  170.         }
  171.        
  172.         options = options || {};
  173.         return this.each(function(){
  174.             var state = $.data(this, 'edatagrid');
  175.             if (state){
  176.                 $.extend(state.options, options);
  177.             } else {
  178.                 $.data(this, 'edatagrid', {
  179.                     options: $.extend({}, $.fn.edatagrid.defaults, $.fn.edatagrid.parseOptions(this), options)
  180.                 });
  181.             }
  182.             buildGrid(this);
  183.         });
  184.     };
  185.    
  186.     $.fn.edatagrid.parseOptions = function(target){
  187.         return $.extend({}, $.fn.datagrid.parseOptions(target), {
  188.         });
  189.     };
  190.    
  191.     $.fn.edatagrid.methods = {
  192.         options: function(jq){
  193.             var opts = $.data(jq[0], 'edatagrid').options;
  194.             return opts;
  195.         },
  196.         enableEditing: function(jq){
  197.             return jq.each(function(){
  198.                 var opts = $.data(this, 'edatagrid').options;
  199.                 opts.editing = true;
  200.             });
  201.         },
  202.         disableEditing: function(jq){
  203.             return jq.each(function(){
  204.                 var opts = $.data(this, 'edatagrid').options;
  205.                 opts.editing = false;
  206.             });
  207.         },
  208.         editRow: function(jq, index){
  209.             return jq.each(function(){
  210.                 var dg = $(this);
  211.                 var opts = $.data(this, 'edatagrid').options;
  212.                 var editIndex = opts.editIndex;
  213.                 if (editIndex != index){
  214.                     if (dg.datagrid('validateRow', editIndex)){
  215.                         if (editIndex>=0){
  216.                             if (opts.onBeforeSave.call(this, editIndex) == false) {
  217.                                 setTimeout(function(){
  218.                                     dg.datagrid('selectRow', editIndex);
  219.                                 },0);
  220.                                 return;
  221.                             }
  222.                         }
  223.                         dg.datagrid('endEdit', editIndex);
  224.                         dg.datagrid('beginEdit', index);
  225.                         opts.editIndex = index;
  226.                        
  227.                         if (currTarget != this && $(currTarget).length){
  228.                             $(currTarget).edatagrid('saveRow');
  229.                             currTarget = undefined;
  230.                         }
  231.                         if (opts.autoSave){
  232.                             currTarget = this;
  233.                         }
  234.                        
  235.                         var rows = dg.datagrid('getRows');
  236.                         opts.onEdit.call(this, index, rows[index]);
  237.                     } else {
  238.                         setTimeout(function(){
  239.                             dg.datagrid('selectRow', editIndex);
  240.                         }, 0);
  241.                     }
  242.                 }
  243.             });
  244.         },
  245.         addRow: function(jq, index){
  246.             return jq.each(function(){
  247.                 var dg = $(this);
  248.                 var opts = $.data(this, 'edatagrid').options;
  249.                 if (opts.editIndex >= 0){
  250.                     if (!dg.datagrid('validateRow', opts.editIndex)){
  251.                         dg.datagrid('selectRow', opts.editIndex);
  252.                         return;
  253.                     }
  254.                     if (opts.onBeforeSave.call(this, opts.editIndex) == false){
  255.                         setTimeout(function(){
  256.                             dg.datagrid('selectRow', opts.editIndex);
  257.                         },0);
  258.                         return;
  259.                     }
  260.                     dg.datagrid('endEdit', opts.editIndex);
  261.                 }
  262.                 var rows = dg.datagrid('getRows');
  263.                
  264.                 function _add(index, row){
  265.                     if (index == undefined){
  266.                         dg.datagrid('appendRow', row);
  267.                         opts.editIndex = rows.length - 1;
  268.                     } else {
  269.                         dg.datagrid('insertRow', {index:index,row:row});
  270.                         opts.editIndex = index;
  271.                     }
  272.                 }
  273.                 if (typeof index == 'object'){
  274.                     _add(index.index, $.extend(index.row, {isNewRecord:true}))
  275.                 } else {
  276.                     _add(index, {isNewRecord:true});
  277.                 }
  278.                
  279. //              if (index == undefined){
  280. //                  dg.datagrid('appendRow', {isNewRecord:true});
  281. //                  opts.editIndex = rows.length - 1;
  282. //              } else {
  283. //                  dg.datagrid('insertRow', {
  284. //                      index: index,
  285. //                      row: {isNewRecord:true}
  286. //                  });
  287. //                  opts.editIndex = index;
  288. //              }
  289.                
  290.                 dg.datagrid('beginEdit', opts.editIndex);
  291.                 dg.datagrid('selectRow', opts.editIndex);
  292.                
  293.                 if (opts.tree){
  294.                     var node = $(opts.tree).tree('getSelected');
  295.                     rows[opts.editIndex][opts.treeParentField] = (node ? node.id : 0);
  296.                 }
  297.                
  298.                 opts.onAdd.call(this, opts.editIndex, rows[opts.editIndex]);
  299.             });
  300.         },
  301.         saveRow: function(jq){
  302.             return jq.each(function(){
  303.                 var dg = $(this);
  304.                 var opts = $.data(this, 'edatagrid').options;
  305.                 if (opts.editIndex >= 0){
  306.                     if (opts.onBeforeSave.call(this, opts.editIndex) == false) {
  307.                         setTimeout(function(){
  308.                             dg.datagrid('selectRow', opts.editIndex);
  309.                         },0);
  310.                         return;
  311.                     }
  312.                     $(this).datagrid('endEdit', opts.editIndex);
  313.                 }
  314.             });
  315.         },
  316.         cancelRow: function(jq){
  317.             return jq.each(function(){
  318.                 var opts = $.data(this, 'edatagrid').options;
  319.                 if (opts.editIndex >= 0){
  320.                     $(this).datagrid('cancelEdit', opts.editIndex);
  321.                 }
  322.             });
  323.         },
  324.         destroyRow: function(jq, index){
  325.             return jq.each(function(){
  326.                 var dg = $(this);
  327.                 var opts = $.data(this, 'edatagrid').options;
  328.                
  329.                 var rows = [];
  330.                 if (index == undefined){
  331.                     rows = dg.datagrid('getSelections');
  332.                 } else {
  333.                     var rowIndexes = $.isArray(index) ? index : [index];
  334.                     for(var i=0; i<rowIndexes.length; i++){
  335.                         var row = opts.finder.getRow(this, rowIndexes[i]);
  336.                         if (row){
  337.                             rows.push(row);
  338.                         }
  339.                     }
  340.                 }
  341.                
  342.                 if (!rows.length){
  343.                     $.messager.show({
  344.                         title: opts.destroyMsg.norecord.title,
  345.                         msg: opts.destroyMsg.norecord.msg
  346.                     });
  347.                     return;
  348.                 }
  349.                
  350.                 $.messager.confirm(opts.destroyMsg.confirm.title,opts.destroyMsg.confirm.msg,function(r){
  351.                     if (r){
  352.                         for(var i=0; i<rows.length; i++){
  353.                             _del(rows[i]);
  354.                         }
  355.                         dg.datagrid('clearSelections');
  356.                     }
  357.                 });
  358.                
  359.                 function _del(row){
  360.                     var index = dg.datagrid('getRowIndex', row);
  361.                     if (index == -1){return}
  362.                     if (row.isNewRecord){
  363.                         dg.datagrid('cancelEdit', index);
  364.                     } else {
  365.                         if (opts.destroyUrl){
  366.                             var idValue = row.ID;
  367.                            
  368.                             //console.log(row.ID);
  369.                             $.post(opts.destroyUrl, {id:idValue}, function(data){
  370.                             //console.log(data);
  371.                                 var index = dg.datagrid('getRowIndex', idValue);
  372.                                 if (data.isError){
  373.                                     dg.datagrid('selectRow', index);
  374.                                     opts.onError.call(dg[0], index, data);
  375.                                     return;
  376.                                 }
  377.                                 if (opts.tree){
  378.                                     dg.datagrid('reload');
  379.                                     var t = $(opts.tree);
  380.                                     var node = t.tree('find', idValue);
  381.                                     if (node){
  382.                                         t.tree('remove', node.target);
  383.                                     }
  384.                                 } else {
  385.                                     dg.datagrid('cancelEdit', index);
  386.                                     dg.datagrid('deleteRow', index);
  387.                                 }
  388.                                 opts.onDestroy.call(dg[0], index, row);
  389.                                 var pager = dg.datagrid('getPager');
  390.                                 if (pager.length && !dg.datagrid('getRows').length){
  391.                                     dg.datagrid('options').pageNumber = pager.pagination('options').pageNumber;
  392.                                     dg.datagrid('reload');
  393.                                 }
  394.                             }, 'json');
  395.                         } else {
  396.                             dg.datagrid('cancelEdit', index);
  397.                             dg.datagrid('deleteRow', index);
  398.                             opts.onDestroy.call(dg[0], index, row);
  399.                         }
  400.                     }
  401.                 }
  402.             });
  403.         }
  404.     };
  405.    
  406.     $.fn.edatagrid.defaults = $.extend({}, $.fn.datagrid.defaults, {
  407.         singleSelect: true,
  408.         editing: true,
  409.         editIndex: -1,
  410.         destroyMsg:{
  411.             norecord:{
  412.                 title:'Warning',
  413.                 msg:'No record is selected.'
  414.             },
  415.             confirm:{
  416.                 title:'Confirm',
  417.                 msg:'Are you sure you want to delete?'
  418.             }
  419.         },
  420. //      destroyConfirmTitle: 'Confirm',
  421. //      destroyConfirmMsg: 'Are you sure you want to delete?',
  422.        
  423.         autoSave: false,    // auto save the editing row when click out of datagrid
  424.         url: null,  // return the datagrid data
  425.         saveUrl: null,  // return the added row
  426.         updateUrl: null,    // return the updated row
  427.         destroyUrl: null,   // return {success:true}
  428.        
  429.         tree: null,     // the tree selector
  430.         treeUrl: null,  // return tree data
  431.         treeDndUrl: null,   // to process the drag and drop operation, return {success:true}
  432.         treeTextField: 'name',
  433.         treeParentField: 'parentId',
  434.        
  435.         onAdd: function(index, row){},
  436.         onEdit: function(index, row){},
  437.         onBeforeSave: function(index){},
  438.         onSave: function(index, row){},
  439.         onDestroy: function(index, row){},
  440.         onError: function(index, row){}
  441.     });
  442.    
  443.     ////////////////////////////////
  444.     $.parser.plugins.push('edatagrid');
  445. })(jQuery);
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!