crucialfelix / django-ajax-selects

jQuery UI-powered auto-complete fields for ForeignKey, ManyToMany and text fields
Other
824 stars 248 forks source link

Warning a parser-blocking crose site script #284

Closed mLamneck closed 11 months ago

mLamneck commented 3 years ago

I just installed django-alax-selects and I noticed the following warnings in the console of the browser when loading pages with ajax-selects widgets.

ajaxSelectWarning

I see this warning when loading django's admin panel and also outside of the admin panel. The warning is caused by the loadJs, loadCss procedures in the bootstrap.js file.

Is there a way to get rid of this warnings?

crucialfelix commented 3 years ago

It would probably be better to include the minimized libraries and serve it off the same site. The original implementation was done at a time when we all switched to using public CDNs for public libraries in the name of caching and speed.

A pull request from anybody would be very welcome.

1john commented 3 years ago

I believe I am seeing the same issue. Plus (possibly due to a slower connection) the JS requests are being blocked entirely and the form fields are not displaying suggestions at all.

Console Errors

Currently getting around it by loading the needed JS in the top level template base.html so django-ajax-selects bootstrap.js doesn't have to worry about it, but a better solution would be nice!

mLamneck commented 3 years ago

I already tried to load the required js files myself before the form.media. I don't understand why but this only worked if I did the includes twice before the form.media. With one include I got the same warnings. If I do the loadJs and loadCss calls in bootstrap.js with a path to the ajax-select static folder and put the required files there, it works without the warnings. I don't know if this is what crucialfelix ment and if this is a good solution but it seems to work. Now I include in my bodytag the following things. Without the include of the admin css file the + symbol next to the autocompletefields doesn't appear and it's simply written add. I also don't know if this is correct. According to the documentation, I think it should work without this.

<link rel="stylesheet" type="text/css" href="{% static 'admin/css/base.css'%}">
<script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
{{form.media}}
crucialfelix commented 11 months ago

I've now included all the assets in a vendor folder. So this error won't happen anymore.

You still have the option to set an explicit jquery-ui theme (if you use themeroller)

So this is now solved (when I do the release)