如何动态更改CSS样式

我试图将中继器的CSS样式更改为不同状态下的不同颜色。预期的输出是打印6种不同的状态，如：正在进行中，完成，撤回等等。目前它具有单一颜色，因此它只显示一种颜色。这里具有挑战性的部分是根据状态动态改变颜色。我如何实现这一目标？目前它基于下面的“status noAction text-center”类来拉取样式。我应该在代码后面进行任何更改还是仅仅是前端css更改。有人可以给我一个例子，请。如何动态更改CSS样式

的.aspx代码：

<div class="row"> 
       <asp:Repeater ID="rptStatuses" runat="server"> 
        <ItemTemplate> 
         <div class="col-md-4 col-sm-4"> 
          <div class="status noAction text-center"> 
           <div class="banner"> 

            <asp:Label runat="server"> <%# Eval("ID") %></asp:Label> 
           </div> 
           <div class="label"><%# Eval("Name") %></div> 
          </div> 
         </div> 
        </ItemTemplate> 
       </asp:Repeater>

的.cs代码相关部分

private void GB() 
     { 

      var surveyId = 55; 
      var stateLabels = _manageDatasets.GetStateLabels(surveyId); 
      List<Status> statusesList = new List<Status>(); 
      foreach (var sl in stateLabels) 
      { 
       if (sl.Key != -1) 
        statusesList.Add(new Status { ID = sl.Key.ToString(), Name = sl.Value } 
       ); 
      } 
      this.rptStatuses.DataSource = statusesList; 
      this.rptStatuses.DataBind(); 
}

来源

2017-06-22 user3147594

我想你想要做的是改变类在你的HTML，只是使用的嵌入代码是能够根据状态动态更改横幅颜色等。要嵌入的代码会是这个样子 -

<div class="col-md-4 col-sm-4"> 
    <% if(status == "noAction") { %> 
     <div class="status noAction text-center"> 
      <div class="banner"> 

       <asp:Label runat="server"> <%# Eval("ID") %></asp:Label> 
      </div> 
      <div class="label"><%# Eval("Name") %></div> 
     </div> 
    <% } %>

来源

2017-06-22 20:33:06 Trey50Daniel

如果你从哪里直放站越来越数据源，那么这将是很容易做到类似的东西

<asp:Repeater ID="rptStatuses" runat="server"> 
       <ItemTemplate> 
        <div class="col-md-4 col-sm-4"> 
         <div class='<%# Convert.toInt32(eval("ActionColumnName"))==1 ? "status In progress text-center" : Convert.toInt32(eval("ActionColumnName"))==2 ? "status complete text-center" : Convert.toInt32(eval("ActionColumnName"))==3 ? "status withdrawn text-center" : "status noAction text-center" '> 
          <div class="banner"> 

           <asp:Label runat="server"> <%# Eval("ID") %></asp:Label> 
          </div> 
          <div class="label"><%# Eval("Name") %></div> 
         </div> 
        </div> 
       </ItemTemplate> 
      </asp:Repeater>

在你表中的任何列

来源

2017-06-22 23:27:31

如何动态更改CSS样式

回答

相关问题