2 Replies Latest reply on Nov 22, 2010 6:32 AM by harpritt k

    DragSupport: using the drag element as the indicator

    harpritt k Novice

      Hi everyone

       

      I was wondering if anyone knew of a nice way to use the uiComponent as the drag indicator.

       

      I want drag operation to be as accurate as possible, and im hoping that using the uicomponent as the dragindicator would enrich the interface greatly. stage 2 would be to have the ui component disable from the DOM while it was dragged.

       

      ive been to  http://docs.jboss.org/richfaces/latest_3_3_X/en/devguide/html/rich_dragIndicator.html#d0e17362 not found the good.

       

      Any help as allways is greatly appreciated

       

      Harpritt

       

        • 1. Re: DragSupport: using the drag element as the indicator
          Ilya Shaikovsky Master

          pretty simple. At first you could redefine the complete markup of indicator using "single" facet. The it will not be added with default label-icon markup. And the second point - dndparam accepts not only value but also nested content definitions. So I modified livedemo example locally and it works as you need:

          <rich:dragIndicator id="indicator2" >
          <f:facet name="single">
          {content}
          </f:facet>
          </rich:dragIndicator>

               <rich:dragIndicator id="indicator2" >

                    <f:facet name="single">

                         {content}

                    </f:facet>

               </rich:dragIndicator>

               <a4j:outputPanel

                    style="width:100px;border:1px solid gray;padding:2px"

                    layout="block">

                    <rich:dragSupport dragIndicator=":indicator2"

                         dragType="#{fm.family}" dragValue="#{fm}">

                         <rich:dndParam name="content">

                              <a4j:outputPanel

                                   style="width:100px;border:1px solid gray;padding:2px"

                                   layout="block">

                                   <h:outputText value="#{fm.name}"></h:outputText>

                              </a4j:outputPanel>

                         </rich:dndParam>

                    </rich:dragSupport>

                    <h:outputText value="#{fm.name}"></h:outputText>

           

               </a4j:outputPanel>    

           

          • 2. Re: DragSupport: using the drag element as the indicator
            harpritt k Novice

            Cheers Ilya, thats fantastic. The example code really helps.

             

            I was watching my brother use my app last night and noticed that he got a bit confused with the default icon.

             

            thanks again

             

            Harpritt