How to customize a textarea field?

Question

I have created a textarea field using admin ui. It allows users to add Bio to their profile. I want to do 2 things with this field.

1. Limit the characters to 255.
2. Use a text format. Note: I do not want to allow users to choose a text format.

Answer 1

With HTML5 on Drupal 7 no JS is necessary if we can add a maxlength attribute to the textarea tag.

I tried to use a hook_form_alter to set this attribute, something like

$form['field_NAME'][LANGUAGE_NONE][0]['#attributes'] = array('maxlength' => 220);

or

$form['field_NAME'][LANGUAGE_NONE][0]['#maxlength'] = 220;

...and a gazillion variations using dsm($form) for ideas and to check my results. I could easily change the $form['field_name'] values but my textarea failed to acquire the maxlength atttribute.

This worked:

/**
 * Implements hook_field_widget_WIDGET_TYPE_form_alter().
 * Add a maxlength attribute to field_NAME.
 */
function MYMODULE_field_widget_text_textarea_form_alter(&$element, &$form_state, $context) {
  if (isset($element['#field_name']) && ($element['#field_name'] == 'field_NAME')) {
    $element['value']['#attributes'] = array('maxlength' => 220);
  }
}

Answer 2

For anyone who lands here like I did looking for a way to set maxlength in a Drupal 8 textarea, this worked for me using form_alter:

$form['field_NAME']['widget'][0]['value']['#maxlength'] = 220; 

Here is an example using a custom module:

function mymodule_form_node_form_alter(&$form, FormStateInterface $form_state, $form_id) {
    $node = $form_state->getFormObject()->getEntity(); //gets the node
    if ($node->getType() == 'mynode') { //check that it is the node where I want this
        $form['field_NAME']['widget'][0]['value']['#maxlength'] = 220; 
    }
}

Answer 3

There are two modules which can do what you are wanting:

1. Better formats can hide the filter per role.
2. Field validation can add additional validation to the field.

Answer 4

We can limit the character count to 255 with jQuery validation

  $max_length = 500; // 500 chars max (should pull this from a config var)
  $form['my_textarea'] = array(
    '#type' => 'textarea',
    '#title' => t('Body'),
    '#default_value' => $node->body,
    '#required' => TRUE,
    '#description' => t('The main body text of your entry.  Please note that this is limited to %limit characters or less.', array('%limit'=>$max_length)),
    // this is the item to be added - limit length while typing
    '#attributes'=>array('onKeyPress'=>"return(this.value.length<$max_length);),    
  );

Create a JS file and add it using drupal_add_js:

  drupal_add_js(drupal_get_path('module', 'mymodule'). '/myfile.js');

Inside myfile.js define the following function:

function textareaMaxLength(field, evt, limit) {
  var evt = (evt) ? evt : event;
  var charCode =
    (typeof evt.which != "undefined") ? evt.which :
   ((typeof evt.keyCode != "undefined") ? evt.keyCode : 0);

  if (!(charCode >= 13 && charCode <= 126)) {
    return true;
  }

  return (field.value.length < limit);
}

php validation

function myform_validate($form_id, $edit) {
  if (strlen($edit['text']) > 200) {
    form_set_error('text', t('Your text contains more than 200 characters'));
  }
}

Reference: https://www.drupal.org/node/80122

Answer 5

If you are using Drupal 8, you could put this together pretty fast with:

• Better Formats (limits filter formats per field, by role)
• CKEditor Wordcount (doesn't do server side validation, but provides simple client side validation)

CKEditor Wordcount has the bonus of not counting HTML tags as characters which works well in the context of a WYSIWYG. I suppose you could add the Field Validation module in here as well, but for this use case, Field Validation would also have to ignore incoming HTML tags when counting characters so that the validations match up.

Better Formats will let you select, per field with text formatting on it, what roles should have access to which filters. If you only select 1 filter, they will not see a filter format drop down at all.