Required field and click enter mobile chrome

[visavi]

I liked the script, but I noticed some errors when implementing

1. Not working required, I saw the commit 1447a55
   Adding this attribute does not display information about what is required

2. In the mobile version of chrome android, inserting a tag by clicking on enter does not work
   Although you wrote that you fixed https://github.com/lekoala/bootstrap5-tags/releases/tag/1.4.17 I looked at the demo page

3. If you start writing text in the input field, then select it with the mouse and continue writing (rewriting the text), then the text is not written, the first time this error is reproduced immediately

4. When you click on the [label for="id"] or when clicking on the field the highlight is not activated like on classes (blue frame)
   respectively, it is not possible to apply classes is-valid is-invalid

You didn’t think maybe implementing NOT through a [select] could solve most of the problems
as an example here https://bootstrap-tagsinput.github.io/bootstrap-tagsinput/examples/

[lekoala]

@visavi hey thanks for your feedback

i'll check these issues if you find solutions in the meantime let me know

using a select itself should not be a major issue (and I do want to keep the basic features working with js disabled) but looking back at how i did things, i would certainly do it otherwise now :-) maybe that's for the v2

[lekoala]

@visavi not sure i get what you mean by 1. => required only triggers on submit. please try to submit and you will see it's updated properly (it does on the demo)

[lekoala]

@visavi regarding 3. => rewriting is not supported. if you select something, it is a set value.

[lekoala]

@visavi you can give a try at https://github.com/lekoala/bootstrap5-tags/releases/tag/1.4.40 and tell me what you think

[visavi]

@lekoala 1. The "required" field works, but does not display a hint, that is, it is not clear that you need to enter data

2. before that, I tested with android on the demo page there and then and now there was a problem, the enter key did not work
   now I have installed the new version 1.4.40 and also the previous one
   It turns out that everything worked fine on the previous one, apparently the demo version is not updated

But on 1.4.40 now there is a problem, if you write the word Hello, then each letter will be like a tag

3. ok, it's not critical, you can work with it

4. In this version, when you click on the label, the focus is placed on the field, everything is ok, but there is no visual effect, blue highlight around the field
   It's not really critical either.
   

[lekoala]

@visavi mhh indeed this mobile android thing is tricky. i reverted the change and added a workaround to get the proper keycode. it seems that enter is supported by default but still that can be helpful

indeed, i missed the focus support. it's not easy since we need to have a :focus on the form-control. I added a class that can help with it but you need to implement it yourself (see .scss file)

otherwise, regarding the required hint, that's not expected to be(as it is the case in bootstrap). it's up to you to do it in css with after pseudo selector for example

https://github.com/lekoala/bootstrap5-tags/releases/tag/1.4.41
this hopefully should solve issues

[visavi]

@lekoala Everything works fine, everything is fine with focus too

Regarding the required field, apparently it will not be possible to solve the problem in the current version

[lekoala]

Regarding the required field, apparently it will not be possible to solve the problem in the current version

what do you mean ? while it's not built in, it's easy to add with css but it all depends on how you want it to look :-) if you have an example that would help

[visavi]

Can you please tell me if it is possible to insert a tag on click outside the field?

[lekoala]

@visavi sure, that should be possible. listen to blur and use getInstance then call addItem

[visavi]

I mean, if I started writing a word in the input field, and then without pressing enter I clicked outside the field
It would be nice if there was such a setting.

[lekoala]

@visavi i see
i added two ways of doing this: a native setting (add-on-blur, see readme) and an event you can use if you have any specific business logic (see demo.html)
https://github.com/lekoala/bootstrap5-tags/releases/tag/1.4.42

[visavi]

@lekoala Everything works great, thanks