[PATCH V3] Fix Add Network window

VLans and Interfaces must only be available for selection if network type Bridge is selected. This restriction was not implemented in the UI. This patch fixes this problem. Signed-off-by: Rodrigo Trujillo <rodrigo.trujillo@linux.vnet.ibm.com> --- ui/js/src/kimchi.network.js | 22 +++++++++++++++++++++- ui/pages/tabs/network.html.tmpl | 20 +++++++++++--------- 2 files changed, 32 insertions(+), 10 deletions(-) diff --git a/ui/js/src/kimchi.network.js b/ui/js/src/kimchi.network.js index faf1285..c0fe4ff 100644 --- a/ui/js/src/kimchi.network.js +++ b/ui/js/src/kimchi.network.js @@ -210,11 +210,28 @@ kimchi.openNetworkDialog = function(okCallback) { $("#networkConfig").dialog("open"); }; +kimchi.enableBridgeOptions = function(enable) { + if (!enable) { + $("#enableVlan").attr("checked", false); + $("#networkVlanID").prop("disabled", true); + $("#networkVlanID").val(""); + $("#networkInterface").val(""); + $("#bridge-options").slideUp(100); + } else if (!$("#networkInterface").val()){ + $("#networkInterface").prop("selectedIndex", 0); + $("#bridge-options").slideDown(100); + } +}; + kimchi.setDefaultNetworkType = function(isInterfaceAvail) { $("#networkTypeBri").prop("checked", isInterfaceAvail); $("#networkTypeBri").prop("disabled", !isInterfaceAvail); - $("#networkInterface").prop("disabled", !isInterfaceAvail); $("#networkTypeNat").prop("checked", !isInterfaceAvail); + if (!isInterfaceAvail) { + kimchi.enableBridgeOptions(false); + } else { + $("#bridge-options").slideDown(100); + } }; kimchi.getNetworkDialogValues = function() { @@ -250,12 +267,15 @@ kimchi.setupNetworkFormEvent = function() { }); $("#networkTypeIso").on("click", function(event) { $("#networkInterface").prop("disabled", true); + kimchi.enableBridgeOptions(false); }); $("#networkTypeNat").on("click", function(event) { $("#networkInterface").prop("disabled", true); + kimchi.enableBridgeOptions(false); }); $("#networkTypeBri").on("click", function(event) { $("#networkInterface").prop("disabled", false); + kimchi.enableBridgeOptions(true); }); }; diff --git a/ui/pages/tabs/network.html.tmpl b/ui/pages/tabs/network.html.tmpl index 83c1d7e..4340e19 100644 --- a/ui/pages/tabs/network.html.tmpl +++ b/ui/pages/tabs/network.html.tmpl @@ -71,15 +71,17 @@ <input type="radio" id="networkTypeBri" name="networkType" value="bridged"> <label for="networkTypeBri">$_("Bridged: Virtual machines are connected to physical network directly")</label> </div> - <div class="destination"> - <label>$_("Destination"): </label> - <select id="networkInterface"></select> - </div> - <div class="VLAN"> - <label for="enableVlan">$_("Enable VLAN"): </label> - <input id="enableVlan" type="checkbox" value=""/> - <label>$_("VLAN ID"): </label> - <input type="text" id="networkVlanID" disabled> + <div id=bridge-options> + <div class="destination"> + <label>$_("Destination"): </label> + <select id="networkInterface"></select> + </div> + <div class="VLAN"> + <label for="enableVlan">$_("Enable VLAN"): </label> + <input id="enableVlan" type="checkbox" value=""/> + <label>$_("VLAN ID"): </label> + <input type="text" id="networkVlanID" disabled> + </div> </div> </div> </div> -- 1.8.5.3

