mirror of https://github.com/apache/cloudstack.git
new UI - Add VLAN - keep dialog box open and show spinning wheel on dialog box after Add button is clicked. Display error message on dialog box if adding fails. Close dialog box if adding succeeds.
This commit is contained in:
Jessica Wang
parent
4a0fd5f0b5
commit
3eb7bee1f9
|
|
@ -1007,6 +1007,18 @@
|
|||
</ol>
|
||||
</form>
|
||||
</div>
|
||||
<!--Loading box-->
|
||||
<div id="spinning_wheel" class="ui_dialog_loaderbox" style="display:none;">
|
||||
<div class="ui_dialog_loader"></div>
|
||||
<p>Adding....</p>
|
||||
</div>
|
||||
|
||||
<!--Confirmation msg box-->
|
||||
<!--Note: for error msg, just have to add error besides everything for eg. add error(class) next to ui_dialog_messagebox error, ui_dialog_msgicon error, ui_dialog_messagebox_text error. -->
|
||||
<div id="info_container" class="ui_dialog_messagebox error" style="display:none;">
|
||||
<div id="icon" class="ui_dialog_msgicon error"></div>
|
||||
<div id="info" class="ui_dialog_messagebox_text error">(info)</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Add VLAN IP Range Dialog for zone (end) -->
|
||||
|
||||
|
|
|
|||
|
|
@ -873,6 +873,25 @@ function bindAndListMidMenuItems($leftmenu, commandString, jsonResponse1, jsonRe
|
|||
});
|
||||
}
|
||||
|
||||
function handleErrorInDialog(XMLHttpResponse, $thisDialog) {
|
||||
var start = XMLHttpResponse.responseText.indexOf("h1") + 3;
|
||||
var end = XMLHttpResponse.responseText.indexOf("</h1");
|
||||
var errorMsg = XMLHttpResponse.responseText.substring(start, end);
|
||||
var $infoContainer = $thisDialog.find("#info_container");
|
||||
|
||||
if(errorMsg != null && errorMsg.length > 0)
|
||||
$infoContainer.find("#info").text(fromdb(errorMsg));
|
||||
else
|
||||
$infoContainer.find("#info").text("action failed");
|
||||
|
||||
$thisDialog.find("#spinning_wheel").fadeOut("slow");
|
||||
$infoContainer.fadeIn("slow");
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -839,31 +839,33 @@ function initAddVLANButton($addButton) {
|
|||
dialogAddVlanForZone
|
||||
.dialog('option', 'buttons', {
|
||||
"Add": function() {
|
||||
var thisDialog = $(this);
|
||||
var $thisDialog = $(this);
|
||||
$thisDialog.find("#info_container").hide();
|
||||
|
||||
// validate values
|
||||
var isValid = true;
|
||||
var isTagged = false;
|
||||
var isDirect = false;
|
||||
if (getNetworkType() == "vlan") {
|
||||
isDirect = thisDialog.find("#add_publicip_vlan_type").val() == "false";
|
||||
isTagged = thisDialog.find("#add_publicip_vlan_tagged").val() == "tagged";
|
||||
isDirect = $thisDialog.find("#add_publicip_vlan_type").val() == "false";
|
||||
isTagged = $thisDialog.find("#add_publicip_vlan_tagged").val() == "tagged";
|
||||
}
|
||||
|
||||
isValid &= validateString("Account", thisDialog.find("#add_publicip_vlan_account"), thisDialog.find("#add_publicip_vlan_account_errormsg"), true); //optional
|
||||
isValid &= validateString("Account", $thisDialog.find("#add_publicip_vlan_account"), $thisDialog.find("#add_publicip_vlan_account_errormsg"), true); //optional
|
||||
|
||||
if (isTagged) {
|
||||
isValid &= validateNumber("VLAN", thisDialog.find("#add_publicip_vlan_vlan"), thisDialog.find("#add_publicip_vlan_vlan_errormsg"), 2, 4095);
|
||||
isValid &= validateNumber("VLAN", $thisDialog.find("#add_publicip_vlan_vlan"), $thisDialog.find("#add_publicip_vlan_vlan_errormsg"), 2, 4095);
|
||||
}
|
||||
isValid &= validateIp("Gateway", thisDialog.find("#add_publicip_vlan_gateway"), thisDialog.find("#add_publicip_vlan_gateway_errormsg"));
|
||||
isValid &= validateIp("Netmask", thisDialog.find("#add_publicip_vlan_netmask"), thisDialog.find("#add_publicip_vlan_netmask_errormsg"));
|
||||
isValid &= validateIp("Start IP Range", thisDialog.find("#add_publicip_vlan_startip"), thisDialog.find("#add_publicip_vlan_startip_errormsg")); //required
|
||||
isValid &= validateIp("End IP Range", thisDialog.find("#add_publicip_vlan_endip"), thisDialog.find("#add_publicip_vlan_endip_errormsg"), true); //optional
|
||||
isValid &= validateIp("Gateway", $thisDialog.find("#add_publicip_vlan_gateway"), $thisDialog.find("#add_publicip_vlan_gateway_errormsg"));
|
||||
isValid &= validateIp("Netmask", $thisDialog.find("#add_publicip_vlan_netmask"), $thisDialog.find("#add_publicip_vlan_netmask_errormsg"));
|
||||
isValid &= validateIp("Start IP Range", $thisDialog.find("#add_publicip_vlan_startip"), $thisDialog.find("#add_publicip_vlan_startip_errormsg")); //required
|
||||
isValid &= validateIp("End IP Range", $thisDialog.find("#add_publicip_vlan_endip"), $thisDialog.find("#add_publicip_vlan_endip_errormsg"), true); //optional
|
||||
if (!isValid)
|
||||
return;
|
||||
|
||||
thisDialog.dialog("close");
|
||||
//$thisDialog.dialog("close"); //only close dialog when this action succeeds
|
||||
|
||||
var vlan = trim(thisDialog.find("#add_publicip_vlan_vlan").val());
|
||||
var vlan = trim($thisDialog.find("#add_publicip_vlan_vlan").val());
|
||||
if (isTagged) {
|
||||
vlan = "&vlan="+vlan;
|
||||
} else {
|
||||
|
|
@ -872,37 +874,37 @@ function initAddVLANButton($addButton) {
|
|||
|
||||
var scopeParams = "";
|
||||
if(dialogAddVlanForZone.find("#add_publicip_vlan_scope").val()=="account-specific")
|
||||
scopeParams = "&domainId="+trim(thisDialog.find("#add_publicip_vlan_domain").val())+"&account="+trim(thisDialog.find("#add_publicip_vlan_account").val());
|
||||
scopeParams = "&domainId="+trim($thisDialog.find("#add_publicip_vlan_domain").val())+"&account="+trim($thisDialog.find("#add_publicip_vlan_account").val());
|
||||
|
||||
var type = "true";
|
||||
if (getNetworkType() == "vlan")
|
||||
type = trim(thisDialog.find("#add_publicip_vlan_type").val());
|
||||
type = trim($thisDialog.find("#add_publicip_vlan_type").val());
|
||||
|
||||
var gateway = trim(thisDialog.find("#add_publicip_vlan_gateway").val());
|
||||
var netmask = trim(thisDialog.find("#add_publicip_vlan_netmask").val());
|
||||
var startip = trim(thisDialog.find("#add_publicip_vlan_startip").val());
|
||||
var endip = trim(thisDialog.find("#add_publicip_vlan_endip").val());
|
||||
|
||||
var $template1 = $("#vlan_template").clone();
|
||||
if(type == "false") //direct
|
||||
$template1.find("#vlan_type_icon").removeClass("virtual").addClass("direct");
|
||||
else //virtual
|
||||
$template1.find("#vlan_type_icon").removeClass("direct").addClass("virtual");
|
||||
|
||||
if($vlanContainer != null)
|
||||
$vlanContainer.prepend($template1.show());
|
||||
|
||||
var gateway = trim($thisDialog.find("#add_publicip_vlan_gateway").val());
|
||||
var netmask = trim($thisDialog.find("#add_publicip_vlan_netmask").val());
|
||||
var startip = trim($thisDialog.find("#add_publicip_vlan_startip").val());
|
||||
var endip = trim($thisDialog.find("#add_publicip_vlan_endip").val());
|
||||
|
||||
$thisDialog.find("#spinning_wheel").fadeIn("slow");
|
||||
|
||||
$.ajax({
|
||||
data: createURL("command=createVlanIpRange&forVirtualNetwork="+type+"&zoneId="+zoneObj.id+vlan+scopeParams+"&gateway="+encodeURIComponent(gateway)+"&netmask="+encodeURIComponent(netmask)+"&startip="+encodeURIComponent(startip)+"&endip="+encodeURIComponent(endip)),
|
||||
dataType: "json",
|
||||
success: function(json) {
|
||||
vlanJsonToTemplate(json.createvlaniprangeresponse, $template1);
|
||||
success: function(json) {
|
||||
$thisDialog.dialog("close");
|
||||
|
||||
var $template1 = $("#vlan_template").clone();
|
||||
if(type == "false") //direct
|
||||
$template1.find("#vlan_type_icon").removeClass("virtual").addClass("direct");
|
||||
else //virtual
|
||||
$template1.find("#vlan_type_icon").removeClass("direct").addClass("virtual");
|
||||
|
||||
vlanJsonToTemplate(json.createvlaniprangeresponse, $template1);
|
||||
$vlanContainer.prepend($template1);
|
||||
$template1.fadeIn("slow");
|
||||
},
|
||||
error: function(XMLHttpResponse) {
|
||||
handleError(XMLHttpResponse);
|
||||
$template1.slideUp(function(){
|
||||
$(this).remove();
|
||||
});
|
||||
handleErrorInDialog(XMLHttpResponse, $thisDialog);
|
||||
}
|
||||
});
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue