django-autocomplete-light
django-autocomplete-light copied to clipboard
cannot use select2 on grappelli admin dashboard
Hi,
I used from autocomplete light in grappelli dashboard but i got this error when load page,
Uncaught TypeError: $(...).select2 is not a function select2.js:8!!!!
how can i fix this?!
Looks like a JS loading issue, we should have a settings file with grappeli support in the test_project, and we'd be able to run our functional test suite on it, parhaps @mpasternak would be interrested in helping ?
For me the same issue using standard admin. In particular without indicating any jquery in admin class I have
Select2: An instance of jQuery or a jQuery-compatible library was not found. Make sure that you are including jQuery before Select2 on your web page.
If you move it like this: 'dal', 'dal_select2', 'dal_queryset_sequence', 'grappelli', it works, at least for me!
Oh, perhaps you could submit an update on http://django-autocomplete-light.readthedocs.io/en/master/install.html#install-in-your-project ?
I've created a PR #721
I'm using the default Django admin and I'm getting the same issue. I'm following the documentation to show a ModelSelect2Multiple - I can get the form to show, but I get the error that the OP mentions.
I also get select2.full.js:473 Select2: An instance of jQuery or a jQuery-compatible library was not found. Make sure that you are including jQuery before Select2 on your web page. - I can solve this with the code below in the admin class...
class Media:
js = (
'http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js',
)
... but I don't think this is the solution. The installed apps layering does not do the trick either and I continue receiving the same error as the OP.
I've ran collectstatic with no luck. I'm guessing I need to load the jQuery file before the select2 based on other answers I've seen on StackOverflow.
Has anybody seen something like this before? Django 1.9.2/DAL 3.1.8
@carmichaelalonso can you check your jquery.init.js? There is such a file defined and collected from grappelli. There is also such a file defined by dal I think. Check network (resources loaded) in your dev tools and find it. There maybe more then one. Check them against: https://github.com/yourlabs/django-autocomplete-light/blob/master/src/dal/static/admin/js/jquery.init.js if yours looks like: https://github.com/sehmaschine/django-grappelli/blob/master/grappelli/static/admin/js/jquery.init.js then it has been collected before you switched apps or added django autocomplete light. If you can clear (delete) static and run collectstatic again, if not try clearing that file while dal is defined above grappelli.
I hope it helps, I ran across this issue on staging server today and lost couple of hours!
@chubz thanks! That did the trick. My jquery.init.js looked like:
var yl = yl || {};
if (yl.jQuery === undefined) {
if (typeof django !== 'undefined')
yl.jQuery = django.jQuery;
else if (typeof $ !== 'undefined')
yl.jQuery = $;
}
I had to manually change this for it to work (and this was installed from the pip package). I'll have a look to see if I can get the right jquery.init.js loading before I push to production.
I think I found out what was happening.
Grappelli's project replaces the admin/js/vendor/jquery files from the original django when you collectstatic See that here
I had to manually replace django's own jQuery files in order to get jQuery to load.
I also run into the same error. How is it done? Copy the jquery.js after collect static ?
I manually copied the jquery.js file after collectstatic and it did the trick. Since Grappelli's own files are collected after DAL, they are copied over what DAL uses, at least that's what I assume.
Thanks. I got it working. Do you have the issue that the input box can only clickable when the mouse if point at the bottom line only?
Yes, I think I know exactly what is happening. The click box is hidden underneath another field. Check the z-index.
I brought a similar issue up in Grappelli and they just committed the fix. I think my fix also fixed the issue you are having. I can't remember exactly.
sehmaschine/django-grappelli#775
Wow. Your fix exactly solved the problem. Thank you very much~~
Should the dal packages include the jquery in the statics file, then everything should be easy for deployment?
@cesaro I thought it was fixed upstream ?
On Sep 11, 2016 3:59 AM, "cesarho" [email protected] wrote:
Should the dal packages include the jquery in the statics file, then everything should be easy for deployment?
— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/yourlabs/django-autocomplete-light/issues/602#issuecomment-246156900, or mute the thread https://github.com/notifications/unsubscribe-auth/AAFxrACX2nCtAWZMsiSOB5Cd2JCUFNf2ks5qo2CBgaJpZM4HiRRf .
Hello James,
I think you wanted to write to @cesarho and not @cesaro (me)?
César
On Sun, Sep 11, 2016 at 11:30 AM, James Pic [email protected] wrote:
@cesaro I thought it was fixed upstream ?
On Sep 11, 2016 3:59 AM, "cesarho" [email protected] wrote:
Should the dal packages include the jquery in the statics file, then everything should be easy for deployment?
— You are receiving this because you commented. Reply to this email directly, view it on GitHub <https://github.com/yourlabs/django-autocomplete-light/ issues/602#issuecomment-246156900>, or mute the thread <https://github.com/notifications/unsubscribe-auth/ AAFxrACX2nCtAWZMsiSOB5Cd2JCUFNf2ks5qo2CBgaJpZM4HiRRf> .
— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/yourlabs/django-autocomplete-light/issues/602#issuecomment-246170928, or mute the thread https://github.com/notifications/unsubscribe-auth/AAIyaZK70jvb7Y-hipjra891Lrkzqtlhks5qo8o5gaJpZM4HiRRf .
James, yes the issue is solved. I have copied the jQuery in the DAL static files so that it can copy to /static during collect statics.
There should be a better fix.
Hi everyone,
Just for other which have this same JS error (without grapelli for me) : to fix the issue, drop the static dir before collecting it.
I think the same error should happen with grappelli and the collectstatic command itself show us the fix :
Found another file with the destination path 'admin/js/jquery.init.js'. It will be ignored since only the first encountered file is collected. If this is not what you want, make sure every static file has a uniq ue path.
However, I didn't understand that if the file was previously collected, it won't be override. So even if INSTALLED_APPS is correctly sorted, the command won't override the previous admin/js/jquery.init.js from django.contrib.admin (or grapelli).
By removing the file copied in static dir (or dropping the static dir itself), the next collectstatic will properly copied the first one admin/js/jquery.init.js founded, which is the one from dal due to ordering of the setting INSTALLED_APPS.
At least for me, it fix this issue.
I'm not sure we could easily fix it, but we could add some note in install doc? For example:
- add dal and dal_select2 in the top of the
INSTALLED_APPS - drop your collected static dir (or at least
admin/js/jquery.init.js) - collect static file
python manage.py collectstatic
Just in case, check that your served jquery.init.js is the one from dal.
Hope it could help.
Having issues due to a commit a few months ago in grappelli:
https://github.com/sehmaschine/django-grappelli/commit/45cfd42b7652caadb040041d6cd05d8108ae428a
If I'm not mistaken it seems grappelli is now providing it's own jQuery and overwriting the admin's completely, calling noConflict itself and removing the global jQuery.
If the goals of dal are:
-
A) to be completely standalone, resilient to other apps, and not reliant on admin
-
B) not modify Select2's source
Would it make sense to include, noConflict(), and namespace it's own jQuery? If wanted add a setting to use admin's namespaced django.jQuery? (not withstanding API differences and current calls to a global jQuery)
@topher86 Agreed, looking forward to review a patch !
:guitar:
@ychab mine is working correctly, but I'm wondering if this warning when running collectstatic:
Found another file with the destination path 'admin/js/jquery.init.js'. It will be ignored since only the first encountered file is collected. If this is not what you want, make sure every static file has a uniq ue path.
Is expected to run every time, or if it goes away when I have it configured correctly.
Thanks
It's expected until we have a better proposal.
@whieronymus : yes, like @jpic says, Django will always output this warning (conflict between two path files). Because this is a temporary fix, you just have to ignore this warning once you have made the changes
Perhaps something can be done in the docs to help users understand this better ?
@jpic :+1:
Hi, using Django 1.8
Change the code in:
FILE:
select2.full.js
LINE: 8
Add this code at the beginning of the file
var $ = django.jQuery;
LINE: 470
old code in file
var _$ = jQuery || $;
New code in File
var _$ = jQuery || $ || django.jQuery;
no aplicts
./manage.py collectstatic
That a palliative solution, we need a preventive one.
Le 23 févr. 2017 9:40 PM, "Enrique Paz" [email protected] a écrit :
Hi, using Django 1.8 Change the code in: FILE:
select2.full.js LINE: 8
Add this code at the beginning of the file
var $ = django.jQuery;
LINE: 470
old code in file
var _$ = jQuery || $;
New code in File
var _$ = jQuery || $ || django.jQuery;
no aplicts
./manage.py collectstatic
— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/yourlabs/django-autocomplete-light/issues/602#issuecomment-282114346, or mute the thread https://github.com/notifications/unsubscribe-auth/AAFxrNVXltzk1KQ3_8VAaptBg7RL4bj_ks5rfe7GgaJpZM4HiRRf .
@enriquep12 should it be done in the select2.full.js in the site-packages or in the static files folder?