JavaScript: Leaflet bindpopup use checkbox. В настоящее время очищается каждый раз, когда всплывающее окно закрывается

Я использую приведенный ниже код для генерации leafletmap с некоторыми дополнительными полями из бэкенда Django. Однако в браузере сгенерированный флажок "снимается" каждый раз, когда вы закрываете всплывающее окно. Как мне сохранить его значение?

<script>

               var mymap = L.map('competition_map').setView([{{ lat }}, {{ lon }}], 5); 
               
               var plant = L.marker([{{ plant.lat }}, {{ plant.lon }}]).addTo(mymap);
               var customer = L.marker([{{ customer.lat }}, {{ customer.lon }}]).addTo(mymap);

               plant.bindPopup("<b>{{ plant }}</b>").openPopup();
               customer.bindPopup("<b>{{ customer }}</b>");

               //Through iteration add all Competitors:
               {% for c in competitor %}
               var competitor_{{c.id}} = L.marker([{{ c.lat }}, {{ c.lon }}]).addTo(mymap);     
               competitor_{{c.id}}.bindPopup("<input type=\"checkbox\" id=\"{{ c.id }}\" name=\"{{ c.id }}\" onClick=\"competitorAdd('{{ c.id }}','{{ c.location_name}}','{{ c.city }}', '{{ c.country }}')\"><strong>{{ c }}</strong>");        
               {% endfor %}
               
               var competitors = L.layerGroup([
               {% for c in competitor %} 
               competitor_{{c.id}},
               {% endfor %}]);
              
               //https://leafletjs.com/examples/layers-control/example.html to add layers for Grey and Streets.
               var baseLayers = {
             };

               var overlays = {
               "Competitors": competitors
               };

               L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw', {
                    maxZoom: 18,
                    attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, ' +
                         'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
                    id: 'mapbox/streets-v11',
                    tileSize: 512,
                    zoomOffset: -1
               }).addTo(mymap);
               L.control.layers(baseLayers,overlays).addTo(mymap);
          </script>
      

Вернуться на верх