1

Tengo dos formularios A y B, ambos son modales, B se abre por medio de un botón dentro de una tabla en el formulario A, el problema está en que cuando cierro B, el formulario A pierde la propiedad para hacer Scroll, no se como solucionarlo. dejo el HTML y el fragmento del JavaScript en donde está el botón por si alguien me puede dar idea del por que está pasando esto.

Primero pensé que era culpa de las transiciones que tienen, pero se las quité y aun así el problema persiste.

Pensé en agregar algo en el JavaScript, pero no se que propiedad sería o que podría solucionar dicho inconveniente.

            {
                className: "dt-center",
                searchable: false,
                orderable: false,
                render: function (data, type, row) {
                    return '<div>' +
                        ' <button class="btn btn-info btn-outline m-b-none detalle" id="CrearUsuario" data-toggle="tooltip" data-placement="top"><i class="fa fa-user-plus"></i></button> ' +

                        '</div>';
                }
            }
<div class="modal inmodal" id="ModalNuevoRegistroUsuario" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog" style="width : 1200px">
        <div class="modal-content animated bounceInRight">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Cerrar</span></button>
                <i class="fa fa-pencil-square-o modal-icon"></i>
                <h4 class="modal-title">Registrar Nuevo Usuario</h4>
                <small class="font-bold">Para registrarse recuerde llenar toda la información solicitada.</small>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="panel panel-primary">
                        <div class="panel-heading">
                            <h3 class="panel-title">Registrarse en SAMI</h3>
                        </div>
                        <div class="panel-body">
                            <div class="panel-heading"><h3 class="panel-title">Información Ips</h3></div>
                            <div class="hr-line-dashed"></div>
                            <div class="form-group" style="align-self:center" id="formNuevoRegistroUsuario">
                                <div class="panel-body">
                                    <div class="row panelPadding">
                                        <div class="m-t-30">
                                            <div class="form-group col-md-10">
                                                <label class="control-label col-md-5">Ingrese el número de NIT de su IPS</label>
                                                <div class="input-group">
                                                    <input type="text" name="Nit" id="Nit" class="form-control" placeholder="mínimo 4 caracteres" />
                                                    <span class="input-group-btn">
                                                        <button class="btn btn-primary m-b-none" type="button" id="buscarIps" data-toggle="tooltip" data-placement="top" title=""><i class="fa fa-search"></i></button>
                                                    </span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <br />
                                    <div class="row">
                                        <div class="col-md-12">
                                            <div class="ibox float-e-margins">
                                                <div class="panel panel-primary">
                                                    <div class="panel-heading">
                                                        <h3 class="panel-title ">Sedes de la IPS</h3>
                                                    </div>
                                                    <div class="panel-body">
                                                        <table class="table table-striped table-bordered table-hover dataTables-example table-se" id="dataTableIps" style="width:100%;">
                                                            <thead>
                                                                <tr>
                                                                    <th>Id</th>
                                                                    <th>Código prestador</th>
                                                                    <th>Nombre de la sede</th>
                                                                    <th>Sede</th>
                                                                    <th>Ciudad</th>
                                                                    <th>Departamento</th>
                                                                    <th>Telefono</th>
                                                                    <th>Email</th>
                                                                    <th>Opciones</th>
                                                                </tr>
                                                            </thead>
                                                            <tfoot>
                                                                <tr>
                                                                    <th>Id</th>
                                                                    <th>Código prestador</th>
                                                                    <th>Nombre de la sede</th>
                                                                    <th>Sede</th>
                                                                    <th>Ciudad</th>
                                                                    <th>Departamento</th>
                                                                    <th>Telefono</th>
                                                                    <th>Email</th>
                                                                    <th>Opciones</th>
                                                                </tr>
                                                            </tfoot>
                                                        </table>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="modal-footer">
                                            <button type="button" class="btn btn-primary" id="btnModalAgregarSede" title="">  Agregar Sede </button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary" id="btnModalRegistroIpsEnSAMI"> Registrar IPS </button> |
                <button type="button" class="btn btn-default btn-outline" id="cancelarRegistroUsuario" data-dismiss="modal">Cerrar</button>
            </div>
        </div>
    </div>
</div>

<div class="modal fade inmodal" id="ModalEmail" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content animated bounceInRight">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Cerrar</span></button>
                <i class="fa fa-pencil-square-o modal-icon"></i>
                <h4 class="modal-title">Registrar Nuevo Usuario</h4>
                <small class="font-bold">Para registrarse recuerde llenar toda la información solicitada.</small>
            </div>
            <div class="modal-body">
                <form id="form">
                    <div class="columns">
                        <div class="form-group col-10">
                            <label class="control-label col-md-5">Ingrese su correo. </label>
                            <div class="input-group" id="email">
                                <input type="text" id="TextEmail" class="form-control"  autocomplete="off" style="width: 150%;">
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                @Html.CustomButton("BtnSolicitarUser", "btn btn-primary multi", "button", "Solicitar")
                <button type="button" class="btn btn-default btn-outline cerrarmodalpdf" data-toggle="tooltip">Cerrar</button>
            </div>
        </div>
    </div>
</div>
1
  • Que librerías usas, y que versiones?
    – Alvarez
    Commented el 18 feb. 2020 a las 15:20

2 respuestas 2

0

Puedes mostrar tu CSS? De igual manera para que un objeto pueda tener la funcionalidad de scroll, dependiendo de las medidas de tu objeto es decir, si este ya trae consigo el ancho definido o el alto, lo único que tendrías que hacer es definir el alto de tu contenedor scroll, te pongo un ejemplo:

    scroll {
        scroll-behavior: smooth;
        height: 377px;
        overflow: scroll;
    }

En este ejemplo yo ya tenía el ancho porque estaba usando columnas, se trata de un contenedor grid, y dentro le asigne sólamente el alto al contenedor scroll.

-1

Poner esto en el div principal del modal:

style="overflow-y: scroll;"
0

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.