topic Status color on data list in Alfresco Archive

Status color on data list

jriker1 — Fri, 21 Jan 2011 16:39:26 GMT

I basically want to use a data list to track project status and information on a line for each project. As part of this I want the ability to manually select a color for a particular project, using the standard red, yellow, green colors for bad shape, in jeopardy, and on target. Is there a way to

Re: Status color on data list

jriker1 — Mon, 24 Jan 2011 16:57:20 GMT

Perhaps a different approach to this question is there a way to have an image referenced by a field in the list. So having three colored button images and reference them. Or perhaps paste in some font tag in relation to a "LI" bullet that you color. Clugy but trying here.

JR

Re: Status color on data list

ghl — Fri, 28 Jan 2011 23:29:04 GMT

Yes, this is fairly easy to do for displaying colors on the datalist. One way you could do this is by extending the datagrid component and injecting your customization in the DataGrid_renderCellDataType() function. Match the datalist column name for the cell to the datalist proproperty type and add your "color" implementation data to the return object.

Another way you could do this is by using CSS injection but you'd probably still need modify the datagrid component to do as you need.

Hope this helps you get in the right direction.

Re: Status color on data list

orbitron — Thu, 03 Feb 2011 10:22:11 GMT

Hello,
Thanks for the hints. I am also interested to colorized rows according the "Status" field. Could you provide us a more clear example on how to modify this function?
Thanks you very much.

Re: Status color on data list

krups — Wed, 11 Jul 2012 08:19:56 GMT

Hello
I am also looking for the solution to display status color in datalist( i.e. create/edit datalist item form and datagrid)
Thank you in advance.

Re: Status color on data list

krups — Wed, 11 Jul 2012 09:09:13 GMT

I can display status color in forms (create/edit) using custom control as below:


<#include "/org/alfresco/components/form/controls/common/utils.inc.ftl" />
<#if field.control.params.optionSeparator??>
   <#assign optionSeparator=field.control.params.optionSeparator>
<#else>
   <#assign optionSeparator=",">
</#if>

<#assign fieldValue=field.value>

<#if fieldValue?string == "" && field.control.params.defaultValueContextProperty??>
   <#if context.properties[field.control.params.defaultValueContextProperty]??>
      <#assign fieldValue = context.properties[field.control.params.defaultValueContextProperty]>
   <#elseif args[field.control.params.defaultValueContextProperty]??>
      <#assign fieldValue = args[field.control.params.defaultValueContextProperty]>
   </#if>
</#if>

<div class="form-field">
   <#if form.mode == "view">
      <div class="viewmode-field">
         <span class="viewmode-label">${field.label?html}:</span>
         <span class="viewmode-value">${field.value?html}</span>
      </div>
   <#else>
      <label for="${fieldHtmlId}">${field.label?html}:<#if field.mandatory><span class="mandatory-indicator">${msg("form.required.fields.marker")}</span></#if></label>
      <#if field.control.params.options?? && field.control.params.options != "">
       <select id="${fieldHtmlId}" name="${field.name}" tabindex="0"
               <#if field.description??>title="${field.description}"</#if>
               <#if field.control.params.size??>size="${field.control.params.size}"</#if> 
               <#if field.control.params.styleClass??>class="${field.control.params.styleClass}"</#if>
               <#if field.control.params.style??>style="${field.control.params.style}"</#if>
               <#if field.disabled  && !(field.control.params.forceEditable?? && field.control.params.forceEditable == "true")>disabled="true"</#if>>
          <#list field.control.params.options?html?split(optionSeparator) as value1 >
 <#assign value2=value1?string?split("|")>
 <#switch value2[0]>
  <#case "Red">
  <option style="background:#FF0000" value="Red" <#if value2[0] == fieldValue?string || (fieldValue?is_number && fieldValue?c == value2[0])> selected="selected"</#if>>Red</option>
   <#break>
   <#case "Amber">
  <option style="background:#FF7E00" value="Amber" <#if value2[0] == fieldValue?string || (fieldValue?is_number && fieldValue?c == value2[0])> selected="selected"</#if>>Amber</option>
   <#break>
    <#case "Green">
  <option style="background:#00FF00" value="Green" <#if value2[0] == fieldValue?string || (fieldValue?is_number && fieldValue?c == value2[0])> selected="selected"</#if>>Green</option>
   <#break>
    <#case "White">
  <option style="background:#FFFFFF" value="White" <#if value2[0] == fieldValue?string || (fieldValue?is_number && fieldValue?c == value2[0])> selected="selected"</#if>>White</option>
   <#break>
  <#default>
 </#switch>

 </#list>
         </select>
         <@formLib.renderFieldHelp field=field />
      <#else>
         <div id="${fieldHtmlId}" class="missing-options">${msg("form.control.selectone.missing-options")}</div>
      </#if>
   </#if>
</div>
 ‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

but I want to display It on datagrid view as well.

Could you please help me?