django-mapbox-location-field icon indicating copy to clipboard operation
django-mapbox-location-field copied to clipboard

Javascript error in Admin site, mapboxgl not loaded when using admin.StackedInline or admin.TabularInline

Open h3x4git opened this issue 4 years ago • 2 comments

I'm using django-mapbox-location-field 1.7.3 on Django 3.2.8, I enabled the app by adding it to the INSTALLED_APPS list of settings.py, I added a location field to a model and ran python manage.py collectstatic.

Here's my model definition: class SedeStudio(models.Model): annuncio = models.ForeignKey(Annuncio, on_delete=models.CASCADE, related_name="sede_studio") pos_marker = LocationField(map_attrs={"center": [51.21992, 10.58072], "marker_color": "blue"}) address = AddressAutoHiddenField() Here's my admin.py:

from django.contrib import admin
from .models import Annuncio, ImmaginiStudio, SedeStudio
from mapbox_location_field.admin import MapAdmin


class ImmaginiStudioAdmin(admin.TabularInline):
    model = ImmaginiStudio
    extra = 3

class SedeStudioAdmin(admin.StackedInline):
    model = SedeStudio
    extra = 3

class AnnuncioAdmin(admin.ModelAdmin):
    inlines = [
        ImmaginiStudioAdmin, SedeStudioAdmin
    ]

admin.site.register(Annuncio, AnnuncioAdmin)

EDIT: I also used the MapAdmin as a mixin but Django would throw an error and if used in admin.site.register(Annuncio, MapAdmin) it would work but just ignore the StackedInline model that uses the Mapbox field The resulting admin site pages output throw this error in the javascript console:

Uncaught ReferenceError: mapboxgl is not defined <anonymous> https://www.mydomain.com/static/mapbox_location_field/js/map_input.js:1 Uncaught ReferenceError: mapboxgl is not defined <anonymous> https://www.mydomain.com/admin/myapp/mymodel/1/change/:781 Uncaught ReferenceError: mapboxgl is not defined <anonymous> https://www.mydomain.com/admin/myapp/mymodel/1/change/:865 Uncaught ReferenceError: mapboxgl is not defined <anonymous> https://www.mydomain.com/admin/myapp/mymodel/1/change/:949 Uncaught ReferenceError: mapboxgl is not defined <anonymous> https://www.mydomain.com/admin/myapp/mymodel/1/change/:1033

however, I do not get any 404 error other than the favicon.ico that is missing, all the files that that the page is requesting from the web server are actually downloaded without a problem.

I get the map and address fields appearing, and according to the DOM inspector the <div id="map-map-mapbox-location-field" class="location-field-map"></div> is regularly created, I understand that's where the map is supposed to be rendered.

I also tried to limit the number of instances on the same field to 1, in case the map <div> could not be duplicated for javascript addressing, but it seems to not really affect the situation.

I then tried to not associate the model to the admin page of another model in a StackedInline format and that's when this error disappears. In my case I need to associate more than one location to a single object, so this is not the ideal solution. I would like to inform of this issue

h3x4git avatar Nov 16 '21 18:11 h3x4git

class AnnuncioAdmin(MapAdmin, admin.ModelAdmin):
    inlines = [
        ImmaginiStudioAdmin, SedeStudioAdmin
    ]

admin.site.register(Annuncio, AnnuncioAdmin)

worked, but only for one of the extra instances, the two others have an empty map (so I can't save not even the first one because it throws an error on the extra instances)

h3x4git avatar Nov 17 '21 03:11 h3x4git

I kindly ask to add support for TabularInline and StackedInline

h3x4git avatar Nov 27 '21 02:11 h3x4git