Back to limesurvey.org

Welcome to the LimeSurvey Community Forum

Ask the community, share ideas, and connect with other LimeSurvey users!

Dynamic Textbox

  • Heinrich
  • Heinrich's Avatar Topic Author
  • Offline
  • Senior Member
  • Senior Member
More
6 years 7 months ago #175720 by Heinrich
Dynamic Textbox was created by Heinrich
Hi there,

if there any way to include a dynamic Textbox in limesurvey? The goal is that participants answer a question in a short Textbox. In case they need more characters than actually thought the Textbox should increase the size.

I'm aware of that multiple Textboxes exist, yet, I need the dynamic one because of academic purposes.

Thank you in advance.

Regards
The topic has been locked.
  • Joffm
  • Joffm's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
6 years 7 months ago - 6 years 7 months ago #175721 by Joffm
Replied by Joffm on topic Dynamic Textbox
Hi,
I do not knpw exactly what you mean by "dynamic textbox"

The database representation of a "short text" type is "text". This is: max. 65,535 charcters.
The HTML representation is "input". This is: one line of text.

So your respondnets can type a lot of text; but only in one line.

If you want a representation of more than one line you have to use: "long free text" or "huge free text", which have a handle in the lower right corner to resize them.
The database representation of these type also is "text". This is: max. 65,535 charcters.
So you do not have an advantage in max. characters in the database.
A few days ago there was a thread about this.

Of course, if you use "long" or "huge" free text you have to use a bit of css to have a look and feel like the multiple short text question-

Best regards
Joffm
Volunteers are not paid.
Not because they are worthless, but because they are priceless
Last edit: 6 years 7 months ago by Joffm.
The following user(s) said Thank You: Heinrich
The topic has been locked.
  • Heinrich
  • Heinrich's Avatar Topic Author
  • Offline
  • Senior Member
  • Senior Member
More
6 years 7 months ago #175727 by Heinrich
Replied by Heinrich on topic Dynamic Textbox
Hi,

thank you for your quick reply.

I'm aware of the short, long and huge free text. Also that both can include a maximum of 65,535 characters. However, what I would like to have is the following:

A short text inbox: Individuals start typing and as soon as they hit the end of the line, the textbox resizes such that they can always see the entire text they are typing. In other words: The textbox should increase in size every time the participant would enter a new line.

I do not need more characters. I guess that the maximum amount of characters will be something about 5000 - 10000. So the maximum will never be reached. I just want that the participants can also see the entire text even when only using a small textbox.

I hope I made my needs more understandable?

Thank you!
The topic has been locked.
  • tpartner
  • tpartner's Avatar
  • Away
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
6 years 7 months ago #175731 by tpartner
Replied by tpartner on topic Dynamic Textbox
To be truly dynamic, you will need to use a little JavaScript and CSS. See here for inspiration - codepen.io/vsync/pen/frudD
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
The topic has been locked.
  • Heinrich
  • Heinrich's Avatar Topic Author
  • Offline
  • Senior Member
  • Senior Member
More
6 years 7 months ago #175735 by Heinrich
Replied by Heinrich on topic Dynamic Textbox
Thank you! That's exactly what I need. Is there any guidance on how to implement something like that into Limesurvey?
The topic has been locked.
  • tpartner
  • tpartner's Avatar
  • Away
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
6 years 7 months ago - 6 years 7 months ago #175763 by tpartner
Replied by tpartner on topic Dynamic Textbox
1) Assign a CSS class "with-auto-expand" to a long-text type question.

1) Add this to your custom.js file:
Code:
$(document).on('ready pjax:scriptcomplete',function() {
 
  $('.with-auto-expand textarea').each(function(i) {
    handleTextAreaHeight(this);
  });
 
  $(document).on('keyup change', '.with-auto-expand textarea', function() {
    handleTextAreaHeight(this);
  });
 
  function handleTextAreaHeight(el) {
    $(el).css('min-height', 0);
    $(el).css('min-height', el.scrollHeight+'px');
  }
});

1) Add this to your custom.css file:
Code:
.with-auto-expand textarea {  
  box-sizing: padding-box;
  overflow: hidden;  
  resize: none;  
}

Here is a sample survey with that JS and CSS in the source of the first question.

File Attachment:

File Name: limesurvey...0-23.lss
File Size:16 KB
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Attachments:
Last edit: 6 years 7 months ago by tpartner.
The following user(s) said Thank You: Heinrich
The topic has been locked.
  • Heinrich
  • Heinrich's Avatar Topic Author
  • Offline
  • Senior Member
  • Senior Member
More
6 years 6 months ago #175813 by Heinrich
Replied by Heinrich on topic Dynamic Textbox
This is awesome! Thank you so much. Works like a charm!
The topic has been locked.
Moderators: tpartner, holch

Lime-years ahead

Online-surveys for every purse and purpose

Pricing & Plans
Get started

Legal

About Us

Open Source