9 Replies Latest reply on Nov 24, 2011 8:06 AM by Brendan Healey

    Extended Data table - usage

    Michael G Novice

      Hello,

       

      New to the usage of extended data table and was wondering about a few things.  Is it possible to wrap text in the cells?

       

      Can i also keep the columns a fixed with while also having the wrapped text?  I was going to use the datatable but ext. data table provided the scrollbars which is what i also need, but don't need a few things it does now.

       

      I found this http://community.jboss.org/wiki/ExtendedDataTableHowToOffColumnDragAndDrop that explains a few things but when i try the style for display:none i can still resize.  So i must be using it wrong.


      Thanks for the response.

        • 1. Re: Extended Data table - usage
          Brendan Healey Master

          Hi, I came up with this and it seems to work, but I've not (yet) fixed my column widths so couldn't

          say for sure if it will still work - but I think so!

           

          stylesheet.css

          ---------------------

          .cellWrap {

              word-wrap: break-word;

              white-space: pre-wrap;

          }

           

          page.xhtml

          ----------------

          <rich:column>

            <h:outputText styleClass="cellWrap" value="this is a very long sentence and will test my css skills"/>

          </rich:column>

           

          Regards,

          Brendan.

          • 2. Re: Extended Data table - usage
            Michael G Novice

            didn't work exactly but it gave me a place to look and i was able to get it to wrap using firebug and modifying the styles.  Now it is seems to be a matter of overriding the correct rf style and adding my own.

             

            thanks

            • 3. Re: Extended Data table - usage
              Brendan Healey Master

              Michael, I missed something important out. I'm also using this styling which allows table cells, rows -

              whatever, to expand vertically to fit the contents. TBH I've not really looked into why it works, but it

              does. Looking back at my notes it seems that this only works if used within inline style tags:

               

              <style>

              .rf-edt-hdr-c {

                border-right: none !important;

                border-bottom: none !important;

              }

               

              .rf-edt-c {

                height: 100% !important;

                border-right: none !important;

                border-bottom: none !important;

              }

               

              .rf-edt-cnt td {

                border-bottom: 1px solid #9FC0E9;

                border-right: 1px solid #9FC0E9;

              }

              </style>

              <rich:extendedDataTable ...

               

              I think I'm correct in saying that if the app developer has to use !important, then the RF developers

              must also be (as per css specificity rules), and this is not considered good practice?

               

              The row height solution was provided by Ryan Yoder: http://community.jboss.org/message/621937#621937

              1 of 1 people found this helpful
              • 4. Re: Extended Data table - usage
                Christian Peter Expert

                Thanks for the cellWrap styleclasses. Gave me some new ideas to save some column width.

                • 5. Re: Extended Data table - usage
                  Michael G Novice

                  Thanks Brendan,  I'll give those a try.  I did notice while tweaking .rf-edt-c i was able to get the height to show it wrap along with you other settings (cellwrap) but didn't try the inline style yet.

                  • 6. Re: Extended Data table - usage
                    Michael G Novice

                    Using the inline css settings works, i just added one more .rd-edt-c-cnt { white-space:normal}.

                    Now things wrap correctly.  Though i increased the column widths as well in hopes the text won't be large enough to wrap. 

                     

                    Now my other issues, column reordering.  How can i disable that?  trying link in my original post to turn off the event didn't seem to do it.

                    • 7. Re: Extended Data table - usage
                      mn3 Newbie

                      Add this to your CSS file:

                       

                      .rf-edt-c-cnt {

                          white-space: pre-wrap;

                      }

                       

                      .rf-edt-c {

                        height: 100%;

                      }

                       

                      Works perfect for me!

                      • 8. Re: Extended Data table - usage
                        Christian Peter Expert

                        "column reordering.  How can i disable that? "

                         

                        Hmmm, I think some weeks ago there was an example of a customized extendeddatatable. Much like the original but the javascript code for the dragNdrop functionallity was removed. This should also improve the performance and reduces the generated html-code.

                         

                        Another approach is to kill the DnD feature for extdts:

                        place somewhere:

                        <script>

                        DnD.ExtSimpleDraggable.prototype.isDragEnabled=function(){};

                        </script>


                        • 9. Re: Extended Data table - usage
                          Brendan Healey Master

                          Mathias, I gave your suggestion a try, always happy for the simplest solution, but in my table

                          the cells in a given row were all different sizes. I have an image in the first column, then some

                          lengthy text in the 2nd col - maybe that's what's causing the issue.

                           

                          Interesting comments about disabling drag and drop in edt, I'll have to give this a try.

                           

                          Regards,

                          Brendan.