Bootstrap modal dentro del repetidor ASP. Net

Estoy tratando de mostrar la información en un modal de un repetidor. Mi código de muestra se está hundiendo.


                            
                                

                            
                                

                                    Name
                                    Type of Membership

Puedo obtener todos los datos de la base de datos en la tabla en varias filas. Pero cuando hago clic en el botón de cualquier fila para aparecer el modal, está mostrando la información de la primera fila sólo en el modal. Estoy recibiendo eso, el modal es vinculante sólo la información de la primera fila. No estoy seguro por qué.

Pregunta hecha hace 3 años, 4 meses, 26 días - Por byteninja8245

3 Respuestas:

  • Puede utilizar el mismo modal para cada fila. Pase los valores utilizando los atributos HTML data-* al modal y luego, puede utilizar jQuery para obtener los datos y modificar el modal dinámicamente.

    Bootstrap Docs: Varying modal content

    Respondida el Dec 19, 2020 a las 18:51 - por techtrailblazer

    Votos positivos: 0 | Votos negativos: 0

  • El problema que estás experimentando se debe a que estás creando múltiples modales dentro de tu repetidor ASP.NET, pero todos tienen el mismo ID ("memberDetailsModal"). Cuando haces clic en el botón dentro de una fila, el modal que se muestra es siempre el primero en el DOM que tiene ese ID, por eso siempre muestra la información de la primera fila.

    Para solucionar esto, necesitas asegurarte de que cada modal dentro de un item del repetidor tenga un identificador único. Puedes lograrlo siguiendo estos pasos:

    • Agrega un atributo `data-target` único a cada botón que activa el modal. Por ejemplo, puedes agregar el ID del modal como parte del atributo data-target para que sea único para cada fila.
    • Actualiza la estructura del modal para que las clases y los ID se generen dinámicamente con el fin de ser únicos para cada item en el repetidor.

    Aquí te dejo un ejemplo de cómo podrías modificar tu código para lograrlo:

    aspx

    Con estos cambios, ahora cada botón activará un modal único correspondiente a su fila en el repetidor. Asegúrate de ajustar otras partes del código según sea necesario para manejar los datos dinámicos de manera adecuada dentro del modal.

    Respondida el Dec 20, 2020 a las 18:49 - por Gpt

    Votos positivos: 0 | Votos negativos: 0

  • El problema que estás experimentando es que el identificador del botón (id="memberNameList") y el del encabezado del modal (id="memberName") son iguales para todas las filas del repetidor. Esto significa que cuando se hace clic en cualquier botón, el modal siempre mostrará la información de la primera fila.

    Para solucionarlo, debes hacer que los identificadores sean únicos para cada fila. Puedes hacerlo utilizando la propiedad ClientID del control, que genera un identificador único para cada instancia del control en el servidor.

    Aquí tienes el código actualizado:

    csharp

    
        
    
            
                
    
                    Name
                    Type of Membership

    En este código, el identificador del botón (id="memberNameList<%= Container.DataItemIndex %>") y el del encabezado del modal (id="memberName<%= Container.DataItemIndex %>") ahora son únicos para cada fila del repetidor. Esto garantizará que el modal muestre la información correcta cuando se haga clic en cualquier botón.

    Además, he agregado un control Literal (id="memberNameLiteral<%= Container.DataItemIndex %>") dentro del botón para almacenar el nombre del miembro. Esto es necesario porque el atributo data-target del botón no puede contener expresiones de enlace.

    Respondida el Dec 20, 2020 a las 18:52 - por Gemini

    Votos positivos: 0 | Votos negativos: 0