Проблема с data-toggle = "buttons" в Bootstrap - PullRequest
0 голосов
/ 12 июля 2020

спасибо за вашу помощь. Я хочу применить атрибут data-toggle="buttons" к кнопкам, которые я показываю в таблице. Я добился этого, поместив атрибут в тег <tbody>, как показано ниже <tbody data-toggle="buttons">.

Проблема 1 Сделав это, я заметил, что не могу щелкнуть какой-нибудь тег <details>. Я предполагаю, что они видны как кнопки благодаря атрибуту.

The details tag I can't click on

Problem 2 Also, I want to apply the data-toggle="buttons"attribute to a button of columns from a table but can't figure out how to select just that column to apply that attribute yet.

I want to select all buttons from columns Ct and alpha, from the table of the image below to apply the data-toggle="buttons" attribute to each column so when a button is selected from each column I will see two selected button instead of just one.

Ct and alpha columns

Here is my code for the Problem 1:

 Типо де перфиль  Описание       Perfil de roca comptente      Perfil de roca de rigidez media      
más información

Perfiles de suelos muy densos o roca blanda, que cumplan con el criterio de velocidad de la onda de cortante, o
Perfiles de suelos muy densos o roca blanda, que cumplan con cualquiera de los dos критерий ios

más información

Perfiles de suelos rígidos que cumplan con el критерий скорости движения онда-де-cortante, o
Perfiles de suelos rígidos que cumplan cualquiera de las dos condiciones

más información

Perfil que cumpla el qualerio de velocidad de la onda de cortante, o
Perfil que contiene un espesor total H mayor de 3 m de arcillas blandas

>
más información

Véase Tabla 2: Clasificación de los perfiles de suelo y la sección 10.5.4 de la Norma Ecuatoriana de la Construcción, NE C -SE-DS 2015

И вот код для Проблема 2:

<table class="table table-responsive">
                    <thead class="thead-light">
                        <tr>
                            <th scope="col">Tipo de estructura</th>
                            <th scope="col">C<sub>t</sub></th>
                            <th scope="col">&alpha;</th>
                        </tr>
                    </thead>
                    <tbody data-toggle="buttons">
                        <tr>
                            <th scope="row">Estructuras de acero</th>
                        </tr>

                        <tr>
                            <td scope="row">Sin arriostramiento</td>

                            <td>
                                <label>
                                    <div class="btn btn-outline-primary">
                                        <input type="radio" name="Ct" id="ctop1" value="0.072" checked> <span>0.072</span>
                                    </div>
                                </label>
                            </td>

                            <td>
                                <label>
                                    <div class="btn btn-outline-secondary">
                                        <input type="radio" name="alfa" id="alfaop1" value="0.80" checked> <span>0.80</span>
                                    </div>
                                </label>
                            </td>
                        </tr>

                        <tr>
                            <td scope="row">Con arriostramiento</td>
                            <td>
                                <label>
                                    <div class="btn btn-outline-primary">
                                        <input type="radio" name="Ct" id="ctop2" value="0.073"> <span>0.073</span>
                                    </div>
                                </label>
                            </td>

                            <td>
                                <label>
                                    <div class="btn btn-outline-secondary">
                                        <input type="radio" name="alfa" id="alfaop2" value="0.75"> <span>0.75</span>
                                    </div>
                                </label>
                            </td>
                        </tr>

                        <tr>
                            <th scope="row">Pórticos especiales de hormigón armado</th>
                        </tr>

                        <tr>
                            <td scope="row">Sin muros estructurales ni diagonales rigidizadoras</td>
                            <td>
                                <label>
                                    <div class="btn btn-outline-primary">
                                        <input type="radio" name="Ct" id="ctop3" value="0.055"> <span>0.055</span>
                                    </div>
                                </label>
                            </td>

                            <td>
                                <label>
                                    <div class="btn btn-outline-secondary">
                                        <input type="radio" name="alfa" id="alfaop3" value="0.90"> <span>0.90</span>
                                    </div>
                                </label>
                            </td>
                        </tr>

                        <tr>
                            <td scope="row">Con muros estructurales o diagonales rigidizadoras y para otras
                                estructuras
                                basadas en muros estructurales y mampostería estructural
                            </td>
                            <td>
                                <label>
                                    <div class="btn btn-outline-primary">
                                        <input type="radio" name="Ct" id="ctop4" value="0.055"> <span>0.055</span>
                                    </div>
                                </label>
                            </td>

                            <td>
                                <label>
                                    <div class="btn btn-outline-secondary">
                                        <input type="radio" name="alfa" id="alfaop4" value="0.75"> <span>0.75</span>
                                    </div>
                                </label>
                            </td>
                        </tr>

                    </tbody>
                </table>

Большое спасибо за помощь мне в этом! :)

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...