Aggiunta personalizzato JS a un campo Django amministratore

Question

In un'applicazione Django ho il seguente modello:

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() 

quando sono il rendering di un appuntamento, mi sto solo mettendo un marcatore nella posizione specificata da longitudine e latitudine con l'indirizzo come testo, tuttavia ho bisogno della latitudine e della longitudine per farlo.

Attualmente, latitudine e longitudine devono essere immesse manualmente nel backend amministratore, ma l'apertura di Google Maps/OSM, la ricerca dell'indirizzo e l'immissione di latitudine e longitudine sono lavori che non dovrebbero essere eseguiti a mano, quindi vuoi recuperarlo tramite l'API di Google Maps (parola chiave Geocoding).

Idealmente, voglio un pulsante "Ottieni coordinate" accanto all'indirizzo, che, quando premuto, avvia una richiesta di geocodifica e riempie latitudine e longitudine quando l'indirizzo non è ambiguo e presenta una mappa con i risultati e riempie il coordinate quando l'utente fa clic sul marcatore destro.

So come farlo, ma non sono sicuro di come dovrei inserire il codice e il codice nel backend amministratore.

Alcune cose che ho già preso in considerazione, ma non voglio fare come loro non sembrano naturali o sembrano essere troppo lavoro per un compito così semplice:

• mettere il codice nella descrizione del campo indirizzo in field_options in una classe derivata da admin.ModelAdmin
• mettendo tutto ciò che riguarda l'indirizzo in un modello separato e con un costume form (con un modulo separato
• creare un widget di indirizzo raccoglitrice
noi
• e GeoDjango

Answer 1

Ci sono diversi modi per farlo. Ne hai già menzionato qualcuno.

Un'opzione sarebbe quella di sovrascrivere il modello per la pagina di salvataggio nell'amministratore e aggiungere il codice necessario al modello. I media necessari, Javascript, Css, ecc. Potrebbero essere aggiunti utilizzando una classe Media interna nella classe ModelAdmin. Questa classe multimediale ha due attributi diversi, una tupla con fogli di stile css e una tupla con file javascript

Penso che l'opzione migliore in questo caso sia un widget di selezione indirizzi personalizzato come già citato nel tuo elenco di modi in cui non vuoi farlo.

Answer 2

Ciò che viene principalmente affrontato è il markup lato client e il javascript lato client. Stando così le cose, sembrerebbe che usare una struttura progettata per gestirli sarebbe la scelta giusta. Ti consigliamo anche di creare un widget di amministrazione personalizzato. Ho usato questo modello me stesso. A seconda delle dimensioni del markup sul lato client, puoi persino utilizzare un modello Django per il rendering del widget.

In alternativa, è possibile scrivere javascript non intrusivo per ricreare quell'area della pagina dopo che la pagina è stata caricata. In questo metodo, puoi semplicemente includere quel file multimediale javascript con class Media: sul modello di amministrazione.

Questo è più come pseudo-codice di ogni altra cosa, ma dà l'idea:

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', ] 

lungo-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 
}