1) Edit cellEditing function, in some cases grid object is undefined.

2) Modify SubNodeCollectionControl, so that user can pass custom backgrid row.
3) Handling of visible parameter in SubNodeCollectionControl.
4) Customise title and delete message for Delete Cell.
5) Added Backgrid.Extension.Select2DepCell and moved Backgrid.Extension.StringDepCell from user management to backgrid.pgadmin.js.
This commit is contained in:
Akshay Joshi 2017-06-29 19:01:29 +05:30
parent 7389744ecf
commit c98b64fd82
3 changed files with 84 additions and 46 deletions

View File

@ -1023,16 +1023,16 @@
var collection = this.model.get(data.name);
var cellEditing = function(args){
var self = this,
var cellEditing = function(args) {
var that = this,
cell = args[0];
// Search for any other rows which are open.
this.each(function(m){
// Check if row which we are about to close is not current row.
if (cell.model != m) {
var idx = self.indexOf(m);
var idx = that.indexOf(m);
if (idx > -1) {
var row = grid.body.rows[idx],
var row = self.grid.body.rows[idx],
editCell = row.$el.find(".subnode-edit-in-process").parent();
// Only close row if it's open.
if (editCell.length > 0){
@ -1054,7 +1054,7 @@
});
// Render subNode grid
subNodeGrid = grid.render().$el;
subNodeGrid = self.grid.render().$el;
// Combine Edit and Delete Cell
if (data.canDelete && data.canEdit) {
@ -1072,7 +1072,7 @@
data.canAddRow.apply(self, [self.model]) : true;
if (canAddRow) {
// Close any existing expanded row before adding new one.
_.each(grid.body.rows, function(row){
_.each(self.grid.body.rows, function(row){
var editCell = row.$el.find(".subnode-edit-in-process").parent();
// Only close row if it's open.
if (editCell.length > 0){
@ -1101,7 +1101,7 @@
}
}
$(grid.body.$el.find($("tr.new"))).removeClass("new")
$(self.grid.body.$el.find($("tr.new"))).removeClass("new")
var m = new (data.model) (null, {
silent: true,
handler: collection,
@ -1112,7 +1112,7 @@
collection.add(m);
var idx = collection.indexOf(m),
newRow = grid.body.rows[idx].$el;
newRow = self.grid.body.rows[idx].$el;
newRow.addClass("new");
$(newRow).pgMakeVisible('backform-tab');
@ -1150,6 +1150,7 @@
});
var SubNodeCollectionControl = Backform.SubNodeCollectionControl = Backform.Control.extend({
row: Backgrid.Row,
render: function() {
var field = _.defaults(this.field.toJSON(), this.defaults),
attributes = this.model.toJSON(),
@ -1180,6 +1181,12 @@
// Show Backgrid Control
grid = (data.subnode == undefined) ? "" : this.showGridControl(data);
// Clean up first
this.$el.removeClass(Backform.hiddenClassname);
if (!data.visible)
this.$el.addClass(Backform.hiddenClassname);
this.$el.html(grid).addClass(field.name);
this.updateInvalid();
@ -1247,7 +1254,9 @@
name: "pg-backform-delete", label: "",
cell: Backgrid.Extension.DeleteCell,
editable: false, cell_priority: -1,
canDeleteRow: data.canDeleteRow
canDeleteRow: data.canDeleteRow,
customDeleteMsg: data.customDeleteMsg,
customDeleteTitle: data.customDeleteTitle
});
}
@ -1304,6 +1313,7 @@
var grid = self.grid = new Backgrid.Grid({
columns: gridSchema.columns,
collection: collection,
row: this.row,
className: "backgrid table-bordered"
});

View File

@ -2,13 +2,13 @@
// Set up Backform appropriately for the environment. Start with AMD.
if (typeof define === 'function' && define.amd) {
define([
'underscore', 'jquery', 'backbone', 'backform', 'backgrid', 'alertify',
'sources/gettext', 'underscore', 'jquery', 'backbone', 'backform', 'backgrid', 'alertify',
'moment', 'bignumber', 'bootstrap.datetimepicker'
],
function(_, $, Backbone, Backform, Backgrid, Alertify, moment, BigNumber) {
function(gettext, _, $, Backbone, Backform, Backgrid, Alertify, moment, BigNumber) {
// Export global even in AMD case in case this script is loaded with
// others that may still expect a global Backform.
return factory(root, _, $, Backbone, Backform, Alertify, moment, BigNumber);
return factory(root, gettext, _, $, Backbone, Backform, Alertify, moment, BigNumber);
});
// Next for Node.js or CommonJS. jQuery may not be needed as a module.
@ -19,13 +19,13 @@
Backform = require('backform') || root.Backform;
Alertify = require('alertify') || root.Alertify;
moment = require('moment') || root.moment;
factory(root, _, $, Backbone, Backform, Alertify, moment);
factory(root, gettext, _, $, Backbone, Backform, Alertify, moment);
// Finally, as a browser global.
} else {
factory(root, root._, (root.jQuery || root.Zepto || root.ender || root.$), root.Backbone, root.Backform);
factory(root, root.gettext, root._, (root.jQuery || root.Zepto || root.ender || root.$), root.Backbone, root.Backform);
}
} (this, function(root, _, $, Backbone, Backform, Alertify, moment, BigNumber) {
} (this, function(root, gettext, _, $, Backbone, Backform, Alertify, moment, BigNumber) {
/*
* Add mechanism in backgrid to render different types of cells in
* same column;
@ -380,7 +380,8 @@
var DeleteCell = Backgrid.Extension.DeleteCell = Backgrid.Cell.extend({
defaults: _.defaults({
defaultDeleteMsg: 'Are you sure you wish to delete this row?'
defaultDeleteMsg: gettext('Are you sure you wish to delete this row?'),
defaultDeleteTitle: gettext('Delete Row')
}, Backgrid.Cell.prototype.defaults),
/** @property */
@ -399,8 +400,10 @@
if (canDeleteRow) {
var delete_msg = !_.isUndefined(this.column.get('customDeleteMsg')) ?
this.column.get('customDeleteMsg'): that.defaults.defaultDeleteMsg;
var delete_title = !_.isUndefined(this.column.get('customDeleteTitle')) ?
this.column.get('customDeleteTitle'): that.defaults.defaultDeleteTitle;
Alertify.confirm(
'Delete Row',
delete_title,
delete_msg,
function(evt) {
that.model.collection.remove(that.model);
@ -1378,6 +1381,58 @@
_.extend(MomentCell.prototype, MomentFormatter.prototype.defaults);
Backgrid.Extension.StringDepCell = Backgrid.StringCell.extend({
initialize: function() {
Backgrid.StringCell.prototype.initialize.apply(this, arguments);
Backgrid.Extension.DependentCell.prototype.initialize.apply(this, arguments);
},
dependentChanged: function () {
this.$el.empty();
var self = this,
model = this.model,
column = this.column,
editable = this.column.get("editable");
this.render();
is_editable = _.isFunction(editable) ? !!editable.apply(column, [model]) : !!editable;
setTimeout(function() {
self.$el.removeClass("editor");
if (is_editable){ self.$el.addClass("editable"); }
else { self.$el.removeClass("editable"); }
}, 10);
this.delegateEvents();
return this;
},
remove: Backgrid.Extension.DependentCell.prototype.remove
});
Backgrid.Extension.Select2DepCell = Backgrid.Extension.Select2Cell.extend({
initialize: function() {
Backgrid.Extension.Select2Cell.prototype.initialize.apply(this, arguments);
Backgrid.Extension.DependentCell.prototype.initialize.apply(this, arguments);
},
dependentChanged: function () {
var model = this.model;
var column = this.column;
editable = this.column.get("editable");
this.render();
is_editable = _.isFunction(editable) ? !!editable.apply(column, [model]) : !!editable;
if (is_editable){ this.$el.addClass("editable"); }
else { this.$el.removeClass("editable"); }
this.delegateEvents();
return this;
},
remove: Backgrid.Extension.DependentCell.prototype.remove
});
return Backgrid;
}));

View File

@ -25,34 +25,7 @@ define([
// How long to wait after typing has stopped before searching can start
wait: 150
}));
},
StringDepCell = Backgrid.StringCell.extend({
initialize: function() {
Backgrid.StringCell.prototype.initialize.apply(this, arguments);
Backgrid.Extension.DependentCell.prototype.initialize.apply(this, arguments);
},
dependentChanged: function () {
this.$el.empty();
var self = this,
model = this.model,
column = this.column,
editable = this.column.get("editable");
this.render();
is_editable = _.isFunction(editable) ? !!editable.apply(column, [model]) : !!editable;
setTimeout(function() {
self.$el.removeClass("editor");
if (is_editable){ self.$el.addClass("editable"); }
else { self.$el.removeClass("editable"); }
}, 10);
this.delegateEvents();
return this;
},
remove: Backgrid.Extension.DependentCell.prototype.remove
});
}
pgBrowser.UserManagement = {
init: function() {
@ -83,7 +56,7 @@ define([
schema: [
{
id: 'email', label: gettext('Email'), type: 'text',
cell:StringDepCell, cellHeaderClasses:'width_percent_30',
cell: Backgrid.Extension.StringDepCell, cellHeaderClasses: 'width_percent_30',
deps: ['id'],
editable: function(m) {
if(m instanceof Backbone.Collection) {