How to leave the last TR width of the bootstrap table size?

Navigation
0

I have the following table: 

  <div class="col-xs-8 col-sm-8 col-md-8 col-lg-8  col-xs-offset-2 col-sm-offset-2 col-md-offset-2 col-lg-offset-2">
    <h3 class=" text-center">Treino 1 para o aluno: Y</h3>
    <table class="table table-striped table-bordered">
      <thead>
        <tr>
          <th class="text-center">Exercício</th>
          <th class="text-center">Distancia</th>
          <th class="text-center">Intervalo</th>
          <th class="text-center">%esf</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <th>Aquecimento</th>
          <td class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
            <div class="centralizar">
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class=" row  col-md-4 ">
                <select class="form-control" id="sel1">
                  <option>25m</option>
                  <option>50m</option>
                  <option>75m</option>
                  <option>100m</option>
                  <option>125m</option>
                  <option>150m</option>
                  <option>200m</option>
                  <option>250m</option>
                  <option>300m</option>
                  <option>350m</option>
                  <option>400m</option>
                  <option>500m</option>
                  <option>600m</option>
                  <option>700m</option>
                  <option>800m</option>
                  <option>900m</option>
                  <option>1000m</option>
                  <option>1500m</option>
                </select>
              </div>
            </div>

          </td>
          <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2"><input  type="text" class="form-control" id="number"></td>
          <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
            <select class="form-control" id="sel1">
              <option>50%</option>
              <option>60%</option>
              <option>65%</option>
              <option>70%</option>
              <option>80%</option>
              <option>85%</option>
              <option>90%</option>
              <option>100%</option>
            </select>
          </td>
        </tr>
        <tr>
          <th>Alternado</th>
          <td>
            <div class="centralizar">
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class=" row  col-md-4 ">
                <select class="form-control" id="sel1">
                  <option>25m</option>
                  <option>50m</option>
                  <option>75m</option>
                  <option>100m</option>
                  <option>125m</option>
                  <option>150m</option>
                  <option>200m</option>
                  <option>250m</option>
                  <option>300m</option>
                  <option>350m</option>
                  <option>400m</option>
                  <option>500m</option>
                  <option>600m</option>
                  <option>700m</option>
                  <option>800m</option>
                  <option>900m</option>
                  <option>1000m</option>
                  <option>1500m</option>
                </select>
              </div>
            </div>

          </td>
          <td><input  type="text" class="form-control" id="number"></td>
          <td>                    
            <select class="form-control" id="sel1">
              <option>50%</option>
              <option>60%</option>
              <option>65%</option>
              <option>70%</option>
              <option>80%</option>
              <option>85%</option>
              <option>90%</option>
              <option>100%</option>
            </select>
          </td>
        </tr>
        <tr>
          <th>Braços</th>
          <td>
            <div class="centralizar">
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class=" row  col-md-4 ">
                <select class="form-control" id="sel1">
                  <option>25m</option>
                  <option>50m</option>
                  <option>75m</option>
                  <option>100m</option>
                  <option>125m</option>
                  <option>150m</option>
                  <option>200m</option>
                  <option>250m</option>
                  <option>300m</option>
                  <option>350m</option>
                  <option>400m</option>
                  <option>500m</option>
                  <option>600m</option>
                  <option>700m</option>
                  <option>800m</option>
                  <option>900m</option>
                  <option>1000m</option>
                  <option>1500m</option>
                </select>
              </div>
            </div>

          </td>
          <td><input  type="text" class="form-control" id="number"></td>
          <td>                    
            <select class="form-control" id="sel1">
              <option>50%</option>
              <option>60%</option>
              <option>65%</option>
              <option>70%</option>
              <option>80%</option>
              <option>85%</option>
              <option>90%</option>
              <option>100%</option>
            </select>
          </td>
        </tr>
        <tr>
          <th>Resistência</th>
          <td>
            <div class="centralizar">
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class=" row  col-md-4 ">
                <select class="form-control" id="sel1">
                  <option>25m</option>
                  <option>50m</option>
                  <option>75m</option>
                  <option>100m</option>
                  <option>125m</option>
                  <option>150m</option>
                  <option>200m</option>
                  <option>250m</option>
                  <option>300m</option>
                  <option>350m</option>
                  <option>400m</option>
                  <option>500m</option>
                  <option>600m</option>
                  <option>700m</option>
                  <option>800m</option>
                  <option>900m</option>
                  <option>1000m</option>
                  <option>1500m</option>
                </select>
              </div>
            </div>

          </td>
          <td><input  type="text" class="form-control" id="number"></td>
          <td>                    
            <select class="form-control" id="sel1">
              <option>50%</option>
              <option>60%</option>
              <option>65%</option>
              <option>70%</option>
              <option>80%</option>
              <option>85%</option>
              <option>90%</option>
              <option>100%</option>
            </select>
          </td>
        </tr>
        <tr>
          <th>Pernas</th>
          <td>
            <div class="centralizar">
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class=" row  col-md-4 ">
                <select class="form-control" id="sel1">
                  <option>25m</option>
                  <option>50m</option>
                  <option>75m</option>
                  <option>100m</option>
                  <option>125m</option>
                  <option>150m</option>
                  <option>200m</option>
                  <option>250m</option>
                  <option>300m</option>
                  <option>350m</option>
                  <option>400m</option>
                  <option>500m</option>
                  <option>600m</option>
                  <option>700m</option>
                  <option>800m</option>
                  <option>900m</option>
                  <option>1000m</option>
                  <option>1500m</option>
                </select>
              </div>
            </div>

          </td>
          <td><input  type="text" class="form-control" id="number"></td>
          <td>                    
            <select class="form-control" id="sel1">
              <option>50%</option>
              <option>60%</option>
              <option>65%</option>
              <option>70%</option>
              <option>80%</option>
              <option>85%</option>
              <option>90%</option>
              <option>100%</option>
            </select>
          </td>
        </tr>
        <tr>
          <th>Educativo</th>
          <td>
            <div class="centralizar">
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class=" row  col-md-4 ">
                <select class="form-control" id="sel1">
                  <option>25m</option>
                  <option>50m</option>
                  <option>75m</option>
                  <option>100m</option>
                  <option>125m</option>
                  <option>150m</option>
                  <option>200m</option>
                  <option>250m</option>
                  <option>300m</option>
                  <option>350m</option>
                  <option>400m</option>
                  <option>500m</option>
                  <option>600m</option>
                  <option>700m</option>
                  <option>800m</option>
                  <option>900m</option>
                  <option>1000m</option>
                  <option>1500m</option>
                </select>
              </div>
            </div>

          </td>
          <td><input  type="text" class="form-control" id="number"></td>
          <td>                    
            <select class="form-control" id="sel1">
              <option>50%</option>
              <option>60%</option>
              <option>65%</option>
              <option>70%</option>
              <option>80%</option>
              <option>85%</option>
              <option>90%</option>
              <option>100%</option>
            </select>
          </td>
        </tr>
        <tr>
          <th>Progressivo</th>
          <td>
            <div class="centralizar">
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class=" row  col-md-4 ">
                <select class="form-control" id="sel1">
                  <option>25m</option>
                  <option>50m</option>
                  <option>75m</option>
                  <option>100m</option>
                  <option>125m</option>
                  <option>150m</option>
                  <option>200m</option>
                  <option>250m</option>
                  <option>300m</option>
                  <option>350m</option>
                  <option>400m</option>
                  <option>500m</option>
                  <option>600m</option>
                  <option>700m</option>
                  <option>800m</option>
                  <option>900m</option>
                  <option>1000m</option>
                  <option>1500m</option>
                </select>
              </div>
            </div>

          </td>
          <td><input  type="text" class="form-control" id="number"></td>
          <td>                    
            <select class="form-control" id="sel1">
              <option>50%</option>
              <option>60%</option>
              <option>65%</option>
              <option>70%</option>
              <option>80%</option>
              <option>85%</option>
              <option>90%</option>
              <option>100%</option>
            </select>
          </td>
        </tr>
        <tr>
          <th>Regenerativo</th>
          <td>
            <div class="centralizar">
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class="row  col-md-4">
                <select class="form-control" id="sel1">
                  <option>1x</option>
                  <option>2x</option>
                  <option>3x</option>
                  <option>4x</option>
                  <option>5x</option>
                  <option>6x</option>
                  <option>7x</option>
                  <option>8x</option>
                </select>
              </div>
              <div class=" row  col-md-4 ">
                <select class="form-control" id="sel1">
                  <option>25m</option>
                  <option>50m</option>
                  <option>75m</option>
                  <option>100m</option>
                  <option>125m</option>
                  <option>150m</option>
                  <option>200m</option>
                  <option>250m</option>
                  <option>300m</option>
                  <option>350m</option>
                  <option>400m</option>
                  <option>500m</option>
                  <option>600m</option>
                  <option>700m</option>
                  <option>800m</option>
                  <option>900m</option>
                  <option>1000m</option>
                  <option>1500m</option>
                </select>
              </div>
            </div>

          </td>
          <td><input  type="text" class="form-control" id="number"></td>
          <td>                    
            <select class="form-control" id="sel1">
              <option>50%</option>
              <option>60%</option>
              <option>65%</option>
              <option>70%</option>
              <option>80%</option>
              <option>85%</option>
              <option>90%</option>
              <option>100%</option>
            </select>
          </td>
        </tr>
      </tbody>
    </table>
  </div>

