0

tengo un select2 que tiene varios valores, entre ellos uno en especifico que requiere que al seleccionarse automaticamente me muestre un div oculto, o si no esta seleccionado se oculte nuevamente.

<div class="form-group {{ $errors->has('usos') ? 'has-error' : '' }}">
            <label class="col-sm-4 control-label">*Tipo de Uso Solicitado:</label>
            <div class="col-sm-7">
                <select class="select2" multiple="multiple" data-placeholder="Seleccionar Tipo de Uso" name="t_usos[]" id="t_usos" style="width: 100%;">
                    @foreach($usos as $uso)
                    <option value="{{$uso->id}}">{{$uso->nombre}}</option>
                    @endforeach
                </select>
            </div>
        </div>

        <div class="form-group {{ $errors->has('usos') ? 'has-error' : '' }}" id="agrodiv" style="display:none;">
            <label class="col-sm-4 control-label">*Agropecuario:</label>
            <div class="col-sm-7">
                <select class="form-control" id="agricola" name="agricola">
                    <option selected="true" disabled="true"></option>
                    @foreach($agro as $agrop)
                        <option value="{{$agrop->id}}">{{$agrop->nombre}}</option>
                    @endforeach
                </select>
            </div>
        </div>

este es mi script

$(document).ready(function() {
$('.select2').select2();
$('#t_usos').on("change", function(e) { 
    if ($(this).val() == 1){
        //alert($(this).val());
        $('#agrodiv').show();
    }
    else($(this).val()<>1){
        $('#agrodiv').show();
    }

});});

la idea es que si selecciono el valor "Agropecuario" de mi select2, me muestre el DIV oculto, y si en mi select2 no se selecciona el valor "Agropecuario" el div vuelva a ocultarse.

2
  • Tienes algun error?
    – alanfcm
    Commented el 7 may. 2018 a las 22:08
  • Error no, la idea es que si en mi select2 tengo seleccionado "Agopecuario", me muestre un div oculto, de lo contrario que no lo muestre. Por ahora solo me hace lo primero, me muestra el div. Y solo lo muestra si en mi select2 tengo unicamente "Agropecuario" seleccionado. Commented el 7 may. 2018 a las 22:16

1 respuesta 1

0

Puedes hacerlo de esta manera:

$(document).ready(function() {
$('.select2').select2();
$('#t_usos').on("change", function(e) { 
    var valores = $(this).val();
    if ($.inArray("1", valores) != -1){
        //alert($(this).val());
        $('#agrodiv').show();
    }
    else {
        $('#agrodiv').hide();
    }

});});

Solo reemplacé el 1 de la condición, por un "1" como string, y funciona de maravilla. Gracias

4
  • Esta bien a como dices, solo que si en $(this).val() cambia de 1, el div se oculta nuevamente, es decir: si en mi select2 tengo seleccionado unicamente "agricola" funciona perfecto y muestra el div oculto, pero si selecciono otro valor mas ademas del "agricola", el div se oculta. lo unico que quiero que mientras en el Select2 esté seleccionado "agricola", sin imporar si hay mas valores o no, el div oculto aparezca y si quito de la selección el "agricola", el div desaparezca nuevamente. Commented el 7 may. 2018 a las 22:33
  • ya edite mi respuesta
    – alanfcm
    Commented el 7 may. 2018 a las 22:38
  • no ha funcionado amigo, :( al usar el select, elegi otro valor que no era "agricola", y luego elegi agricola, y no funciono.. :'( Commented el 7 may. 2018 a las 23:02
  • Muchas gracias @alanfcm Commented el 7 may. 2018 a las 23:15

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.