Forums de discussion
Search Container - how to style the alternate rows
Smilelws2010 lwz, modifié il y a 10 années.
Search Container - how to style the alternate rows
Regular Member Publications: 160 Date d'inscription: 16/12/10 Publications récentes
Hi
I am able to display results in a search container successfully. I need to give different styling for alternate search results.
Could someone help me in this?
How can I give different css classNames to each search result row based on whether they are even/odd records?
Could any one shed some light here?
Thanks a lot
Smile
I am able to display results in a search container successfully. I need to give different styling for alternate search results.
Could someone help me in this?
How can I give different css classNames to each search result row based on whether they are even/odd records?
Could any one shed some light here?
Thanks a lot
Smile
Pankaj Kathiriya, modifié il y a 10 années.
RE: Search Container - how to style the alternate rows
Liferay Master Publications: 722 Date d'inscription: 05/08/10 Publications récentes
There is already one class portlet-section-alternate for alternate rows in search-container.
Smilelws2010 lwz, modifié il y a 10 années.
RE: Search Container - how to style the alternate rows
Regular Member Publications: 160 Date d'inscription: 16/12/10 Publications récentes
Yes, thank you Pankaj. I found that, but how do I apply that each result row?
Below is the sample code - which display my table nicely. I want to give styling to alternate rows.
I found that you can use classNames "portlet-section-body results-row" , "portlet-section-alternate results-row alt"; but don't know how to use it.
Could some one help.
Thanks
Smile
Below is the sample code - which display my table nicely. I want to give styling to alternate rows.
I found that you can use classNames "portlet-section-body results-row" , "portlet-section-alternate results-row alt"; but don't know how to use it.
Could some one help.
Thanks
Smile
<liferay-ui:search-container>
<liferay-ui:search-container-results results="<%= ListUtil.subList(resultList, searchContainer.getStart(), searchContainer.getEnd()) %>" total="<%= resultCount%>" />
<liferay-ui:search-container-row classname="com.abc.user" escapedmodel="true" modelvar="user">
<liferay-ui:search-container-column-text name="Name" valign="top">
<%= user.getNAME() %>
</liferay-ui:search-container-column-text>
<liferay-ui:search-container-column-text name="Email Address" valign="top">
<%= user.getEMAIL() %>
</liferay-ui:search-container-column-text>
<liferay-ui:search-container-column-text name="Phone" valign="top">
<%= user.getPHONE() %>
</liferay-ui:search-container-column-text>
</liferay-ui:search-container-row>
</liferay-ui:search-container>
Smilelws2010 lwz, modifié il y a 10 années.
RE: Search Container - how to style the alternate rows
Regular Member Publications: 160 Date d'inscription: 16/12/10 Publications récentes
I think I did not mention this above, I need to customize styling for a specific search container on a portlet.
I want a bit different styling basically with the background color for alternate rows for a particular search container on a cusotm portlet.
I want a bit different styling basically with the background color for alternate rows for a particular search container on a cusotm portlet.
Pankaj Kathiriya, modifié il y a 10 années.
RE: Search Container - how to style the alternate rows
Liferay Master Publications: 722 Date d'inscription: 05/08/10 Publications récentes
Use css class wrapper attribute[liferay-portlet.xml] to customize your search container on portlet.
Suppose you have entry like
Then in your theme's custom.css or portlet's main.css provide custom styling.
HTH
Suppose you have entry like
<css-class-wrapper>abc-portlet</css-class-wrapper>
Then in your theme's custom.css or portlet's main.css provide custom styling.
.abc-portlet .portlet-section-alternate{
//put your custom css here
}
HTH
Smilelws2010 lwz, modifié il y a 10 années.
RE: Search Container - how to style the alternate rows
Regular Member Publications: 160 Date d'inscription: 16/12/10 Publications récentes
This is helpful. Thank
I will try this out and see how it goes.
Thank YOu
Smile
I will try this out and see how it goes.
Thank YOu
Smile