0

quisiera saber como puedo pasar un valor al select y este quede seleccionado de acuerdo al valor que le envie porque estoy tratando de hacer un actualizar.

Este ajax llama a un método "MantProyecto.cargaCombo2()" que imprime código html(select) dentro de un "div" la cantidad de veces que indique el bucle json.data.length pero yo quiero pasarle un valor en especifico por cada select creado para que quede el option seleccionado al valor que le indique esta es la linea de codigo comentada:

el valor que le envío es json.data[i].Sub_Catalogo_id; pero quiero que ese valor que pase el valor a los demás select y no al primer select.

//document.getElementById("idDepreciacion").selectedIndex = json.data[i].Sub_Catalogo_id;

$.ajax({
                    url: root + 'MantProyecto/ListaTipoDepSel',
                    type: 'POST',
                    dataType: 'json',
                    data: { id: JSON.stringify(parametro) },
                    success: function (json) {
                        console.log(json.data[0].Sub_Catalogo_id);
                        for (let i = 0; i < json.data.length; i++) {
                            MantProyecto.cargaCombo2();
                            //document.getElementById("idDepreciacion").selectedIndex = json.data[i].Sub_Catalogo_id;
                        }
                        $("#items2 div").remove();
                        $('#exampleModal2').modal('toggle');
                    }
                })

Este el método que crea el select y lo imprime en un contenedor "div" llamado items "MantProyecto.cargaCombo2()"

cargaCombo2: function () {
            $.ajax({
                url: root + 'MantProyecto/CargarTipoDepreciacion',
                dataType: 'json',
                type: 'GET',
                success: function (json) {
                    //$("#items2").append("");
                    var items = document.getElementById("items2");

                    //items.innerHTML += "";
                    var select = `
                            <div class="form-row dep_val" style="margin-bottom:3px;">
                                <select id="idDepreciacion">
                            `;
                    for (let valor of json.data) {
                        select += "<option value='" + valor.id_sub_catalogo + "'>" + valor.descripcion_breve + "</option>";
                    }
                    var html = select + `</select> &nbsp;
                                        <input class="form-control col-md-2 valor" type="number" required/>  &nbsp;     
                                        <button class="btn btn-primary delete">-</button>
                                        </div>`;
                    $("#items2").append(html);

                }
            })
        }

En conclusión lo que deseo es que los select deberían quedar seleccionados de acuerdo al valor dado

introducir la descripción de la imagen aquí

4
  • No es claro tu planteamiento del problema. He entendido que usas un JSON para crear las opciones del select. Pregunto: ¿entre los datos hay algo que identifique cuál opción debe quedar seleccionada? Debes entonces usar esa información para poner selected al momento de crear el elemento HTML aquí en el bucle: for (let valor of json.data) { ahí debes preguntar y agregar selected cuando la condición se cumpla. Es todo.
    – A. Cedano
    el 14 sep. 2019 a las 18:05
  • este es el valor al cualquier quiero cambiar json.data[i].Sub_Catalogo_id que va a recibir varios valores de acuerdo a la cantidad de select que se hayan creado.
    – Dum
    el 14 sep. 2019 a las 18:10
  • document.getElementById("idDepreciacion").selectedIndex = 3 selected document.getElementById("idDepreciacion").selectedIndex = 1 selected document.getElementById("idDepreciacion").selectedIndex = 2 selected
    – Dum
    el 14 sep. 2019 a las 18:12
  • quiero que cada valor que recibe del json = json.data[i].Sub_Catalogo_id vaya asignandose a los diferentes select que hay.
    – Dum
    el 14 sep. 2019 a las 18:39

1 respuesta 1

-1
$.ajax({
                    url: root + 'MantProyecto/ListaTipoDepSel',
                    type: 'POST',
                    dataType: 'json',
                    data: { id: JSON.stringify(parametro) },
                    success: function (json) {
                        console.log(json.data[0].Sub_Catalogo_id);
                        for (let i = 0; i < json.data.length; i++) {
                            MantProyecto.cargaCombo2(json.data);
                            //document.getElementById("idDepreciacion").selectedIndex = json.data[i].Sub_Catalogo_id;
                        }
                        $("#items2 div").remove();
                        $('#exampleModal2').modal('toggle');
                    }
                })



cargaCombo2: function (lista) {
            $.ajax({
                url: root + 'MantProyecto/CargarTipoDepreciacion',
                dataType: 'json',
                type: 'GET',
                success: function (json) {
                    //$("#items2").append("");
                    var items = document.getElementById("items2");

                    //items.innerHTML += "";
                    var select = `
                            <div class="form-row dep_val" style="margin-bottom:3px;">
                                <select class="idDepreciacion">
                            `;
                    for (let valor of json.data) {
                        select += "<option value='" + valor.id_sub_catalogo + "'>" + valor.descripcion_breve + "</option>";
                    }
                    var html = select + `</select> &nbsp;
                                        <input class="form-control col-md-2 valor" type="number" required/>  &nbsp;     
                                        <button class="btn btn-primary delete">-</button>
                                        </div>`;
                    $("#items2").append(html);


    for(let i=0;i<lista.length;i++){
        $(".idDepreciacion:eq('"+i+"')").val(lista[i].Sub_Catalogo_id);
        $(".valor:eq('"+i+"')").val(lista[i].Valor);
                            } 
                }
            })
        }
5
  • 2
    Hola, para agregar mas información a tu pregunta no uses la sección de respuestas, emplea la opción de editar en tu pregunta. el 15 sep. 2019 a las 11:46
  • encontré la solución a mi pregunta por ello mismo la conteste nota el código que agregue.
    – Dum
    el 16 sep. 2019 a las 17:23
  • Sería bueno que indicaras qué es lo que ha cambiado en ese código, y por qué o cómo solucionar el problema de la pregunta. Las publicaciones que son sólo código se consideran de baja calidad y no suelen ser de ayuda para otros usuarios. Lee Cómo responder para más información.
    – Alvaro Montoro
    el 21 sep. 2019 a las 13:32
  • estimado @AlvaroMontoro ya fue solucionada la pregunta.
    – Dum
    el 21 sep. 2019 a las 22:26
  • 1
    @Dum lo sé y me alegro de que encontraras la solución. Pero si otra persona se encuentra con un problema similar, y solo se encuentra con tu respuesta que es código sin más, le va a costar mucho entender cuál era el problema y cómo lo solucionaste. Por favor, lee sobre Cómo responder y Edita tu respuesta para añadir más detalle.
    – Alvaro Montoro
    el 21 sep. 2019 a las 22:35

Tu Respuesta

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

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