I'm working on a Django project and would like to incorporate a proprietary UI component library that my company created into my application. The library has CSS utility classes for positioning, font, margin, padding, etc. (similar to Tailwind or Bootstrap). These are simple enough to put into a Django template without overhead.
However, I'm struggling with using the library's form/input components (which rely on JSON data as well as HTML).
# html
<custom-select
id="multiple-select-example"
label="State"
placeholder="Choose your state."
multiple
></custom-select>
# js
var multipleSelect = document.getElementById("multiple-select-example");
multipleSelect.options = [{
text: "Pennsylvania",
value: "PA"
}, {
text: "California",
value: "CA"
}, {
text: "Texas",
value: "TX"
}];
In a vacuum, it's easy enough to use Django's "json_script" tag to load JSON directly into the '.options' and process the user's data input in JS. But I feel like this misses out on some of the benefits of using Django's built-in Forms (validation, serialization, etc.). How do I get the best of both worlds? Do I have to create custom form fields in Django? Or custom widgets with media assets? I don't know what to do, everything I do is messy.
Please help.