I need at the end of the table the last TR to be the total width of the table ( col-xs-8 col-sm-8 col-md-8 col-lg-8 ) and that has a text field, I tried several ways but I can not do that.

Edit1: The table in code is in the following structure: Iwouldliketoinsertanewrowattheendofthetable,thislineshouldhavethemaximumwidthofthetablelikethis: And finally on this last line put a text field with the same width of this line.

    
asked by anonymous 18.11.2017 / 17:29

1 answer

1

Hi, you made the whole table with 4 cells in each row. What you can do is concatenate the 4 cells at the end with colspan="number of cells" (which in your case is 4) 

        <div class="row">
            <tr>
                <td colspan="4">
                    <div class="centralizar">
                        <input type="text" class="form-control" id="seuID">
                    </div>
                </td>
            </tr>
        </div>

In this way, you will have a text field of the table width

Complete code: 

<html>
<head>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous">
</head>
<body>
    <div class="col-xs-8 col-sm-8 col-md-8 col-lg-8  col-xs-offset-2 col-sm-offset-2 col-md-offset-2 col-lg-offset-2">
        <h3 class=" text-center">Treino 1 para o aluno: Y</h3>
        <table class="table table-striped table-bordered">
          <thead>
            <tr>
              <th class="text-center">Exercício</th>
              <th class="text-center">Distancia</th>
              <th class="text-center">Intervalo</th>
              <th class="text-center">%esf</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <th>Aquecimento</th>
              <td class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
                <div class="centralizar">
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class=" row  col-md-4 ">
                    <select class="form-control" id="sel1">
                      <option>25m</option>
                      <option>50m</option>
                      <option>75m</option>
                      <option>100m</option>
                      <option>125m</option>
                      <option>150m</option>
                      <option>200m</option>
                      <option>250m</option>
                      <option>300m</option>
                      <option>350m</option>
                      <option>400m</option>
                      <option>500m</option>
                      <option>600m</option>
                      <option>700m</option>
                      <option>800m</option>
                      <option>900m</option>
                      <option>1000m</option>
                      <option>1500m</option>
                    </select>
                  </div>
                </div>

              </td>
              <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2"><input  type="text" class="form-control" id="number"></td>
              <td class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
                <select class="form-control" id="sel1">
                  <option>50%</option>
                  <option>60%</option>
                  <option>65%</option>
                  <option>70%</option>
                  <option>80%</option>
                  <option>85%</option>
                  <option>90%</option>
                  <option>100%</option>
                </select>
              </td>
            </tr>
            <tr>
              <th>Alternado</th>
              <td>
                <div class="centralizar">
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class=" row  col-md-4 ">
                    <select class="form-control" id="sel1">
                      <option>25m</option>
                      <option>50m</option>
                      <option>75m</option>
                      <option>100m</option>
                      <option>125m</option>
                      <option>150m</option>
                      <option>200m</option>
                      <option>250m</option>
                      <option>300m</option>
                      <option>350m</option>
                      <option>400m</option>
                      <option>500m</option>
                      <option>600m</option>
                      <option>700m</option>
                      <option>800m</option>
                      <option>900m</option>
                      <option>1000m</option>
                      <option>1500m</option>
                    </select>
                  </div>
                </div>

              </td>
              <td><input  type="text" class="form-control" id="number"></td>
              <td>                    
                <select class="form-control" id="sel1">
                  <option>50%</option>
                  <option>60%</option>
                  <option>65%</option>
                  <option>70%</option>
                  <option>80%</option>
                  <option>85%</option>
                  <option>90%</option>
                  <option>100%</option>
                </select>
              </td>
            </tr>
            <tr>
              <th>Braços</th>
              <td>
                <div class="centralizar">
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class=" row  col-md-4 ">
                    <select class="form-control" id="sel1">
                      <option>25m</option>
                      <option>50m</option>
                      <option>75m</option>
                      <option>100m</option>
                      <option>125m</option>
                      <option>150m</option>
                      <option>200m</option>
                      <option>250m</option>
                      <option>300m</option>
                      <option>350m</option>
                      <option>400m</option>
                      <option>500m</option>
                      <option>600m</option>
                      <option>700m</option>
                      <option>800m</option>
                      <option>900m</option>
                      <option>1000m</option>
                      <option>1500m</option>
                    </select>
                  </div>
                </div>

              </td>
              <td><input  type="text" class="form-control" id="number"></td>
              <td>                    
                <select class="form-control" id="sel1">
                  <option>50%</option>
                  <option>60%</option>
                  <option>65%</option>
                  <option>70%</option>
                  <option>80%</option>
                  <option>85%</option>
                  <option>90%</option>
                  <option>100%</option>
                </select>
              </td>
            </tr>
            <tr>
              <th>Resistência</th>
              <td>
                <div class="centralizar">
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class=" row  col-md-4 ">
                    <select class="form-control" id="sel1">
                      <option>25m</option>
                      <option>50m</option>
                      <option>75m</option>
                      <option>100m</option>
                      <option>125m</option>
                      <option>150m</option>
                      <option>200m</option>
                      <option>250m</option>
                      <option>300m</option>
                      <option>350m</option>
                      <option>400m</option>
                      <option>500m</option>
                      <option>600m</option>
                      <option>700m</option>
                      <option>800m</option>
                      <option>900m</option>
                      <option>1000m</option>
                      <option>1500m</option>
                    </select>
                  </div>
                </div>

              </td>
              <td><input  type="text" class="form-control" id="number"></td>
              <td>                    
                <select class="form-control" id="sel1">
                  <option>50%</option>
                  <option>60%</option>
                  <option>65%</option>
                  <option>70%</option>
                  <option>80%</option>
                  <option>85%</option>
                  <option>90%</option>
                  <option>100%</option>
                </select>
              </td>
            </tr>
            <tr>
              <th>Pernas</th>
              <td>
                <div class="centralizar">
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class=" row  col-md-4 ">
                    <select class="form-control" id="sel1">
                      <option>25m</option>
                      <option>50m</option>
                      <option>75m</option>
                      <option>100m</option>
                      <option>125m</option>
                      <option>150m</option>
                      <option>200m</option>
                      <option>250m</option>
                      <option>300m</option>
                      <option>350m</option>
                      <option>400m</option>
                      <option>500m</option>
                      <option>600m</option>
                      <option>700m</option>
                      <option>800m</option>
                      <option>900m</option>
                      <option>1000m</option>
                      <option>1500m</option>
                    </select>
                  </div>
                </div>

              </td>
              <td><input  type="text" class="form-control" id="number"></td>
              <td>                    
                <select class="form-control" id="sel1">
                  <option>50%</option>
                  <option>60%</option>
                  <option>65%</option>
                  <option>70%</option>
                  <option>80%</option>
                  <option>85%</option>
                  <option>90%</option>
                  <option>100%</option>
                </select>
              </td>
            </tr>
            <tr>
              <th>Educativo</th>
              <td>
                <div class="centralizar">
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class=" row  col-md-4 ">
                    <select class="form-control" id="sel1">
                      <option>25m</option>
                      <option>50m</option>
                      <option>75m</option>
                      <option>100m</option>
                      <option>125m</option>
                      <option>150m</option>
                      <option>200m</option>
                      <option>250m</option>
                      <option>300m</option>
                      <option>350m</option>
                      <option>400m</option>
                      <option>500m</option>
                      <option>600m</option>
                      <option>700m</option>
                      <option>800m</option>
                      <option>900m</option>
                      <option>1000m</option>
                      <option>1500m</option>
                    </select>
                  </div>
                </div>

              </td>
              <td><input  type="text" class="form-control" id="number"></td>
              <td>                    
                <select class="form-control" id="sel1">
                  <option>50%</option>
                  <option>60%</option>
                  <option>65%</option>
                  <option>70%</option>
                  <option>80%</option>
                  <option>85%</option>
                  <option>90%</option>
                  <option>100%</option>
                </select>
              </td>
            </tr>
            <tr>
              <th>Progressivo</th>
              <td>
                <div class="centralizar">
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class=" row  col-md-4 ">
                    <select class="form-control" id="sel1">
                      <option>25m</option>
                      <option>50m</option>
                      <option>75m</option>
                      <option>100m</option>
                      <option>125m</option>
                      <option>150m</option>
                      <option>200m</option>
                      <option>250m</option>
                      <option>300m</option>
                      <option>350m</option>
                      <option>400m</option>
                      <option>500m</option>
                      <option>600m</option>
                      <option>700m</option>
                      <option>800m</option>
                      <option>900m</option>
                      <option>1000m</option>
                      <option>1500m</option>
                    </select>
                  </div>
                </div>

              </td>
              <td><input  type="text" class="form-control" id="number"></td>
              <td>                    
                <select class="form-control" id="sel1">
                  <option>50%</option>
                  <option>60%</option>
                  <option>65%</option>
                  <option>70%</option>
                  <option>80%</option>
                  <option>85%</option>
                  <option>90%</option>
                  <option>100%</option>
                </select>
              </td>
            </tr>
            <tr>
              <th>Regenerativo</th>
              <td>
                <div class="centralizar">
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class="row  col-md-4">
                    <select class="form-control" id="sel1">
                      <option>1x</option>
                      <option>2x</option>
                      <option>3x</option>
                      <option>4x</option>
                      <option>5x</option>
                      <option>6x</option>
                      <option>7x</option>
                      <option>8x</option>
                    </select>
                  </div>
                  <div class=" row  col-md-4 ">
                    <select class="form-control" id="sel1">
                      <option>25m</option>
                      <option>50m</option>
                      <option>75m</option>
                      <option>100m</option>
                      <option>125m</option>
                      <option>150m</option>
                      <option>200m</option>
                      <option>250m</option>
                      <option>300m</option>
                      <option>350m</option>
                      <option>400m</option>
                      <option>500m</option>
                      <option>600m</option>
                      <option>700m</option>
                      <option>800m</option>
                      <option>900m</option>
                      <option>1000m</option>
                      <option>1500m</option>
                    </select>
                  </div>
                </div>

              </td>
              <td><input  type="text" class="form-control" id="number"></td>
              <td>                    
                <select class="form-control" id="sel1">
                  <option>50%</option>
                  <option>60%</option>
                  <option>65%</option>
                  <option>70%</option>
                  <option>80%</option>
                  <option>85%</option>
                  <option>90%</option>
                  <option>100%</option>
                </select>
              </td>
            </tr>
            <div class="row">
            <tr>
                <td colspan="4">
                    <div class="centralizar">
                        <input type="text" class="form-control" id="seuID">
                    </div>
                </td>
            </tr>
            </div>
          </tbody>
        </table>
      </div>

      <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
      <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js"integrity="sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh" crossorigin="anonymous"></script>
      <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js"integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ" crossorigin="anonymous"></script>
</body>

I hope I have helped: D

    
18.11.2017 / 18:35
Android WebService Error while using Android 4.2 How do I add an item to a listView when a click event occurs?