search

HWR-llc / ett

MassBays Phase I data explorer for data from the EPA WQX Portal
MIT License
1 stars 1 forks source link

Clicking radio button labels selects wrong option #66

Closed walkerjeffd closed 2 years ago

walkerjeffd commented 2 years ago

If I have Eelgrass selected, then click the text (not the button) part of the Tidal Flats option, then it selects Salt Marsh.

This is caused by the <input> elements not having a unique id attribute (currently, they're all key). Can fix it by assigning unique id to each <input> and then referencing that id in the for attribute of the <label>. For example, this uses habitat-eelgrass for the eelgrass radio button.

<div data-v-13163748="" class="form-check">
  <input data-v-13163748="" type="radio" id="habitat-eelgrass" class="form-check-input" value="eelgrass">
  <label data-v-13163748="" for="habitat-eelgras" class="form-check-label" style="color: white;"> Eelgrass </label>
</div>

And can do the same for WQ.

walkerjeffd commented 2 years ago

Clicking "Diadromous Fish" now selects "Eelgrass". Looks like you only fixed the first column (Salt Marsh, Tidal Flats). Same with WQ, pH to Enterococcus all have id="key" still but Nitrogen to Temperature works.