You are viewing limited content. For full access, please sign in.

Question

Forms

Updated June 16, 2021

asked on June 16, 2021

If I have a re-sizeable multi-line in forms, which has a handle like this to allow the user to resize it

And I hide it with a field rule, then show it, it collapses into the tiniest object.

I am using the jquery method for applying the re-sizeable feature since it is not an option under the Edit menu

//add ability for user to resize multi-line areas
$(document).ready(function(){
  
  $( ".resize textarea" ).resizable();

});

1 0

Answer

SELECTED ANSWER

replied on June 16, 2021 • Show version history

Use CSS instead of JavaScript. The JQuery is probably reacting poorly to the field being hidden.

.resize textarea {
  resize: both !important;
}

The !important will make sure it overrides the value set in the base CSS for the form, but this is the CSS the form applies by default.

So !important isn't technically necessary if you just create a more specific selector like so

.cf-formwrap .form-q.resize textarea {
  resize: both;
}

1 0

replied on June 16, 2021

Thanks! This works, I had originally tried this but without the important part, so I thought it was no good.

0 0