3 Replies Latest reply on Feb 19, 2008 12:31 PM by Guillaume Jeudy

    Customize CSS class for rich:listShuttle

    Guillaume Jeudy Master

      Hi,

      Sorry i'm new to richfaces.

      I have a very basic question yet I can't seem to get around the problem.
      I'm trying to customize the text showing in the source cells of a listShuttle.

      I include the CSS in the header using this:

      <link href="css/screen.css" rel="stylesheet" type="text/css" />


      inside the CSS I have:

      .rich-shuttle-source-cell {
       font-size: 10px;
       font-weight: normal;
      }


      This doesnt bind in the rendering of my listShuttle:

      <rich:listShuttle id="childdomrefshuttle"
       targetValue="#{domRelateInstancesAction.relatedToInstances}"
       sourceValue="#{domRelateInstancesAction.unrelatedToInstances}"
       targetCaptionLabel="Related Ref Domain Instances"
       sourceCaptionLabel="Unrelated Ref Domain Instances"
       fastOrderControlsVisible="false" orderControlsVisible="false"
       listsHeight="300px" sourceListWidth="200px" targetListWidth="200px"
       converter="#{org.jboss.seam.ui.EntityConverter}"
       var="refDomainInstance">
       <h:column>
       <f:facet name="header">
       <h:outputText value="Domain Instance Name" />
       </f:facet>
       <h:outputText value="#{refDomainInstance.description}" />
       </h:column>
       </rich:listShuttle>


      Can someone tell me what I may be doing wrong ? I am using blueSky skin. Will the CSS attributes explicitely set override the skin settings ?

      Thanks,
      -Guillaume

        • 1. Re: Customize CSS class for rich:listShuttle
          Ilya Shaikovsky Master

          I've put your class directly to the page and it works fine. seems your path to css - incorrect.

          • 2. Re: Customize CSS class for rich:listShuttle
            moldovan Newbie

            And just a hint: clear browser-cache.
            I often get old styled pages displayed in my webapplication because of the browser-cache.

            • 3. Re: Customize CSS class for rich:listShuttle
              Guillaume Jeudy Master

              I know the path is right since other styles are applied coming from the same file.

              I emptied my browser cache but it didn't help. I think it must be some other styles taking precedence over the one I'm trying to set. I'll have to dig out CSS doc and read.

              PS: On a slightly unrelated note, is it possible to add a commandButton per row inside a listShuttle ?

              For example:

              <rich:listShuttle id="childdomrefshuttle"
               targetValue="#{domRelateInstancesAction.relatedToInstances}"
               sourceValue="#{domRelateInstancesAction.unrelatedToInstances}"
               targetCaptionLabel="Related Ref Domain Instances"
               sourceCaptionLabel="Unrelated Ref Domain Instances"
               fastOrderControlsVisible="false" orderControlsVisible="false"
               listsHeight="300px" sourceListWidth="200px" targetListWidth="200px"
               converter="#{org.jboss.seam.ui.EntityConverter}"
               var="refDomainInstance">
               <h:column>
               <f:facet name="header">
               <h:outputText value="Domain Instance Name" />
               </f:facet>
               <h:outputText value="#{refDomainInstance.description}" />
               </h:column>
              <h:column>
               <f:facet name="header">
               <h:outputText value="Action" />
               </f:facet>
              
               <h:commandButton type="submit" value="Edit attributes"
               action="#{domRelateInstancesAction(domInstVO)}" />
               </h:column>
               </rich:listShuttle>


              I tried the above example but when I click the button on the row nothing happens, the action is not bound to the button.

              Thanks,