Ajout personnalisée JS à un champ admin django

Question

Dans une application django je le modèle suivant:

class Appointment(models.Model): 
    #some other fields 
    #address fields 
    zipcode=models.CharField(max_length=5) 
    address=models.CharField(max_length=120) 
    latitude=models.FloatField() 
    longitude=models.FloatField() 

Quand je suis rendu un rendez-vous, je suis juste mettre un marqueur à la position indiquée par la longitude et latitude avec l'adresse comme texte, mais j'ai besoin de la latitude et de la longitude pour le faire.

Actuellement, la latitude et la longitude doivent être saisies manuellement dans le backend admin, mais ouvrir Google Maps/OSM, rechercher l'adresse et entrer la latitude et la longitude est un travail qui ne devrait pas être fait à la main, donc je vouloir le récupérer via l'API Google Maps (mot-clé Géocodage). Idéalement, je veux un bouton "Obtenir des coordonnées" à côté de l'adresse, qui, lorsqu'il est pressé, commence une demande de géocodage et remplit la latitude et la longitude lorsque l'adresse est non ambiguë et présente une carte avec les résultats et remplit le coordonnées lorsque l'utilisateur clique sur le bon marqueur. Je sais comment faire cela, mais je ne suis pas sûr comment je devrais insérer le balisage et le code dans le backend d'administration.

Certaines choses je l'ai déjà envisagé, mais ne veux pas faire comme ils naturel ou semblent semblent pas être trop de travail pour une tâche simple:

• mettre le code dans la description du champ d'adresse en field_options dans une classe dérivée de admin.ModelAdmin
• mettre l'adresse de tout ce qui touche dans un modèle distinct et en utilisant une commande form (avec un modèle distinct
• créer un widget sélecteur d'adresse
• nous e GeoDjango

Answer 1

Il existe plusieurs façons de procéder. Vous en avez déjà mentionné vous-même.

Une option serait de remplacer le modèle pour la page de sauvegarde dans votre admin et ajouter le code nécessaire au modèle. Les médias nécessaires, Javascript, Css, etc, pourraient être ajoutés en utilisant une classe Media interne dans votre classe ModelAdmin. Cette classe média a deux attributs différents, un tuple avec des feuilles de style CSS et un tuple avec des fichiers javascript. de façons dont vous ne voulez pas le faire.

Answer 2

Ce qui est principalement traité est le balisage côté client et le javascript côté client. Étant le cas, il semblerait que l'utilisation d'une installation qui est conçue pour gérer ceux-ci serait le bon choix. Je recommande également de créer un widget d'administration personnalisé. J'ai utilisé ce modèle moi-même. Selon la taille du balisage côté client, vous pouvez même utiliser un modèle Django pour rendre le widget. Vous pouvez également écrire un javascript non intrusif pour restituer la zone de la page après le chargement de la page. Dans cette méthode, vous pouvez simplement inclure ce fichier multimédia JavaScript avec class Media: sur le modèle d'administration.

Ceci est plus comme pseudo-code que tout, mais il donne l'idée:

admin.PY

class AppointmentAdmin(admin.ModelAdmin): 
    # ... 

    class Media: 
     from django.conf import settings 
     media_url = getattr(settings, 'MEDIA_URL', '/media') 
     js = [ media_url+'/admin/long-lat-render.js', ] 

long-lat-render.js

// Written for jQuery 
$(function(){ 
    // on page load... 

    $('#_LongitudeTag').html(''); 

    var getCoordButton = $('<button id="get-coords"></button>'); 
    $('#_LongitudeTag').append(getCoordButton); 

    addGMap($('#_LongitudeTag').get(0)); 
}); 

function addGMap(element) { 
    // do whatevers 
}