5 Replies Latest reply on Feb 13, 2009 12:03 AM by venkat reddy

    Urgent : onRowClick in dataTable hightlight the row with col

    venkat reddy Newbie

      hi,

      iam using richFaces 3.2.2. I have an issue which i cant get solution.

      I have datatable with values.when i click on the row iam opening a contextMenu with options edit,delete and view.

      Now what i have to do is when i click on the row i should highlight that row with any color and show the contextMenu and when i click another row the current row should hightlight and previous one which i select should come in normal color.

      i tried this but i cannot solve this problem.

      For contextMenu iam using componentController in the datatable.

      could you please tell me how to do this.

      Thanks in advance
      Venkat

        • 1. Re: Urgent : onRowClick in dataTable hightlight the row with
          Ilya Shaikovsky Master

          onRowClick defined at table tag - redefines component control definition. So just change the row styles and call the menu both in dataTable onRowClick instead of component control using. Call show() method.

          • 2. Re: Urgent : onRowClick in dataTable hightlight the row with
            venkat reddy Newbie

            hi ilya_shaikovsky,

            Thanks for reply, but

            it is not working. i given like this

            onRowClick="#{ri:component('partnerMenu')}.show();this.style.backgroundColor='red';"

            if i give only onRowClick="#{ri:component('partnerMenu')}.show(); also its not working.

            you are telling that hightlight the row with css in that onRowClick event and call the contextMenu by show() method their itself.

            thatsfine but iam using component controller because in that iam getting the current row index and set in to f:param and getting that in contextMenu menuItem and there iam using ajax actionparam tag for setting that index to my bean property and taking that index then set rowindex to the dataTable property and get the rowdata.

            if i do the two things in table onRowClick how can i get the current row index and assignTo my bean property ?


            Thanks,

            Venkat

            • 3. Re: Urgent : onRowClick in dataTable hightlight the row with
              Ilya Shaikovsky Master

              I've modified RF demo sample in order to be used like you need. check pelase

              
               <rich:contextMenu attached="false" id="menu" submitMode="ajax">
               <rich:menuItem ajaxSingle="true">
               <b>{car} {model}</b> details
               <a4j:actionparam name="det" assignTo="#{ddmenu.current}" value="{car} {model} details"/>
               </rich:menuItem>
               <rich:menuGroup value="Actions">
               <rich:menuItem ajaxSingle="true">
               Put <b>{car} {model}</b> To Basket
               <a4j:actionparam name="bask" assignTo="#{ddmenu.current}" value="Put {car} {model} To Basket"/>
               </rich:menuItem>
               <rich:menuItem value="Read Comments" ajaxSingle="true">
               <a4j:actionparam name="bask" assignTo="#{ddmenu.current}" value="Read Comments"/>
               </rich:menuItem>
               <rich:menuItem ajaxSingle="true">
               Go to <b>{car}</b> site
               <a4j:actionparam name="bask" assignTo="#{ddmenu.current}" value="Go to {car} site"/>
               </rich:menuItem>
               </rich:menuGroup>
               </rich:contextMenu>
              
               <h:panelGrid columns="2" columnClasses="top, top">
              
               <rich:dataTable value="#{dataTableScrollerBean.tenRandomCars}" var="car" id="table"
               rowClasses="cur" onRowClick="this.style.backgroundColor='red';#{rich:component('menu')}.show(event, {model: '#{car.model}', car: '#{car.make}'});">
               <rich:column>
               <f:facet name="header">
               Make
               </f:facet>
               <h:outputText value="#{car.make}"/>
               </rich:column>
               <rich:column>
               <f:facet name="header">
               Model
               </f:facet>
               <h:outputText value="#{car.model}"/>
               </rich:column>
               <rich:column>
               <f:facet name="header">
               Price
               </f:facet>
               <h:outputText value="#{car.price}" />
               </rich:column>
              
               </rich:dataTable>
              
               <a4j:outputPanel ajaxRendered="true">
               <rich:panel>
               <f:facet name="header">Last Menu Action</f:facet>
               <h:outputText value="#{ddmenu.current}"></h:outputText>
               </rich:panel>
               </a4j:outputPanel>
               </h:panelGrid>
               </h:form>
              


              • 4. Re: Urgent : onRowClick in dataTable hightlight the row with
                venkat reddy Newbie

                hi ilya_shaikovsky,

                Its working fine. Thanks for ur example.

                when i select a row it is highlighting and when i select another row the previous row which i selected is also in the red color.how can i do only selected row should have the red color.

                ca we do this without using any javascript or we have to use javascript for unselect the previous selected row.
                can you please give me an example.

                thanks,

                Venkat

                • 5. Re: Urgent : onRowClick in dataTable hightlight the row with
                  venkat reddy Newbie

                  hi ilya,

                  hightLight the selected row and unselect that row when we select another is done through javascript.

                  but i have two more questions on that

                  1) i want to highlight one row defaultly in datatable when i search the results from database and display in datatable.

                  2) in datatable i moving Up and down the row which i select.
                  here when i select and move that row to Up or Down iam hightlighting the row and after i moved which ever i highlighted is disapearing. that i want to hightlight after i moved that row.

                  can u please tell me how to do this

                  Thanks ,

                  Venkat