Is there a way to disable a radio button in leaflets layer control?

Question

I am looking for a way to select/disable a single radio button in my base map. Here is my code.

This creates the baseMap for myleaflet layer

baseMap = {
    Map View: mapQuestOpenEnglish
    Satelite View: mapQuestAerial
}

mapControl = L.control.layers(baseMap)

Eventually I add mapControl to the map and it produces the following html

<div class="leaflet-control-layers leaflet-control" aria-haspopup="true">
  <a class="leaflet-control-layers-toggle" href="#" title="Layers"></a>
  <form class="leaflet-control-layers-list">
    <div class="leaflet-control-layers-base">
      <label>
        <input type="radio" class="leaflet-control-layers-selector" name="leaflet-base-layers" checked="checked">
        <span> 
          <span class="default-map">Map View</span>
        </span>
      </label>
      <label>
        <input type="radio" class="leaflet-control-layers-selector" name="leaflet-base-layers">
        <span> 
          <span class="staelite-map">Satelite View</span>
        </span>
      </label>
    </div>
  </form>
</div>

I want a way to be able to select/disable this radio button.

<input type="radio" class="leaflet-control-layers-selector" name="leaflet-base-layers">

Is there any easy way to do this? Any help is greatly appreciated

Answer 1

Ok, not very clean, but works...

You can select the desired radio element through it's respective span label's class. Here's a simple JS method to do that:

function SelectRadio(span_class) {
    var span = document.getElementsByClassName(span_class)[0];
    var radio = span.parentNode.parentNode.getElementsByTagName('radio')[0];
    return radio;
}

You just call it like this:

var element = SelectRadio('staelite-map');
/* Here you'll have the DOM Element. Just use it to enable/disable,
      set selection, or anything else */