[Lada-commits] [PATCH 4 of 4] Added save and discard buttons to proben header fields and listen to changes to enable or disable buttons
Wald Commits
scm-commit at wald.intevation.org
Tue Dec 16 13:22:59 CET 2014
# HG changeset patch
# User Raimund Renkert <raimund.renkert at intevation.de>
# Date 1418732514 -3600
# Node ID 66f3c5d258e2ef7a564747f86e27a8046707ec96
# Parent 61c76c12bd28e1db026fde69e7700cf06e309b61
Added save and discard buttons to proben header fields and listen to changes to enable or disable buttons.
diff -r 61c76c12bd28 -r 66f3c5d258e2 app/view/proben/EditForm.js
--- a/app/view/proben/EditForm.js Tue Dec 16 13:20:33 2014 +0100
+++ b/app/view/proben/EditForm.js Tue Dec 16 13:21:54 2014 +0100
@@ -29,154 +29,284 @@
minWidth: 650,
initComponent: function() {
+ var me = this;
this.items = [{
xtype: 'fieldset',
title: 'Allgemein',
- defaults: {
- labelWidth: 160
- },
items: [{
- layout: 'hbox',
border: 0,
+ margin: '0, 0, 10, 0',
+ dockedItems: [{
+ xtype: 'toolbar',
+ dock: 'bottom',
+ border: '0, 1, 1, 1',
+ style: {
+ borderBottom: '1px solid #b5b8c8 !important',
+ borderLeft: '1px solid #b5b8c8 !important',
+ borderRight: '1px solid #b5b8c8 !important'
+ },
+ items: ['->', {
+ text: 'Speichern',
+ qtip: 'Daten speichern',
+ icon: 'gfx/dialog-ok-apply.png',
+ action: 'save',
+ scope: me,
+ handler: this.commit
+ }, {
+ text: 'Verwerfen',
+ qtip: 'Änderungen verwerfen',
+ icon: 'gfx/dialog-cancel.png',
+ action: 'discard',
+ disabled: true,
+ scope: this,
+ handler: this.reset
+ }]
+ }],
+ items: [{
+ layout: 'hbox',
+ border: 0,
+ items: [{
+ border: 0,
+ width: '43%',
+ minWidth: 290,
+ items: [{
+ xtype: 'mst',
+ name: 'mstId',
+ fieldLabel: 'Messstelle',
+ allowBlank: false,
+ listeners: {
+ dirtychange: {
+ fn: this.updateOnChange,
+ scope: me
+ }
+ }
+ }, {
+ xtype: 'textfield',
+ name: 'hauptprobenNr',
+ maxLength: 20,
+ fieldLabel: 'Hauptprobennr.',
+ listeners: {
+ dirtychange: {
+ fn: this.updateOnChange,
+ scope: me
+ }
+ }
+ }]
+ }, {
+ border: 0,
+ width: '52%',
+ minWidth: 300,
+ items: [{
+ xtype: 'fieldset',
+ title: 'Erweiterte Angaben',
+ collapsible: true,
+ collapsed: true,
+ items: [{
+ xtype: 'datenbasis',
+ id: 'datenbasis',
+ editable: false,
+ name: 'datenbasisId',
+ fieldLabel: 'Datenbasis',
+ listeners: {
+ dirtychange: {
+ fn: this.updateOnChange,
+ scope: me
+ }
+ }
+ }, {
+ xtype: 'betriebsart',
+ name: 'baId',
+ fieldLabel: 'Betriebsart',
+ listeners: {
+ dirtychange: {
+ fn: this.updateOnChange,
+ scope: me
+ }
+ }
+ }, {
+ xtype: 'testdatensatz',
+ name: 'test',
+ fieldLabel: 'Testdatensatz',
+ allowBlank: false,
+ listeners: {
+ dirtychange: {
+ fn: this.updateOnChange,
+ scope: me
+ }
+ }
+ }, {
+ xtype: 'probenart',
+ id: 'probenart',
+ editable: false,
+ name: 'probenartId',
+ fieldLabel: 'Probenart',
+ allowBlank: false,
+ listeners: {
+ dirtychange: {
+ fn: this.updateOnChange,
+ scope: me
+ }
+ }
+ }, {
+ xtype: 'numberfield',
+ allowDecimals: false,
+ name: 'probeNehmerId',
+ fieldLabel: 'Probennehmer',
+ listeners: {
+ dirtychange: {
+ fn: this.updateOnChange,
+ scope: me
+ }
+ }
+ }, {
+ xtype: 'netzbetreiber',
+ name: 'netzbetreiberId',
+ editable: false,
+ fieldLabel: 'Netzbetreiber',
+ allowBlank: false,
+ listeners: {
+ dirtychange: {
+ fn: this.updateOnChange,
+ scope: me
+ }
+ }
+ }, {
+ xtype: 'textfield',
+ name: 'x11',
+ fieldLabel: 'Datensatzerzeuger',
+ listeners: {
+ dirtychange: {
+ fn: this.updateOnChange,
+ scope: me
+ }
+ }
+ }]
+ }]
+ }]
+ }, {
+ // Medium
+ xtype: 'fieldset',
+ title: 'Medium',
items: [{
border: 0,
- width: '43%',
- minWidth: 290,
+ layout: {
+ type: 'vbox',
+ align: 'stretch'
+ },
+ width: '100%',
items: [{
- xtype: 'mst',
- name: 'mstId',
- fieldLabel: 'Messstelle',
- allowBlank: false
+ xtype: 'textfield',
+ name: 'media',
+ labelWidth: 110,
+ fieldLabel: 'Medienbezeichnung',
+ listeners: {
+ dirtychange: {
+ fn: this.updateOnChange,
+ scope: me
+ }
+ }
}, {
xtype: 'textfield',
- name: 'hauptprobenNr',
- maxLength: 20,
- fieldLabel: 'Hauptprobennr.'
- }]
- }, {
- border: 0,
- width: '52%',
- minWidth: 300,
- items: [{
+ maxLength: 100,
+ name: 'mediaDesk',
+ labelWidth: 110,
+ fieldLabel: 'Deskriptoren',
+ listeners: {
+ dirtychange: {
+ fn: this.updateOnChange,
+ scope: me
+ }
+ }
+ }, {
+ xtype: 'uwb',
+ name: 'umwId',
+ fieldLabel: 'Umweltbereich',
+ labelWidth: 110,
+ allowBlank: false,
+ listeners: {
+ dirtychange: {
+ fn: this.updateOnChange,
+ scope: me
+ }
+ }
+ }, {
xtype: 'fieldset',
- title: 'Erweiterte Angaben',
+ title: 'Details Deskriptoren',
collapsible: true,
collapsed: true,
- items: [{
- xtype: 'datenbasis',
- id: 'datenbasis',
- editable: false,
- name: 'datenbasisId',
- fieldLabel: 'Datenbasis'
- }, {
- xtype: 'betriebsart',
- name: 'baId',
- fieldLabel: 'Betriebsart'
- }, {
- xtype: 'testdatensatz',
- name: 'test',
- fieldLabel: 'Testdatensatz',
- allowBlank: false
- }, {
- xtype: 'probenart',
- id: 'probenart',
- editable: false,
- name: 'probenartId',
- fieldLabel: 'Probenart',
- allowBlank: false
- }, {
- xtype: 'numberfield',
- allowDecimals: false,
- name: 'probeNehmerId',
- fieldLabel: 'Probennehmer'
- }, {
- xtype: 'netzbetreiber',
- name: 'netzbetreiberId',
- editable: false,
- fieldLabel: 'Netzbetreiber',
- allowBlank: false
- }, {
- xtype: 'textfield',
- name: 'x11',
- fieldLabel: 'Datensatzerzeuger'
- }]
+ defaultType: 'textfield',
+ layout: {
+ type: 'table',
+ columns: 3
+ },
+ items: this.buildDescriptors(),
+ listeners: {
+ dirtychange: {
+ fn: this.updateOnChange,
+ scope: me
+ }
+ }
}]
}]
- }]
- }, {
- // Medium
- xtype: 'fieldset',
- title: 'Medium',
- items: [{
- border: 0,
+ }, {
+ // Zeit
+ xtype: 'fieldset',
+ title: 'Zeit',
+ defaultType: 'datetime',
+ defaults: {
+ labelWidth: 150
+ },
layout: {
- type: 'vbox',
- align: 'stretch'
+ type: 'table',
+ columns: 2
},
- width: '100%',
items: [{
- xtype: 'textfield',
- name: 'media',
- labelWidth: 110,
- fieldLabel: 'Medienbezeichnung'
+ fieldLabel: 'Probennahme Beginn',
+ margin: '0, 10, 5, 0',
+ labelWidth: 130,
+ name: 'probeentnahmeBeginn',
+ listeners: {
+ dirtychange: {
+ fn: this.updateOnChange,
+ scope: me
+ }
+ }
}, {
- xtype: 'textfield',
- maxLength: 100,
- name: 'mediaDesk',
- labelWidth: 110,
- fieldLabel: 'Deskriptoren'
+ fieldLabel: 'Sollzeit Von',
+ margin: '0, 10, 5, 0',
+ labelWidth: 100,
+ name: 'solldatumBeginn',
+ listeners: {
+ dirtychange: {
+ fn: this.updateOnChange,
+ scope: me
+ }
+ }
}, {
- xtype: 'uwb',
- name: 'umwId',
- fieldLabel: 'Umweltbereich',
- labelWidth: 110,
- allowBlank: false
+ fieldLabel: 'Probennahme Ende',
+ margin: '0, 10, 5, 0',
+ labelWidth: 130,
+ name: 'probeentnahmeEnde',
+ listeners: {
+ dirtychange: {
+ fn: this.updateOnChange,
+ scope: me
+ }
+ }
}, {
- xtype: 'fieldset',
- title: 'Details Deskriptoren',
- collapsible: true,
- collapsed: true,
- defaultType: 'textfield',
- layout: {
- type: 'table',
- columns: 3
- },
- items: this.buildDescriptors()
+ fieldLabel: 'Sollzeit Bis',
+ margin: '0, 10, 5, 0',
+ labelWidth: 100,
+ name: 'solldatumEnde',
+ listeners: {
+ dirtychange: {
+ fn: this.updateOnChange,
+ scope: me
+ }
+ }
}]
}]
- }, {
- // Zeit
- xtype: 'fieldset',
- title: 'Zeit',
- defaultType: 'datetime',
- defaults: {
- labelWidth: 150
- },
- layout: {
- type: 'table',
- columns: 2
- },
- items: [{
- fieldLabel: 'Probennahme Beginn',
- margin: '0, 10, 5, 0',
- labelWidth: 130,
- name: 'probeentnahmeBeginn'
- }, {
- fieldLabel: 'Sollzeit Von',
- margin: '0, 10, 5, 0',
- labelWidth: 100,
- name: 'solldatumBeginn'
- }, {
- fieldLabel: 'Probennahme Ende',
- margin: '0, 10, 5, 0',
- labelWidth: 130,
- name: 'probeentnahmeEnde'
- }, {
- fieldLabel: 'Sollzeit Bis',
- margin: '0, 10, 5, 0',
- labelWidth: 100,
- name: 'solldatumEnde'
- }]
+ }]
}, {
// Ortsangaben
xtype: 'fieldset',
diff -r 61c76c12bd28 -r 66f3c5d258e2 app/view/widgets/LadaForm.js
--- a/app/view/widgets/LadaForm.js Tue Dec 16 13:20:33 2014 +0100
+++ b/app/view/widgets/LadaForm.js Tue Dec 16 13:21:54 2014 +0100
@@ -94,9 +94,13 @@
}
},
+ reset: function() {
+ this.loadRecord(this.model);
+ this.updateOnChange();
+ },
+
commit: function() {
if (this.form.isDirty() && this.form.isValid()) {
- this.form.updateRecord(this.model);
var data = this.model.getAllData();
var baseUrl = this.model.getProxy().url;
@@ -114,11 +118,13 @@
callback: function(option, success, response) {
this.parseResponse(response);
if (this.success) {
+ this.form.updateRecord(this.model);
this.fireEvent(
'savesuccess',
this,
this.model,
response);
+ this.updateOnChange();
}
else {
this.form.markInvalid(this.errors);
@@ -257,5 +263,31 @@
messages.insert(0, label);
}
this.insert(0, messages);
+ },
+
+ updateOnChange: function() {
+ console.log(this.isDirty());
+ var childs = this.query('toolbar');
+ for (var i = childs.length - 1; i >= 0; i--) {
+ if (childs[i].ownerCt.xtype === 'panel') {
+ if (this.isDirty()) {
+ childs[i].down('button[action=discard]').enable();
+ childs[i].down('button[action=save]').enable();
+ }
+ else {
+ childs[i].down('button[action=discard]').disable();
+ childs[i].down('button[action=save]').disable();
+ }
+ }
+ else {
+ var btn = childs[i].down('button[action=add]');
+ if (this.isDirty()) {
+ btn.disable();
+ }
+ else {
+ btn.enable();
+ }
+ }
+ }
}
});
More information about the Lada-commits
mailing list