add script to external script file to handle SCP

[millerthegorilla]

Hi, I am currently using bootstrap 5 imports with crispyforms bootstrap4 template, and everything is just about working fine.

However, I am having problems with the file input as it has an inline script attached to it, and Content Security Protection is complaining in Chrome that it can't load that inline script without me relaxing CSP rules. To overcome this, I wonder if the bootstrap 5 template pack could be accompanied by an external script file, to handle cases like the file field.

Btw, did you get anywhere with the floating field? I have a desire to upgrade my web app to bootstrap5 crispy forms template, but I am worried that a whole load of functionality is going to be missing, like floating fields and file inputs.

[smithdc1]

For Bootstrap 4 we had to package some JavaScript so that it would 'just work'. This input is improved in Bootstrap 5 and we don't need the extra JS. See #15.

I'm therefore not sure why you are seeing the extra JS? It sounds like you're picking up the BS4 input 🤔

Worth noting that the file input in this template pack reverts to Django's own rendering for clearable inputs.

On the floating field, I'll try and have a look later to remind myself where we got to with this. Not had time lately to come back round to this.

[millerthegorilla]

Coolio. I am using bootstrap 4 template with bootstrap 5 imports, because the bootstrap 5 template pack didn't have floating fields. I spent all day today creating and debugging a custom clearable file input, and discovered along the way that the bootstrap 5 file input just works, so no need for JavaScript.

It took me a while to understand how to get the clear checkbox working and also obtain a reference to the label that would allow me to customise the file path shown.

Most of my time went on an error of mine, though, now fixed.

It would be nice to see a bit more documentation about creating custom fields. Happy to help, if I can.

[millerthegorilla]

For example, I caught the filepath and edited it in my custom field..

class FileClearInput(Field):
    template = 'fields/artisan_file_clear_input.html'
    def render(self, form, form_style, context, template_pack='bootstrap4', extra_context=None, **kwargs):
        context['path']=str(form['image_file'].value()).split('/')[-1]
        return super().render(form, form_style, context, template_pack, extra_context, **kwargs)