Wrap Text in TextBox

Is there currently a way to wrap texts in a textbox object? I am not seeing support for it currently and would like to have it for a printable report.

Hi @Damian,

The Radzen TextBox uses <input type="text"> which doesn't allow text wrapping. For multiline text you can use the TextArea component (which uses the <textarea> element). For printable reports I wouldn't recomment using input components at all. Try with a Label or for full control - the HTML component.

Hey @korchev,

Even with the HTML component when editing the template in a datagrid, I can not get the text to wrap.

HTML code: https://hastebin.com/ayexegaxuk.html

Any guidance would be appreciated.

Was not able to get HTML component to work, though TextArea works fine besides the fact that it doesn't auto scale the amount of rows based on the text, is there a way to change this?

I will need some more info about what you are trying to achieve. Attaching some screenshots of your current setup and desired outcome would definitely help me understand your requirements.

Anyway to edit multiline text you need to use the TextArea component. To display multiline text you would need something like this (used via the HTML component)

<p style="word-wrap: break-word">${data.Property}</p>

Example:


Description Text: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum velit dolor, vestibulum in facilisis id, gravida vitae dolor. Maecenas eu lorem vulputate, sagittis diam at, placerat est.

This is using the provided HTML code posted above. Ideally I would like it to cut off at "dolor" and move over to the next line and continue from there. I was able to get this to work with the TextArea but the main issue I had with that was the height of the TextArea did not adjust based off of how much text there was.

Can you try the suggestion from this SO answer? Radzen uses HTML at the end of the day and obeys the HTML and CSS rules. Make sure your text has new line symbols stored in the database though.