From cfebc04ddb34165e2d8adb3275ca138d5092ee9c Mon Sep 17 00:00:00 2001
From: Jessica Wang <jessica@cloud.com>
Date: Sat, 9 Oct 2010 16:28:51 -0700
Subject: [PATCH] new UI - instance page - change service action - fix a bug
 that the dropdown is blank first, then populated with value.

---
 ui/new/jsp/instance.jsp                |  2 ++
 ui/new/scripts/cloud.core2.instance.js | 39 +++++++++++++++++---------
 2 files changed, 28 insertions(+), 13 deletions(-)

diff --git a/ui/new/jsp/instance.jsp b/ui/new/jsp/instance.jsp
index 4f31ba167f7..234c1fedf7b 100644
--- a/ui/new/jsp/instance.jsp
+++ b/ui/new/jsp/instance.jsp
@@ -1010,6 +1010,8 @@
                     <%=t.t("service.offering")%>:</label>
                 <select class="select" id="change_service_offerings">
                 </select>
+                <div id="change_service_offerings_errormsg" class="dialog_formcontent_errormsg" style="display: none;">
+                </div>
             </li>
         </ol>
         </form>
diff --git a/ui/new/scripts/cloud.core2.instance.js b/ui/new/scripts/cloud.core2.instance.js
index 9cefd3fbb71..260b49c1e18 100644
--- a/ui/new/scripts/cloud.core2.instance.js
+++ b/ui/new/scripts/cloud.core2.instance.js
@@ -1056,13 +1056,15 @@ function doChangeName($actionLink, selectedItemsInMidMenu) {
 	$("#dialog_change_name")
 	.dialog('option', 'buttons', { 						
 		"OK": function() { 			    
-		    var thisDialog = $(this);	
-		    thisDialog.dialog("close"); 
+		    var thisDialog = $(this);			    
 		    											
 			// validate values
 	        var isValid = true;					
 	        isValid &= validateString("Name", thisDialog.find("#change_instance_name"), thisDialog.find("#change_instance_name_errormsg"));								
-	        if (!isValid) return;								
+	        if (!isValid) 
+	            return;	
+	        
+	        thisDialog.dialog("close"); 							
 			
 			var name = trim(thisDialog.find("#change_instance_name").val());
 			
@@ -1100,13 +1102,15 @@ function doChangeGroup($actionLink, selectedItemsInMidMenu) {
 	$("#dialog_change_group")
 	.dialog('option', 'buttons', { 						
 		"OK": function() { 	
-		    var thisDialog = $(this);
-	        thisDialog.dialog("close"); 
-													
+		    var thisDialog = $(this);	        
+											
 			// validate values
 	        var isValid = true;					
 	        isValid &= validateString("Group", thisDialog.find("#change_group_name"), thisDialog.find("#change_group_name_errormsg"), true); //group name is optional								
-	        if (!isValid) return;
+	        if (!isValid) 
+	            return;
+	        
+	        thisDialog.dialog("close"); 
 	        
 	        for(var id in selectedItemsInMidMenu) {				
 	            var $midMenuItem = selectedItemsInMidMenu[id];
@@ -1144,6 +1148,7 @@ function doChangeService($actionLink, selectedItemsInMidMenu) {
 	$.ajax({	   
 	    data: createURL(apiText), 
 		dataType: "json",
+		async: false,
 		success: function(json) {
 			var offerings = json.listserviceofferingsresponse.serviceoffering;
 			var offeringSelect = $("#dialog_change_service_offering #change_service_offerings").empty();
@@ -1160,8 +1165,14 @@ function doChangeService($actionLink, selectedItemsInMidMenu) {
 	$("#dialog_change_service_offering")
 	.dialog('option', 'buttons', { 						
 		"OK": function() { 
-		    var thisDialog = $(this);
-			thisDialog.dialog("close"); 
+		    var $thisDialog = $(this);
+		    		   
+		    var isValid = true;				
+			isValid &= validateDropDownBox("Service Offering", $thisDialog.find("#change_service_offerings"), $thisDialog.find("#change_service_offerings_errormsg"));	
+			if (!isValid) 
+			    return;
+		    
+			$thisDialog.dialog("close"); 
 			
 			for(var id in selectedItemsInMidMenu) {				
 			    var $midMenuItem = selectedItemsInMidMenu[id];
@@ -1171,7 +1182,7 @@ function doChangeService($actionLink, selectedItemsInMidMenu) {
                     $midMenuItem.data("afterActionInfo", ($actionLink.data("label") + " action failed. Reason: virtual instance needs to be stopped before you can change its service."));  
 		            continue;
 	            }
-                var apiCommand = "command=changeServiceForVirtualMachine&id="+id+"&serviceOfferingId="+thisDialog.find("#change_service_offerings").val();	     
+                var apiCommand = "command=changeServiceForVirtualMachine&id="+id+"&serviceOfferingId="+$thisDialog.find("#change_service_offerings").val();	     
                 doActionForMidMenu(id, $actionLink, apiCommand);
             }
 		}, 
@@ -1517,14 +1528,16 @@ function doCreateTemplateFromVmVolume($actionLink, $subgridItem) {
 	$("#dialog_create_template")
 	.dialog('option', 'buttons', { 						
 		"OK": function() { 		
-		    var thisDialog = $(this);
-		    thisDialog.dialog("close"); 
+		    var thisDialog = $(this);		    
 									
 			// validate values
 	        var isValid = true;					
 	        isValid &= validateString("Name", thisDialog.find("#create_template_name"), thisDialog.find("#create_template_name_errormsg"));
 			isValid &= validateString("Display Text", thisDialog.find("#create_template_desc"), thisDialog.find("#create_template_desc_errormsg"));			
-	        if (!isValid) return;		
+	        if (!isValid) 
+	            return;		
+	        
+	        thisDialog.dialog("close"); 
 	        
 	        var name = trim(thisDialog.find("#create_template_name").val());
 			var desc = trim(thisDialog.find("#create_template_desc").val());