2

GridView のスタイルを (jQuery と組み合わせてtablesorter) 行の色を交互に変えながら、列のグループ化ごとに色のセットを変更することはできますか? 下の画像を参照してください。

サンプル画像

現在、作成した配列に基づいてセルの背景色をハードコーディングしています。たとえば、greenArray は (0,1,2,3) に設定された整数配列であり、purpleArray は (4,5,6,7) などです。 、tablesorterプラグインを使用すると、明らかにセルの色が保持され、交互の配色が台無しになります。

ここに画像の説明を入力

編集:現在、VB.NET で背景色を追加しています。次の関数は、配列を定義してから、実際にスタイリングを適用する ColorizeMe() 関数を呼び出します。

Private Sub StyleTable(ByVal sender As Object, ByVal e As GridViewRowEventArgs) Handles gvReport.RowDataBound

            'Define arrays to color the gridview, if cell index is in array, it will be colored
            Dim blueArray() As Integer = {0, 17, 18, 19, 20}
            Dim greenArray() As Integer = {1, 2, 3, 4}
            Dim purpleArray() As Integer = {5, 6, 7, 8}
            Dim pinkArray() As Integer = {9, 10, 11, 12}
            Dim yellowArray() As Integer = {13, 14, 15, 16}

            _packworks.ColorizeMe(blueArray, greenArray, purpleArray, pinkArray, yellowArray, e.Row)

End Sub

そして ColorizeMe() 関数:

Public Sub ColorizeMe(ByVal blueArray() As Integer, ByVal greenArray() As Integer, _
                                 ByVal purpleArray() As Integer, ByVal pinkArray() As Integer, _
                                 ByVal yellowArray() As Integer, ByVal row As GridViewRow)
            Dim i As Integer = 0

            For Each cell As TableCell In row.Cells
                If Array.IndexOf(blueArray, i) <> -1 Then
                    If _isDark Then 'Color account column
                        cell.BackColor = ColorTranslator.FromHtml("#B0C4DE")
                    Else
                        cell.BackColor = ColorTranslator.FromHtml("#E6E6FA")
                    End If
                ElseIf Array.IndexOf(greenArray, i) <> -1 Then
                    If _isDark Then
                        cell.BackColor = ColorTranslator.FromHtml("#a4d5a8")
                    Else
                        cell.BackColor = ColorTranslator.FromHtml("#ddf5de")
                    End If
                ElseIf Array.IndexOf(purpleArray, i) <> -1 Then
                    If _isDark Then
                        cell.BackColor = ColorTranslator.FromHtml("#ada4d4")
                    Else
                        cell.BackColor = ColorTranslator.FromHtml("#c7c6f4")
                    End If
                ElseIf Array.IndexOf(pinkArray, i) <> -1 Then
                    If _isDark Then
                        cell.BackColor = ColorTranslator.FromHtml("#e3b3e0")
                    Else
                        cell.BackColor = ColorTranslator.FromHtml("#fae1fa")
                    End If
                ElseIf Array.IndexOf(yellowArray, i) <> -1 Then
                    If _isDark Then
                        cell.BackColor = ColorTranslator.FromHtml("#e0e3ab")
                    Else
                        cell.BackColor = ColorTranslator.FromHtml("#f5f8dd")
                    End If
                End If

                i += 1
            Next

            _isDark = Not _isDark
        End Sub
4

1 に答える 1