115
Views
6
Comments
Solved
[Tagify] Tagify: Dynamically increase the height of input box
Question
tagify
Web icon
Forge asset by Fortrevo

I am using Tagify to input free text in the form of Tags in my web application, after adding a few entries, the tags start overflowing from the input box, is there any way to dynamically increase the height of text to fit the content inside input box


Capture44.PNG
2019-06-15 21-39-22
Afonso Carvalho
 
MVP
Solution

Hi Vaibhav,

Sorry for the delay, the week has been a little more busy than what I was expecting. I uploaded a new component and demo with the changes we discussed. Let me know what you think!

2019-06-15 21-39-22
Afonso Carvalho
 
MVP

Hi Vaibhav,

That's the default behaviour for Tagify: fields should grow and shrink as needed. It's working in the demo:

You can try at afonsobc.outsystemscloud.com/TagifyDemo. I suspect there should be some specific issue in your Screen outside of Tagify. Do you think you could share an OML with an example of the problem, for everyone to look over?

2022-07-22 00-04-14
Vaibhav157

Hi Afonso,

I have attached the OML with this post.

I have one more question, can we get rid of "Add <EnteredText>" suggestion box while making an input?



Thanks in advance.

TagifyDemoApp.oml
2019-06-15 21-39-22
Afonso Carvalho
 
MVP

It's the BaseTheme. it sets a fixed height of 40px for anything with the "input" class, which Tagify uses:


Try setting this class in your Theme and it should be fixed:

tags.input {

height: initial;

}

It will affect all <tags> elements with the input class, which should be just Tagify. Otherwise, you might have to change it to be more specific.

About the Add helper behaviour, not right now. I can add an input to control this behaviour, but by default it's displayed if IsAllowNewOptions is True. If you need a solution right now, you can check the transformTag option inside the Javascript of the Tagify webblock and adapt it. 

Or give me a couple of days and I'll push a new version out.


2022-07-22 00-04-14
Vaibhav157

Thank you Afonso, I am looking forward to see a new version with option to control Add helper feature.

I found two more issues,

1. When hitting save button, it displays duplicate inputs in red background for a moment.

2. After deleting an element from list, when you click on save, the deleted element still gets displayed in the input box. 


2019-06-15 21-39-22
Afonso Carvalho
 
MVP

Thank you, I've managed to reproduce both issues. The second one looks demo-specific but I'll need to investigate the first one. I'll do a set of fixes and I'll let you know once I have a new version.

2019-06-15 21-39-22
Afonso Carvalho
 
MVP
Solution

Hi Vaibhav,

Sorry for the delay, the week has been a little more busy than what I was expecting. I uploaded a new component and demo with the changes we discussed. Let me know what you think!

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.