Outsider's Dev Story

Stay Hungry. Stay Foolish. Don't Be Satisfied.
RetroTech 팟캐스트 44BITS 팟캐스트

그리드뷰에서 마우스오버시 색 바꾸기

ASP.NET 2.0에서는 그리드뷰(Grid View)라는 서버컨트롤을 이용해서 리스트를 쉽게 만들어 줄수 있는데 Row와 AlternatingRow를 이용해서 짝수줄의 색은 다르게 나타내어 줄 수 있다.

하지만 보통의 게시판들이 그렇듯이 Row에 마우스가 오버가 되었을 때 색이 바뀐다면 훨씬 직관적으로 보여줄 수 있다.

Grid View에서 RowDataBound 이벤트에 메서드를 만들어 준다.

여기선 그리드뷰의 이름이 AllItemGridView이다.


//그리드 뷰의 마우스 오버시 색 바꾸기
protected void AllItemGridView_RowDataBound(object sender, GridViewRowEventArgs e)
{
    //Row가 DateRow일때만 적용하기 위해서    
    if (e.Row.RowType == DataControlRowType.DataRow) 
    {
        //마우스 오버시에 변할 색
        e.Row.Attributes["onMouseOver"] = "this.style.backgroundColor='#ffecf0';"; 
        //Alternate와 Row의 색을 다르게 주었기 때문에
        if (e.Row.RowState.ToString() == "Alternate") 
        {
            //마우스 아웃시에는 다시 원래색으로 바꾸어 주기 위해서
            e.Row.Attributes["onMouseOut"] = "this.style.backgroundColor='#E6E6E6';"; 
        }
        else //AlternateRow가 아닌경우에는 원래색으로
        {
            // Row의 색을 입력한다.
            e.Row.Attributes["onMouseOut"] = "this.style.backgroundColor='';"; 
        }
    }
}

ASP.NET의 CS단에서는 색상코드가 약칭(aqua, red)은 먹지 않더라는;;;;;

2007/07/18 00:43 2007/07/18 00:43