Foren

Altering the row css style of search container, for one portlet

thumbnail
Brian Jamieson, geändert vor 12 Jahren.

Altering the row css style of search container, for one portlet

Junior Member Beiträge: 51 Beitrittsdatum: 15.10.10 Neueste Beiträge
HI folks,

I'm trying to get a 'status like' row color to appear on one of my portlets.

I looked at the source of the Update Manager portlet, and it gave me a clue.

I don't want to programmatically build the search container the way that Update Manager does, and I came up with this partial solution:

In the jsp I have this:
<liferay-ui:search-container-row rowvar="thisrow" classname="com.cwfi.lines.model.CWFIJob" keyproperty="jobId" modelvar="job">
&lt;% thisrow.setClassName("cwfi-job-status-" + job.getJobStatus().toLowerCase()); %&gt;</liferay-ui:search-container-row>


and in my css I have this:
.cwfi-job-status-draft {
	background-color: #FFC;
}
.cwfi-job-status-rejected {
	background-color: #F30;
}
.cwfi-job-status-complete {
	background-color: #6C9;
}
...


It works a treat, except for the 'alternate' rows, they get the css class attributes overridden completely.

Is there a way to turn off the alternate styling of the rows in a single search container, I haven't been able to find it.

Thanks,

Brian
thumbnail
Brian Jamieson, geändert vor 12 Jahren.

RE: Altering the row css style of search container, for one portlet

Junior Member Beiträge: 51 Beitrittsdatum: 15.10.10 Neueste Beiträge
Bump,

Is it possible to remove the 'striping' in the search container, on a single search container ? Not portal wide ?
thumbnail
jelmer kuperus, geändert vor 12 Jahren.

RE: Altering the row css style of search container, for one portlet

Liferay Legend Beiträge: 1191 Beitrittsdatum: 10.03.10 Neueste Beiträge
1. you probably should be using <liferay-ui:search-container-row-parameter name="className" value="<%= "cwfi-job-status-" + job.getJobStatus().toLowerCase(); %>" /> instead of that scriptlet

2. looking at https://github.com/liferay/liferay-portal/blob/master/portal-web/docroot/html/taglib/ui/search_iterator/page.jsp it seems that your own className would be set as well as the portlet-section-alternate results-row alt styles. So if you are not seeing the result you expect it is probably because your css rules are less explicit than the ones defined used by liferay. Something like this might work :

div.results-grid tr.cwfi-job-status-draft td {
   background-color: #FFC;
}
thumbnail
Brian Jamieson, geändert vor 12 Jahren.

RE: Altering the row css style of search container, for one portlet (Antwort)

Junior Member Beiträge: 51 Beitrittsdatum: 15.10.10 Neueste Beiträge
Jelmer and Pam nailed this one for me (thanks folks), but I thought I'd give everything I've done:

In the css file I have styles such as:


.portlet-section-body.results-row.cwfi-job-status-draft td {
	background-color: #FFFFCC;
}
.portlet-section-alternate.results-row.alt.cwfi-job-status-draft td{
	background-color: #F4F4C1;
}
.portlet-section-body.results-row.cwfi-job-status-complete td {
	background-color: #F4FDEF;
}
.portlet-section-alternate.results-row.alt.cwfi-job-status-complete td{
	background-color: #F4FDEF;
}


And in the jsp I have:


<liferay-ui:search-container-row rowvar="thisrow" classname="com.cwfi.lines.model.CWFIJob" keyproperty="jobId" modelvar="job">

		&lt;% thisrow.setClassName("cwfi-job-status-" + job.getJobStatus().toLowerCase()); %&gt;
		...
		...
</liferay-ui:search-container-row>


This works in 6.0.6ce , and is not yet confirmed for 6.1
Pam Griffith, geändert vor 12 Jahren.

RE: Altering the row css style of search container, for one portlet

New Member Beiträge: 8 Beitrittsdatum: 16.09.10 Neueste Beiträge
It looks like setClassName works on all the rows now emoticon