0

Hola buenas tardes a todos: tengo en mi vista 2 select que cargan la misma informacion, lo que requiero hacer es que cuando se seleccione un option del primer select, el mismo option pero del segundo select no este habilitado para seleccionarlo, por ejemplo:

SELECT 1:

Bodega 1 (AL SELECCIONAR ESTA OPCION, EN EL SELECT 2 NO DEBERIA QUEDAR HABILITADO EL OPTION 1) Bodega 2

SELECT 2:

Bodega 1 //este option no deberia quedar habilitado porque es lo mismo que tengo seleccionado en el primero Bodega 2
//Asigna Nombre del responsable Destino
    $('#bodega_origen').on('change', function(){
        $("#bodega_destino option:selected").attr('disabled','disabled');
        var id = $(this).val();
        $.ajax({
            url:"{{ url('/bodResp') }}"+`/${id}`,
            method:"get",
            dataType: "json",
                success: function (jdata) {
                    var jsonData=jdata
                    console.log(jsonData)
                    //alert(jsonData.data);
                    $('#responsable_origen').val(jsonData.data);
                }
        });
    });

    //Asigna Nombre del responsable Destino
    $('#bodega_destino').on('change', function(){
        var id = $(this).val();
        $('#bodega_id_des').val(id);
        $.ajax({
            url:"{{ url('/bodResp') }}"+`/${id}`,
            method:"get",
            dataType: "json",
                success: function (jdata) {
                    var jsonData=jdata
                    console.log(jsonData)
                    //alert(jsonData.data);
                    $('#responsable_destino').val(jsonData.data);
                }
        });
    });

1 respuesta 1

0

Quedaría de la siguiente manera Tus select compartirian mismos identificadores

 <select id="bodega_origen">
    <option value="" selected="true" >Seleccione</option>
    <option value="1">bodega1</option>
    <option value="2">bodega2</option>
</select>

<select id="bodega_destino">
    <option value="" selected="true" >Seleccione</option>
    <option value="1" class="bodDestino">bodega1</option>
    <option value="2" class="bodDestino">bodega2</option>
</select>

Y a los option del segundo se le agrega una clase para poder recorrerlos con tu function cuando se active el on change de tu primer select envia como parametro el id seleccionado, el cual recorre en el segundo, si encuentra coincidencias lo deshabilita, y si no, lo habilita

$(function(){
        $('#bodega_origen').on('change', function(){                
            var id = $(this).val();
            console.log(id)
            myFunction(id);

            /*
            $.ajax({
                url:"{{ url('/bodResp') }}"+`/${id}`,
                method:"get",
                dataType: "json",
                    success: function (jdata) {
                        var jsonData=jdata
                        console.log(jsonData)
                        //alert(jsonData.data);
                        $('#responsable_origen').val(jsonData.data);
                    }
            });
            */
        });
    })

    function myFunction(idOrigen){          
        $(".bodDestino").each(function(){
            let idDestino = $(this).val();
            if(idDestino == idOrigen){
                console.log('son iguales')
                $("#bodega_destino option[value="+idDestino+"]").attr('disabled', 'disabled');
            }else{
                console.log('no son iguales')
                $("#bodega_destino option[value="+idDestino+"]").prop('disabled', false);
            }
        });
    }       
1
  • Funciono perfecto! gracias Commented el 17 feb. 2021 a las 23:45

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.