Usuwanie pionowych linii w jqGrid

Question

Chcę usunąć wiersze wyświetlane na obrazku jqGrid. Jak mogę to usunąć?

Answer 1

jqGrid buduje kilka dodatkowych elementów div nad tabelą siatki głównej. Zewnętrzny div ma klasę ui-jqgrid. Więc jeśli trzeba usunąć prawy i lewy brzeg istniejących na całej siatce można użyć następującego CSS:

.ui-jqgrid { border-right-width: 0px; border-left-width: 0px; } 

Jeśli trzeba usunąć Granic Wszelkie Siatka może użyć

.ui-jqgrid { border-width: 0px; } 

Jeśli chcesz dodatkowo usunąć granicę pionową pomiędzy komórkami w siatce można użyć

.ui-jqgrid tr.ui-row-ltr td { border-right-color: transparent; } 

Aby usunąć poziomą granicę między rzędami można użyć

.ui-jqgrid tr.ui-row-ltr td { border-bottom-color: transparent; } 

Aby usunąć granice pionowe między nagłówki kolumn można użyć

th.ui-th-column { border-right-color: transparent !important } 

lub alternatywnie (bez użycia !important)

.ui-jqgrid-labels .ui-th-column { border-right-color: transparent } 

(Zobacz the old answer)

Więc może wybrać style, które potrzebujesz, w zależności od Twoich konkretnych wymagań. The demo wykazać wyniki na zastosowanie wszystkich wyżej stylów CSS:

Answer 2

Jeśli chcesz usunąć granicę przez CSS to oznacza, że ​​trzeba zmienić granicę jako none jak poniżej.

W pliku CSS, jQuery-UI-1.8.1.custom.css (linia 53):

#divid .ui-widget-content { 
     background: url("images/ui-bg_inset-hard_100_fcfdfd_1x100.png") repeat-x scroll 50% bottom #FCFDFD; 
     border: 0 none; 
     color: #222222; 
    } 

Answer 3

Zamiast zmieniać CSS w custom.css swój plik, można zrobić coś takiego w swoim inline CSS:

.ui-widget-content table#YourTableId { border: 0px !important; } 

nie zapomnij !important, zastąpi on CSS zdefiniowany dla tabeli w niestandardowy plik CSS.