search

radiac / django-tagulous

Fabulous Tagging for Django
http://radiac.net/projects/django-tagulous/
Other
336 stars 66 forks source link

Remove dependency on jquery #163

Open BoPeng opened 2 years ago

BoPeng commented 2 years ago

After updating our website to bootstrap 5, django-tagulous becomes the only component that depends on jquery. It would be nice if django-tagulous could be updated to use vanilla JS.

I understand django-tagulous largely depends on select2 (which is based on jquery), but maybe another select library could be used (e.g. Choices although I have never used it.)

radiac commented 2 years ago

It would be nice to drop the jQuery dependency, but last time I checked I couldn't find an off-the-shelf vanilla js control which did everything we need. It has been a while though, so may be worth another look.

It may make sense to keep Select2 for Django admin - last time I checked it used select2 for fk autocomplete.

Tagulous is designed to support swappable controls though - in theory we just need to find a lib which supports tags and hooks for tag parsing, then we can write an adaptor for it and tell tagulous which one to use in the settings.

A home-grown autocomplete would be another option - I wrote one in an early version - but to be honest that sounds like a commitment I probably don't have time to build and support at the moment.

BoPeng commented 2 years ago

On the surface Choices has all the features that we need (see the demo ), could you please have a look at its API and see if it fits out need and is relatively easy to write an adaptor for it?

radiac commented 2 years ago

I started a branch this evening (feature/choices-js) but have now remembered the issue: I can't see a way to pre-populate a text field with choices (for some reason the "choices" option only works with <select> and <select multiple>), nor a way to have a select field accept new values. In other words, I can't see a way to autocomplete on a field that also lets you add new values.

It looks like other people have requested this in the past - notably https://github.com/Choices-js/Choices/pull/525 and https://github.com/Choices-js/Choices/pull/856 which both seem to add options to a select. From a backend perspective it would make more sense to me to show choices on a text, so that approach may be worth investigating too - but given the age of those PRs I'm not hopeful they or anything we did would be merged soon, so we'd be looking at having to fork it, which doesn't seem ideal.

This feels like such an obvious use case that I'm hoping I've just missed an option somewhere. I've started using choices.js in other projects where I'm not currently using Tagulous, so this is definitely something I'd like to achieve, but at the moment I just can't see a practical way forward - looking at the complexity of the source for choices, it almost feels easier to write my own.

Note to anyone looking at this in the future: assuming we can get round this autocomplete issue, the next problem will be tag parsing. They don't support quoted tags, so there will be a potential inconsistency between the client and server parsers which will need to be tested carefully. If it is a problem and we want to use the Tagulous.parseTags function on user input, I can't see a hook to override their tokeniser but there's probably a way around it by trying to hijack the event listener.