fixes long names in columns dropdown [fixes SCI-784]

app/assets/javascripts/samples/sample_datatable.js.erb

@@ -841,6 +841,7 @@ function changeToEditMode() {
             '</span>');
         },
         success: function(data) {
+          debugger;
           var form = $('#new-column-form');
           form.find('.help-block').remove();
           if (form.hasClass('has-error')) {
@@ -857,8 +858,8 @@ function changeToEditMode() {
             'data-editable data-deletable ' +
             'data-edit-url="' + data.edit_url + '" ' +
             'data-destroy-html-url="' + data.destroy_html_url + '"' +
-            '>' +
-            data.name + '</th>');
+            '>' + truncateLongString(data.name,
+              <%= Constants::NAME_TRUNCATION_LENGTH_DROPDOWN %>) + '</th>');
           var colOrder = table.colReorder.order();
           colOrder.push(colOrder.length);
           // Remove all event handlers as we re-initialize them later with
@@ -936,7 +937,8 @@ function changeToEditMode() {
           'class="' + visLi + '"' +
           '>' +
           '<i class="grippy"></i> ' +
-          '<span class="text">' + el.innerText + '</span> ' +
+          '<span class="text">' + truncateLongString(el.innerText,
+            <%= Constants::NAME_TRUNCATION_LENGTH_DROPDOWN %>) + '</span> ' +
           '<input type="text" class="text-edit form-control" style="display: none;" />' +
           '<span class="pull-right controls">' +
           '<span class="ok glyphicon glyphicon-ok" style="display: none;"></span>' +
@@ -1032,7 +1034,8 @@ function changeToEditMode() {
         data: {custom_field: {name: newName}},
         dataType: 'json',
         success: function() {
-          text.text(newName);
+          text.text(truncateLongString(newName,
+            <%= Constants::NAME_TRUNCATION_LENGTH_DROPDOWN %>));
           $(table.columns().header()).filter('#' + id).text(newName);
           cancelEditMode();
         },

app/assets/javascripts/sitewide/string_utils.js

@@ -2,15 +2,24 @@
  * Truncate long strings where is necessary.
  */
 function truncateLongString( el, chars ) {
-  var input = $.trim(el.text());
+  if($.type(el) !== 'string'){
+    var input = $.trim(el.text());
+  } else {
+    var input = $.trim(el);
+  }
 
   var html = "";
-  if( el.children().hasClass("glyphicon") ){
+  if( $.type(el) !== 'string' &&
+      el.children().hasClass("glyphicon")) {
     html = el.children()[0];
   }
 
   if( input.length >= chars ){
-    var newText = el.text().slice(0, chars);
+    if($.type(el) != 'string') {
+      var newText = el.text().slice(0, chars);
+    }else {
+      var newText = el.slice(0, chars);
+    }
     for( var i = newText.length; i > 0; i--){
       if(newText[i] === ' ' && i > 10){
         newText = newText.slice(0, i);
@@ -21,8 +30,14 @@ function truncateLongString( el, chars ) {
     if ( html ) {
       el.html(html.outerHTML + newText + '...' );
     } else {
+      if($.type(el) === 'string'){
+        return newText + '...';
+      } else {
       el.html(newText + '...' );
+      }
     }
+  } else {
+    return el;
   }
 }
 

config/initializers/constants.rb

@@ -9,6 +9,8 @@ class Constants
   NAME_MAX_LENGTH = 255
   # Max characters for short text fields, after which they get truncated
   NAME_TRUNCATION_LENGTH = 25
+  # Max characters for short text fields, in dropdownList
+  NAME_TRUNCATION_LENGTH_DROPDOWN = 20
   # Max characters for long text fields
   TEXT_MAX_LENGTH = 10000
   # Max characters for rich text fields (in html format)