En mi aplicación Django (usando {% load crispy_forms_tags %} ) tengo el siguiente menú desplegable:
<div id="div_id_report_division" class="form-group"> <label for="id_report_division" class=" requiredField">Test<span class="asteriskField"></span</label> <div class=""> <select name="report_division" class="select form-control" required="" id="id_report_division"> <option value="" selected="">---------</option> <option value="1">A</option> <option value="2">B</option> <option value="3">C</option> <option value="4">D</option> <option value="5">E</option> </select> </div> </div> Deseo eliminar la opción número 5 en la carga de la página. Mi Javascript en post.html con todo es:
<script type="text/javascript"> function on_load(){ /* option 1.: document.querySelector('id_report_division option[value=5]').remove(); option 2.: var x = document.getElementById('id_report_division'); x.remove(5); option 3.: document.querySelector('#id_report_division option[value=5]').remove(); const first = document.querySelector("[id='id_report_division']"); */ document.querySelector("[id='id_report_division' option[value=5]]").remove(); } on_load(); </script>¿Cómo puedo eliminar fácilmente esta opción? Sería mejor si pudiera eliminar la opción donde el texto es E, en caso de que ese valor cambie. Pero siempre habrá un solo texto 'E', no es necesario iterar.
Puede iterar la lista de opciones seleccionadas, verificar el texto interno y eliminarlo así:
var selectobject = document.getElementById("id_report_division"); for (var i=0; i<selectobject.length; i++) { if (selectobject.options[i].text == 'E') selectobject.remove(i); }