Implement better select handling and tests

common/test/acceptance/pages/lms/instructor_dashboard.py

@@ -210,7 +210,7 @@ class MembershipPageCohortManagementSection(PageObject):
         """
         selector_query = self.q(css=self._bounded_selector(self.content_group_selector_css))
         return [
-            option.text for option in get_options(selector_query) if option.text != ""
+            option.text for option in get_options(selector_query) if option.text != "Not selected"
         ]
 
     def get_cohort_associated_content_group(self):

lms/static/js/groups/views/cohort_form.js

@@ -55,10 +55,14 @@ var edx = edx || {};
             this.$('.input-cohort-group-association').prop('disabled', !groupsEnabled);
         },
 
+        hasAssociatedContentGroup: function() {
+            return this.$('.radio-yes').prop('checked');
+        },
+
         getSelectedContentGroup: function() {
             var selectValue = this.$('.input-cohort-group-association').val(),
                 ids, groupId, userPartitionId, i, contentGroup;
-            if (!this.$('.radio-yes').prop('checked') || selectValue === 'None') {
+            if (!this.hasAssociatedContentGroup() || selectValue === 'None') {
                 return null;
             }
             ids = selectValue.split(':');
@@ -78,45 +82,61 @@ var edx = edx || {};
             return cohortName ? cohortName.trim() : this.model.get('name');
         },
 
-        showMessage: function(message, type) {
+        showMessage: function(message, type, details) {
             this.showNotification(
-                {type: type || 'confirmation', title: message},
+                {type: type || 'confirmation', title: message, details: details},
                 this.$('.form-fields')
             );
         },
 
+        validate: function(fieldData) {
+            var errorMessages;
+            errorMessages = [];
+            if (!fieldData.name) {
+                errorMessages.push(gettext('You must specify a name for the cohort group'));
+            }
+            if (this.hasAssociatedContentGroup() && fieldData.group_id === null) {
+                if (this.$('.input-cohort-group-association').val() === 'None') {
+                    errorMessages.push(gettext('You did not select a cohorted content group'));
+                } else {
+                    // If a value was selected, then it must be for a non-existent/deleted content group
+                    errorMessages.push(gettext('The selected cohorted content group does not exist'));
+                }
+            }
+            return errorMessages;
+        },
+
         saveForm: function() {
             var self = this,
                 cohort = this.model,
                 saveOperation = $.Deferred(),
-                isUpdate = this.model.id !== null,
-                cohortName, selectedContentGroup, showErrorMessage;
+                isUpdate = !_.isUndefined(this.model.id),
+                fieldData, selectedContentGroup, errorMessages, showErrorMessage;
+            showErrorMessage = function(message, details) {
+                self.showMessage(message, 'error', details);
+            };
             this.removeNotification();
-            showErrorMessage = function(message) {
-                self.showMessage(message, 'error');
+            selectedContentGroup = this.getSelectedContentGroup();
+            fieldData = {
+                name: this.getUpdatedCohortName(),
+                group_id: selectedContentGroup ? selectedContentGroup.id : null,
+                user_partition_id: selectedContentGroup ? selectedContentGroup.get('user_partition_id') : null
             };
-            cohortName = this.getUpdatedCohortName();
-            if (cohortName.length === 0) {
-                showErrorMessage(gettext('Enter a name for your cohort group.'));
+            errorMessages = this.validate(fieldData);
+            if (errorMessages.length > 0) {
+                showErrorMessage(
+                    isUpdate ? gettext("The cohort group cannot be saved")
+                        : gettext("The cohort group cannot be added"),
+                    errorMessages
+                );
                 saveOperation.reject();
             } else {
-                selectedContentGroup = this.getSelectedContentGroup();
                 cohort.save(
-                    {
-                        name: cohortName,
-                        group_id: selectedContentGroup ? selectedContentGroup.id : null,
-                        user_partition_id: selectedContentGroup ? selectedContentGroup.get('user_partition_id') : null
-                    },
-                    {patch: isUpdate}
+                    fieldData, {patch: isUpdate}
                 ).done(function(result) {
-                    if (!result.error) {
-                        cohort.id = result.id;
-                        self.render();    // re-render to remove any now invalid error messages
-                        saveOperation.resolve();
-                    } else {
-                        showErrorMessage(result.error);
-                        saveOperation.reject();
-                    }
+                    cohort.id = result.id;
+                    self.render();    // re-render to remove any now invalid error messages
+                    saveOperation.resolve();
                 }).fail(function(result) {
                     var errorMessage = null;
                     try {

lms/templates/instructor/instructor_dashboard_2/cohort-form.underscore

@@ -27,13 +27,14 @@
             <%
             var foundSelected = false;
             var selectedContentGroupId = cohort.get('group_id');
+            var selectedUserPartitionId = cohort.get('user_partition_id');
             var hasSelectedContentGroup = selectedContentGroupId != null;
             var hasContentGroups = contentGroups.length > 0;
             %>
             <div class="form-field">
                 <div class="cohort-management-details-association-course field field-radio">
                     <h4 class="form-label">
-                        <%- gettext('Associate this cohort group with a content group') %>
+                        <%- gettext('Associated Cohorted Content Group') %>
                     </h4>
                     <label><input type="radio" class="radio-no" name="cohort-association-course" value="no"  <%- !hasSelectedContentGroup ? 'checked="checked"' : '' %>/> <%- gettext("No Content Group") %></label>
                     <div class="input-group has-other-input-text">
@@ -42,7 +43,7 @@
                             <div class="input-group-other">
                                 <label class="sr" for="cohort-group-association"><%- gettext("Choose a content group to associate") %></label>
                                 <select name="cohort-group-association" class="input input-lg has-option-unavailable input-cohort-group-association" <%- !hasSelectedContentGroup ? 'disabled="disabled"' : '' %>>
-                                    <option value="None"></option>
+                                    <option value="None" <%- !hasSelectedContentGroup ? 'selected="selected"' : '' %> disabled="disabled"><%- gettext("Not selected") %></option>
 
                                     <%
                                     var orderedContentGroups = _.sortBy(
@@ -64,7 +65,7 @@
                                     %>
 
                                     <% if (hasSelectedContentGroup && !foundSelected) { %>
-                                        <option value="<%- contentGroupId %>:<%- contentGroupUserPartitionId %>" class="option-unavailable" selected="selected"><%- gettext("Deleted Content Group") %></option>
+                                        <option value="<%- selectedContentGroupId %>:<%- selectedUserPartitionId %>" class="option-unavailable" selected="selected"><%- gettext("Deleted Content Group") %></option>
                                     <% } %>
                                 </select>