On 02/27/2014 03:31 AM, Rodrigo Trujillo wrote:
VLans and Interfaces must only be available for selection if network type Bridge is selected. This restriction was not implemented in the UI. This patch fixes this problem.
Signed-off-by: Rodrigo Trujillo <rodrigo.trujillo@linux.vnet.ibm.com> --- ui/js/src/kimchi.network.js | 22 +++++++++++++++++++++- ui/pages/tabs/network.html.tmpl | 20 +++++++++++--------- 2 files changed, 32 insertions(+), 10 deletions(-)
diff --git a/ui/js/src/kimchi.network.js b/ui/js/src/kimchi.network.js index faf1285..c0fe4ff 100644 --- a/ui/js/src/kimchi.network.js +++ b/ui/js/src/kimchi.network.js @@ -210,11 +210,28 @@ kimchi.openNetworkDialog = function(okCallback) { $("#networkConfig").dialog("open"); };
+kimchi.enableBridgeOptions = function(enable) { + if (!enable) { + $("#enableVlan").attr("checked", false); + $("#networkVlanID").prop("disabled", true); Why one is .attr() and the other is .prop()? For input[checked] or input[disabled], I suggest always use .prop(). If you'd like to use .attr(), please use it as follows: $('input').attr('checked', 'checked'); $('input').attr('disabled', 'disabled'); + $("#networkVlanID").val(""); + $("#networkInterface").val(""); + $("#bridge-options").slideUp(100); + } else if (!$("#networkInterface").val()){ + $("#networkInterface").prop("selectedIndex", 0); + $("#bridge-options").slideDown(100); + } +};
+ kimchi.setDefaultNetworkType = function(isInterfaceAvail) { $("#networkTypeBri").prop("checked", isInterfaceAvail); $("#networkTypeBri").prop("disabled", !isInterfaceAvail); - $("#networkInterface").prop("disabled", !isInterfaceAvail); $("#networkTypeNat").prop("checked", !isInterfaceAvail); + if (!isInterfaceAvail) { + kimchi.enableBridgeOptions(false); + } else { + $("#bridge-options").slideDown(100); + } };
kimchi.getNetworkDialogValues = function() { @@ -250,12 +267,15 @@ kimchi.setupNetworkFormEvent = function() { }); $("#networkTypeIso").on("click", function(event) { $("#networkInterface").prop("disabled", true); + kimchi.enableBridgeOptions(false); }); $("#networkTypeNat").on("click", function(event) { $("#networkInterface").prop("disabled", true); + kimchi.enableBridgeOptions(false); }); $("#networkTypeBri").on("click", function(event) { $("#networkInterface").prop("disabled", false); + kimchi.enableBridgeOptions(true); }); };
diff --git a/ui/pages/tabs/network.html.tmpl b/ui/pages/tabs/network.html.tmpl index 83c1d7e..4340e19 100644 --- a/ui/pages/tabs/network.html.tmpl +++ b/ui/pages/tabs/network.html.tmpl @@ -71,15 +71,17 @@ <input type="radio" id="networkTypeBri" name="networkType" value="bridged"> <label for="networkTypeBri">$_("Bridged: Virtual machines are connected to physical network directly")</label> </div> - <div class="destination"> - <label>$_("Destination"): </label> - <select id="networkInterface"></select> - </div> - <div class="VLAN"> - <label for="enableVlan">$_("Enable VLAN"): </label> - <input id="enableVlan" type="checkbox" value=""/> - <label>$_("VLAN ID"): </label> - <input type="text" id="networkVlanID" disabled> + <div id=bridge-options> <div id=*"**bridge-options**"*> + <div class="destination"> + <label>$_("Destination"): </label> include *for* attribute for <label> element. + <select id="networkInterface"></select> + </div> + <div class="VLAN"> + <label for="enableVlan">$_("Enable VLAN"): </label> + <input id="enableVlan" type="checkbox" value=""/> + <label>$_("VLAN ID"): </label> include *for* attribute for <label> element. + <input type="text" id="networkVlanID" disabled> + </div> </div> </div> </div>

done On 02/26/2014 11:32 PM, Hongliang Wang wrote:
On 02/27/2014 03:31 AM, Rodrigo Trujillo wrote:
VLans and Interfaces must only be available for selection if network type Bridge is selected. This restriction was not implemented in the UI. This patch fixes this problem.
Signed-off-by: Rodrigo Trujillo<rodrigo.trujillo@linux.vnet.ibm.com> --- ui/js/src/kimchi.network.js | 22 +++++++++++++++++++++- ui/pages/tabs/network.html.tmpl | 20 +++++++++++--------- 2 files changed, 32 insertions(+), 10 deletions(-)
diff --git a/ui/js/src/kimchi.network.js b/ui/js/src/kimchi.network.js index faf1285..c0fe4ff 100644 --- a/ui/js/src/kimchi.network.js +++ b/ui/js/src/kimchi.network.js @@ -210,11 +210,28 @@ kimchi.openNetworkDialog = function(okCallback) { $("#networkConfig").dialog("open"); };
+kimchi.enableBridgeOptions = function(enable) { + if (!enable) { + $("#enableVlan").attr("checked", false); + $("#networkVlanID").prop("disabled", true); Why one is .attr() and the other is .prop()? For input[checked] or input[disabled], I suggest always use .prop(). If you'd like to use .attr(), please use it as follows: $('input').attr('checked', 'checked'); $('input').attr('disabled', 'disabled'); + $("#networkVlanID").val(""); + $("#networkInterface").val(""); + $("#bridge-options").slideUp(100); + } else if (!$("#networkInterface").val()){ + $("#networkInterface").prop("selectedIndex", 0); + $("#bridge-options").slideDown(100); + } +};
+ kimchi.setDefaultNetworkType = function(isInterfaceAvail) { $("#networkTypeBri").prop("checked", isInterfaceAvail); $("#networkTypeBri").prop("disabled", !isInterfaceAvail); - $("#networkInterface").prop("disabled", !isInterfaceAvail); $("#networkTypeNat").prop("checked", !isInterfaceAvail); + if (!isInterfaceAvail) { + kimchi.enableBridgeOptions(false); + } else { + $("#bridge-options").slideDown(100); + } };
kimchi.getNetworkDialogValues = function() { @@ -250,12 +267,15 @@ kimchi.setupNetworkFormEvent = function() { }); $("#networkTypeIso").on("click", function(event) { $("#networkInterface").prop("disabled", true); + kimchi.enableBridgeOptions(false); }); $("#networkTypeNat").on("click", function(event) { $("#networkInterface").prop("disabled", true); + kimchi.enableBridgeOptions(false); }); $("#networkTypeBri").on("click", function(event) { $("#networkInterface").prop("disabled", false); + kimchi.enableBridgeOptions(true); }); };
diff --git a/ui/pages/tabs/network.html.tmpl b/ui/pages/tabs/network.html.tmpl index 83c1d7e..4340e19 100644 --- a/ui/pages/tabs/network.html.tmpl +++ b/ui/pages/tabs/network.html.tmpl @@ -71,15 +71,17 @@ <input type="radio" id="networkTypeBri" name="networkType" value="bridged"> <label for="networkTypeBri">$_("Bridged: Virtual machines are connected to physical network directly")</label> </div> - <div class="destination"> - <label>$_("Destination"): </label> - <select id="networkInterface"></select> - </div> - <div class="VLAN"> - <label for="enableVlan">$_("Enable VLAN"): </label> - <input id="enableVlan" type="checkbox" value=""/> - <label>$_("VLAN ID"): </label> - <input type="text" id="networkVlanID" disabled> + <div id=bridge-options> <div id=*"**bridge-options**"*> + <div class="destination"> + <label>$_("Destination"): </label> include *for* attribute for <label> element. + <select id="networkInterface"></select> + </div> + <div class="VLAN"> + <label for="enableVlan">$_("Enable VLAN"): </label> + <input id="enableVlan" type="checkbox" value=""/> + <label>$_("VLAN ID"): </label> include *for* attribute for <label> element. + <input type="text" id="networkVlanID" disabled> + </div> </div> </div> </div>
_______________________________________________ Kimchi-devel mailing list Kimchi-devel@ovirt.org http://lists.ovirt.org/mailman/listinfo/kimchi-devel
participants (2)
-
Hongliang Wang
-
Rodrigo Trujillo