How to change the color of the Repeater line at runtime

Asked

Viewed 324 times

1

How do I change the line color Repeater running ? Repeater lines are loaded through what comes from the database.

Example: If there are 3 lines, when displaying in Peater, the first line is of one color, the second of another and the third of another etc.

My code:

//ASPX

<asp:Repeater ID="repeater1" runat="server">
 <HeaderTemplate>
  <tr>
  <!-- Coluna Compra -->
   <td class="aFaturarTopo"><i>Qtde.</i></td>
   <td class="aFaturarTopo"><i>Valor</i></td>
  <!-- Coluna Devolução -->
   <td class="aFaturarTopo"><i>Qtde.</i></td>
   <td class="aFaturarTopo"><i>Valor</i></td>
  <!-- Coluna Retorno -->
   <td class="aFaturarTopo"><i>Qtde.</i></td>
   <td class="aFaturarTopo"><i>Valor</i></td>
  <!-- Coluna Venda -->
   <td class="aFaturarTopo"><i>Qtde.</i></td>
   <td class="aFaturarTopo"><i>Valor</i></td>     
  <!-- Coluna Doação -->
   <td class="aFaturarTopo"><i>Qtde.</i></td>
   <td class="aFaturarTopo"><i>Valor</i></td>
  <!-- Coluna Reenvio -->
   <td class="aFaturarTopo"><i>Qtde.</i></td>
   <td class="aFaturarTopo"><i>Valor</i></td>
  </tr>
</HeaderTemplate>
    <ItemTemplate>
      <tr>
      <td colspan="2" class="tbFundoH">
      <asp:Label ID="Label4" class="fontlbl" runat="server" Text='<%# Eval("Categorias") %>'></asp:Label>
      </td>
    <!-- Coluna Compra -->
    <td id="colCompraQtdeCat" class="tbFundoH">
    <asp:Label ID="Label8" class="fontlbl" runat="server" Text='<%# Eval("qtdCompraCat") %>'></asp:Label>
    </td>
    <td id="colCompraValorCat" class="tbFundoH">
    <asp:Label ID="Label9" class="fontlbl" runat="server" Text='<%# string.Format("{0:C}", Eval("valorCompraCat")).Replace("R$", "") %>'></asp:Label>
    </td>
  <!-- Coluna Devolução -->
    <td id="colDevolucaoQtdeCat" class="tbFundoH">
    <asp:Label ID="Label35" class="fontlbl" runat="server" Text='<%# Eval("qtdDevolucaoCat") %>'></asp:Label>
    </td>
    <td id="colDevolucaoValorCat" class="tbFundoH">
    <asp:Label ID="Label47" class="fontlbl" runat="server" Text='<%# string.Format("{0:C}", Eval("valorDevolucaoCat")).Replace("R$", "") %>'></asp:Label>
    </td>
  <!-- Coluna Retorno -->
    <td id="colRetornoQtdeCat" class="tbFundoH">
    <asp:Label ID="Label48" class="fontlbl" runat="server" Text='<%# Eval("qtdRetornoCat") %>'></asp:Label>
    </td>
    <td id="colRetornoValorCat" class="tbFundoH">
    <asp:Label ID="Label49" class="fontlbl" runat="server" Text='<%# string.Format("{0:C}", Eval("valorRetornoCat")).Replace("R$", "") %>'></asp:Label>
    </td>
 <!-- Coluna Venda -->
   <td id="colVendaQtdeCat" class="tbFundoH">
   <asp:Label ID="Label50" class="fontlbl" runat="server" Text='<%# Eval("qtdVendaCat") %>'></asp:Label>
    </td>
   <td id="colVendaValorCat" class="tbFundoH">
                                                        <asp:Label ID="Label51" class="fontlbl" runat="server" Text='<%# string.Format("{0:C}", Eval("valorVendaCat")).Replace("R$", "") %>'></asp:Label>
   </td>
 <!-- Coluna Doação -->
   <td id="colDoacaoQtdeCat" class="tbFundoH">
   <asp:Label ID="Label52" class="fontlbl" runat="server" Text='<%# Eval("qtdDoacaoCat") %>'></asp:Label>
   </td>
   <td id="colDoacaoValorCat" class="tbFundoH">
   <asp:Label ID="Label53" class="fontlbl" runat="server" Text='<%# string.Format("{0:C}", Eval("valorDoacaoCat")).Replace("R$", "") %>'></asp:Label>
   </td>
  <!-- Coluna Reenvio -->
    <td id="colReenvioQtdeCat" class="tbFundoH">
    <asp:Label ID="Label54" class="fontlbl" runat="server" Text='<%# Eval("qtdReenvioCat") %>'></asp:Label>
        </td>
      <td id="colReenvioValorCat" class="tbFundoH">
     <asp:Label ID="Label55" class="fontlbl" runat="server" Text='<%# string.Format("{0:C}", Eval("valorReenvioCat")).Replace("R$", "") %>'></asp:Label>
     </td>
     </tr>                             
       </ItemTemplate>
    <FooterTemplate>
    </FooterTemplate>
     </asp:Repeater>
c# asp.net

  • What would that run time be? Some link, in the upload or something like?

  • @Marconi No, The Repeater lines are loaded according to what comes from the database. Type carry 3 lines, need the first to be type light gray, the second dark gray, third light gray etc.

  • Makes this configuration line by line in the Item_databound Repeater event

  • @Marconi can tell me how you do it ?

  • The answer below doesn’t help you @Andreeh?

  • @Marconi, not pq will be only in the lines of the Itemtemplate and not in the whole Peater. Type a line with one color, the other with another color. You can do this with Item_databound ?

  • @Andreeh If needed for the header (thead) and footer (tfoot) also, just don’t use the selector tbody.

Show 2 more comments

1 answer

3

Judging by <tr> and <td> in the Repeater, you will have a table outside the Repeater. Use CSS to place the class in the table:

HTML:

<table class="table-striped">
    <asp:repetear..
    ...
</table>

CSS:

.table-striped tr:nth-child(odd) td {
  background-color: #cor-1;
}
.table-striped tr:nth-child(even) td {
  background-color: #cor-2;
}

Browser other questions tagged c# asp.net

You are not signed in. Login or sign up in order to post.