[pve-devel] [PATCH manager 3/9] Disable the submit button based on whole form validity

Emmanuel Kasper e.kasper at proxmox.com
Thu Jan 12 10:13:56 CET 2017


Until now we disabled the submit button, based on
the feature API call where we tested if the selected VM, and its snapshot
can be used as the source of a clone.

This had the following problems:
 * the feature test for copy clone / linked clone always returned true,
 since the passed paramaters were already filtered before user input
 (ie we only allowed a linked clone to be selected if the source VM is
 a template, or a snasphot to be selected if existed on source VM)
 * the guest ID input field was not validated

With the current patch, the validation is now made on each of the form
fields. verifyFeature() is still used to populate a list of valid nodes
passed to the Node Selector.
---
 www/manager6/qemu/Clone.js | 19 ++++++++++++++++---
 1 file changed, 16 insertions(+), 3 deletions(-)

diff --git a/www/manager6/qemu/Clone.js b/www/manager6/qemu/Clone.js
index 2843921..3cca65e 100644
--- a/www/manager6/qemu/Clone.js
+++ b/www/manager6/qemu/Clone.js
@@ -7,6 +7,18 @@ Ext.define('PVE.window.Clone', {
 
     onlineHelp: 'qm_copy_and_clone',
 
+    controller: {
+	xclass: 'Ext.app.ViewController',
+	control: {
+	    'panel[reference=cloneform]': {
+		validitychange: 'disableSubmit'
+	    }
+	},
+	disableSubmit: function(form) {
+	    this.lookupReference('submitBtn').setDisabled(!form.isValid());
+	}
+    },
+
     create_clone: function(values) {
 	var me = this;
 
@@ -86,8 +98,7 @@ Ext.define('PVE.window.Clone', {
         }
     },
 
-    // check that the VM supports the requested clone mode and snapshot name
-    // and add to the list of valid nodes each node where
+    // add to the list of valid nodes each node where
     // all the VM disks are available
     verifyFeature: function() {
 	var me = this;
@@ -111,7 +122,6 @@ Ext.define('PVE.window.Clone', {
 	    },
 	    success: function(response, options) {
                 var res = response.result.data;
-		me.submitBtn.setDisabled(res.hasFeature !== 1);
 
 		me.targetSel.allowedNodes = res.nodes;
 		me.targetSel.validate();
@@ -178,6 +188,7 @@ Ext.define('PVE.window.Clone', {
 	    value : me.snapname,
 	    listeners: {
 		change: function(f, value) {
+		// current selected snaphshot has maybe local disks
 		    me.verifyFeature();
 		}
 	    }
@@ -245,6 +256,7 @@ Ext.define('PVE.window.Clone', {
 
 	me.formPanel = Ext.create('Ext.form.Panel', {
 	    bodyPadding: 10,
+	    reference: 'cloneform',
 	    border: false,
 	    layout: 'column',
 	    defaultType: 'container',
@@ -275,6 +287,7 @@ Ext.define('PVE.window.Clone', {
 	me.title = "Clone " + titletext + " " + me.vmid;
 	
 	me.submitBtn = Ext.create('Ext.Button', {
+	    reference: 'submitBtn',
 	    text: gettext('Clone'),
 	    disabled: true,
 	    handler: function() {
-- 
2.1.4




More information about the pve-devel mailing list