0

estoy haciendo un CRUD el cual tiene interesados y cursos. Quiero que al editar los interesados me traiga los cursos en los que esta interesados. Estos cursos se muestra con un select multiple pero no se como hacer para marcarlos como selected.

La consulta a la DB es a traves de php, y toda la funcionalidad la estoy haciendo con JS.

Hice lo siguiente pero no funciona

this.editar = (id) => {
    var form = new FormData();
    form.append("id", id);
    fetch("../controllers/editar.php", {
        method: "POST",
        body: form,
    })
        .then((res) => res.json())
        .then((data) => {
            document.getElementById("id_interesado").value = data.id_interesado;
            document.getElementById("nombre").value = data.nombre;
            document.getElementById("apellido").value = data.apellido;
            document.getElementById("telefono").value = data.telefono;
            document.getElementById("email").value = data.email;
            document.getElementById("direccion").value = data.direccion;
            document.getElementById("numero").value = data.numero;
            document.getElementById("localidad").value = data.localidad;
            document.getElementById("dni").value = data.dni;
            var form_cursos = new FormData();
            form_cursos.append("id_interesado", data.id_interesado);
            fetch("../controllers/editar_cursos_interes.php", {
                method: "POST",
                body: form_cursos,
            })
                .then((res) => res.json())
                .then((data) => {
                    var ids_cursos = Array();
                    data.forEach((item) => {
                        ids_cursos.push(item.id_curso);
                    })
                    ids_cursos.forEach((item) => {
                        if (document.getElementById("curso_interes").value in ids_cursos) {
                            document.getElementById("curso_interes").setAttribute("selected", true);
                        }
                    })
                })
                .catch((error) => console.log(error));
        })
        .catch((error) => console.log(error));
};

1 respuesta 1

1

Por lo que entiendo lo que quieres es marcar como seleccionado un item de un select, siendo así puedes hacer algo simple como esto:

let element = document.getElementById("select");
element.value = value; // Value puede ser el ID o el valor del select

Por ejemplo:

let element = document.getElementById("family");
element.value = 4;


let element2 = document.getElementById("familys");
element2.querySelector("option[value=\"1\"]").selected = true;
element2.querySelector("option[value=\"3\"]").selected = true;
<select id="family" name="family">
      <option value="1">Yo</option>
      <option value="2">Hermano</option>
      <option value="3">Papa</option>
      <option value="4">Mama</option>
</select>


<select id="familys" name="family" multiple>
      <option value="1">Yo</option>
      <option value="2">Hermano</option>
      <option value="3">Papa</option>
      <option value="4">Mama</option>
</select>

Se marcará mama, solo tienes que tener en el select la información y decirle el value que corresponda.

6
  • Hasta ahi perfecto, y cuando son varias opciones, como se hace? Commented el 7 oct. 2022 a las 20:54
  • @LucasLeone te puede servir ésta respuesta es.stackoverflow.com/a/323890/155688 Commented el 7 oct. 2022 a las 21:06
  • @LucasLeone Te puse un ejemplo muy sencillo de como sería en uno múltiple, saludos.
    – Spearking
    Commented el 7 oct. 2022 a las 21:12
  • DOMException: Failed to execute 'querySelector' on 'Element': 'option[value=1]' is not a valid selector. at http://localhost/beca/app/assets/code.js:130:37 at Array.forEach (<anonymous>) at http://localhost/beca/app/assets/code.js:129:30 Commented el 7 oct. 2022 a las 22:25
  • ese error me sale Commented el 7 oct. 2022 a las 22:25

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.