DataGrid에서 행의 배경색을 변경하십시오.

데이터 그릿이 있고 행에 체크 박스가 있습니다. 체크 박스를 클릭하면 행의 배경색을 변경하고 싶습니다. 예제 코드 :DataGrid에서 행의 배경색을 변경하십시오.

<asp:DataGrid ID="Grid" runat="server" DataKeyField="KeyID" CssClass="grid" 
         AutoGenerateColumns="False" CellPadding="10" ForeColor="#333333" 
          GridLines="None" OnPageIndexChanged="Grid_PageIndexChanged" 
         OnEditCommand="Grid_EditCommand" OnDeleteCommand="GetResult" 
          onitemdatabound="Grid_ItemDataBound" > 
         <Columns> 

          <HeaderTemplate> 
            <input id="chkAllItems" type="checkbox" onclick="javascript:HeaderClick(this);"/> 
          </HeaderTemplate> 
          <ItemTemplate> 
            <asp:CheckBox runat="server" Text='<%#DataBinder.Eval(Container.DataItem, "KeyID")%>' ID="checkBoxID" AutoPostBack="false" OnClick="chechkedChanged(this);" ></asp:CheckBox> 
          </ItemTemplate> 
         </asp:TemplateColumn> 
         <asp:TemplateColumn> 
          <HeaderTemplate> 
            <label for="male">Category</label> 
          </HeaderTemplate> 
          <ItemTemplate> 
            <asp:TextBox Text="" ID="Category" runat="server" AutoPostBack="false" MaxLength="10" CssClass="tb5" > </asp:TextBox> 
          </ItemTemplate> 
         </asp:TemplateColumn> 
         <asp:EditCommandColumn EditText="Edit" CancelText="Cancel" UpdateText="Update" HeaderText="Edit"> 
         </asp:EditCommandColumn> 
         <asp:ButtonColumn CommandName="Delete" HeaderText="TDK" Text="tdk"></asp:ButtonColumn> 

         </Columns> 
         <FooterStyle BackColor="#990000" Font-Bold="True" ForeColor="White" /> 
         <SelectedItemStyle BackColor="#FFCC66" Font-Bold="True" ForeColor="Navy" /> 
         <PagerStyle BackColor="#FFCC66" ForeColor="#333333" HorizontalAlign="Center" Mode="NumericPages" /> 
         <AlternatingItemStyle BackColor="#FAAC58" /> 
         <ItemStyle BackColor="#81DAF5" ForeColor="#333333" /> 
         <HeaderStyle BackColor="#990000" Font-Bold="True" ForeColor="White" /> 
       </asp:DataGrid>

자바 스크립트에서 행의 배경색을 어떻게 바꿀 수 있습니까?

출처

2013-02-21 RockOnGom

이전 질문에서 대답을 제공했습니다 ...... http://stackoverflow.com/questions/14993565/the-server-tag-is-not-well-formed-databinder-eval – MikeSmithDev

내 간단한 GridView 컨트롤에는 확인란, 부서 번호, 부서 이름, 위치 열이 포함되어 있습니다.

CheckBox를 클릭하면 해당 행 배경색이 빨간색 배경으로 바뀝니다. .aspx 페이지 내의 Javascript 코드는 사용자의 기능을 달성하는 데 중요한 역할을합니다.

.ASPX 코드는 다음과 같습니다 :

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
    <script type="text/javascript"> 
     function ChangeBackgroundColor(checkBox1) { 
      var parent = document.getElementById("<%= GridView1.ClientID %>"); 
      var items = parent.getElementsByTagName("input"); 
      for (i = 0; i < items.length; i++) { 
       if ((items[i].type == "checkbox") && (items[i].checked)) { 
        alert(items[i].id + ' is checked'); 
        items[i].parentElement.parentElement.style.backgroundColor = "Red"; 
       } 
      } 
     } 
    </script> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 
     <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" 
      onrowdatabound="GridView1_RowDataBound"> 
      <Columns> 
       <asp:TemplateField> 
        <ItemTemplate> 
         <asp:CheckBox ID="CheckBox1" onclick="javascript:ChangeBackgroundColor(this);" runat="server" /> 
        </ItemTemplate> 
       </asp:TemplateField> 
       <asp:TemplateField HeaderText="Dept No"> 
        <ItemTemplate> 
         <asp:Label ID="Label2" runat="server" Text='<%# Bind("DeptNo") %>'></asp:Label> 
        </ItemTemplate> 
       </asp:TemplateField> 
       <asp:TemplateField HeaderText="Dept name"> 
        <ItemTemplate> 
         <asp:Label ID="Label3" runat="server" Text='<%# Bind("DName") %>'></asp:Label> 
        </ItemTemplate> 
       </asp:TemplateField> 
       <asp:TemplateField HeaderText="Location"> 
        <ItemTemplate> 
         <asp:Label ID="Label4" runat="server" Text='<%# Bind("LOC") %>'></asp:Label> 
        </ItemTemplate> 
       </asp:TemplateField> 
      </Columns> 
     </asp:GridView> 
    </div> 
    </form> 
</body> 
</html>

코드 코드는 아래와 같습니다 뒤에.

SqlConnection objConn = new SqlConnection(System.Web.Configuration.WebConfigurationManager.ConnectionStrings["STERIAConnectionString"].ConnectionString); 
protected void Page_Load(object sender, EventArgs e) 
{ 
    var objCmd = new SqlCommand("SELECT * FROM DEPT", objConn); 
    objConn.Open(); 
    GridView1.DataSource = objCmd.ExecuteReader(); 
    GridView1.DataBind(); 
    objConn.Close(); 
} 

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e) 
{ 
    if (e.Row.RowType == DataControlRowType.DataRow) 
    { 
     var checkbox1 = e.Row.FindControl("CheckBox1") as CheckBox; 
     checkbox1.Attributes.Add("OnClick","return ChangeBackgroundColor('checkbox1');"); 
    } 
}

이 코드가 도움이 될 것입니다. 좀 더 도움이 필요하면 알려줘.

출처

2013-02-21 06:58:36

DataGrid에서 행의 배경색을 변경하십시오.

답변

관련 문제