Fix Create Image angularjs code

This code intended to allow pre-filling of the form values through
Django's handling of GET parameters, but it did not do so as the
code was incorrect. This was not previously noticed as the angularjs
code wasn't actually being executed. Once it was, it broke. Ironic,
I know.

Change-Id: I8d641de9246fd4f43c96bf85d47bb648f4401def
Closes-Bug: 1503396

openstack_dashboard/dashboards/project/images/images/forms.py

@@ -101,27 +101,29 @@ class CreateImageForm(forms.SelfHandlingForm):
         widget=forms.Select(attrs={
             'class': 'switchable',
             'data-slug': 'source'}))
+    image_url_attrs = {
+        'class': 'switched',
+        'data-switch-on': 'source',
+        'data-source-url': _('Image Location'),
+        'ng-model': 'ctrl.copyFrom',
+        'ng-change': 'ctrl.selectImageFormat(ctrl.copyFrom)'
+    }
     image_url = ImageURLField(label=_("Image Location"),
                               help_text=_("An external (HTTP/HTTPS) URL to "
                                           "load the image from."),
-                              widget=forms.TextInput(attrs={
+                              widget=forms.TextInput(attrs=image_url_attrs),
-                                  'class': 'switched',
-                                  'data-switch-on': 'source',
-                                  'data-source-url': _('Image Location'),
-                                  'ng-model': 'copyFrom',
-                                  'ng-change':
-                                  'ctrl.selectImageFormat(copyFrom)'}),
                               required=False)
+    image_attrs = {
+        'class': 'switched',
+        'data-switch-on': 'source',
+        'data-source-file': _('Image File'),
+        'ng-model': 'ctrl.imageFile',
+        'ng-change': 'ctrl.selectImageFormat(ctrl.imageFile.name)',
+        'image-file-on-change': None
+    }
     image_file = forms.FileField(label=_("Image File"),
                                  help_text=_("A local image to upload."),
-                                 widget=forms.FileInput(attrs={
+                                 widget=forms.FileInput(attrs=image_attrs),
-                                     'class': 'switched',
-                                     'data-switch-on': 'source',
-                                     'data-source-file': _('Image File'),
-                                     'ng-model': 'imageFile',
-                                     'ng-change':
-                                     'ctrl.selectImageFormat(imageFile.name)',
-                                     'image-file-on-change': None}),
                                  required=False)
     kernel = forms.ChoiceField(
         label=_('Kernel'),

openstack_dashboard/static/app/tech-debt/image-form.controller.js

@@ -21,8 +21,8 @@
   function ImageFormController() {
     var ctrl = this;
 
-    ctrl.copyFrom = angular.element('.image_url').val();
+    ctrl.copyFrom = angular.element('#id_image_url').val();
-    ctrl.diskFormat = angular.element('.disk_format').val();
+    ctrl.diskFormat = angular.element('#id_disk_format option:selected').val();
     ctrl.selectImageFormat = function (path) {
       if (!path) { return; }
       var format = path.substr(path.lastIndexOf(".") + 1).toLowerCase().replace(/[^a-z0-9]+/gi, "");

openstack_dashboard/static/app/tech-debt/image-form.controller.spec.js

@@ -19,7 +19,7 @@
   describe('horizon.app.tech-debt.ImageFormController', function() {
 
     var $document, controller;
-    var gzHtml = '<div id="id_disk_format"><input class="disk_format" value="gz"></input></div>';
+    var gzHtml = '<select id="id_disk_format"><option value="gz"></option></select>';
 
     beforeEach(module('horizon.app.tech-debt'));
     beforeEach(inject(function($injector) {
@@ -32,19 +32,20 @@
     }
 
     it('should set copyFrom', function() {
-      $document.find('body').append('<input class="image_url" value="ImageUrl"></input>');
+      $document.find('body').append('<input id="id_image_url" value="ImageUrl"></input>');
 
       var ctrl = createController();
       expect(ctrl.copyFrom).toEqual('ImageUrl');
-      $document.find('.image_url').remove();
+      $document.find('#id_image_url').remove();
     });
 
     it('should set diskFormat', function() {
-      $document.find('body').append('<input class="disk_format" value="DiskFormat"></input>');
+      $document.find('body').append('<select id="id_disk_format"><option selected>' +
+        'DiskFormat</option></select>');
 
       var ctrl = createController();
       expect(ctrl.diskFormat).toEqual('DiskFormat');
-      $document.find('.disk_format').remove();
+      $document.find('#id_disk_format').remove();
     });
 
     it('should set image format to detected format', function() {