How to make a row in a list look "selected"

How to make a row in a list look "selected"

  
I have a screen in which a list controls other things on the screen. I would like the row that the user selected in the list to look "selected" or otherwise show that it is the current row. Has anyone done anything like that? Can you please tell me how you did it? TIA!
Hi Gerry,

I would suggest that you use an Extended Property of the Row widget of your Table Record. Simply make Name 1 be style and, on the correspondent Value 1, use as the expression something like

   If (MyTableRecord.List.CurrentRowNumber = SelectedRowNum, "highlight_style", "")

Then create a proper highlight_style in your css.


Miguel

Thanks! That basically works, however I cannot seem to find a reliable way to do this across list pages. I'm having trouble figuring out when a user goes forward or backward and making the highlight show correctly.
Gerald Seidl wrote:
Thanks! That basically works, however I cannot seem to find a reliable way to do this across list pages. I'm having trouble figuring out when a user goes forward or backward and making the highlight show correctly.
 
 Gerry, change that code to use an Id instead of RowNumber. Then it will work across pages. :)
Hello Gerry,

You can make a webblock with this javascript
// mouse in/out fixedColumn's fixedtable, change background color and fixed color on click.
  
      function tableNavigation() {
          osjs(function($) {
         
             $(".navigateable tr").each(function(i) {
            $(this).mouseover(function() {
                $(this).children("td").addClass('tdOverClass');
               
            });
            $(this).mouseout(function() {
                $(this).children("td").removeClass('tdOverClass');
                
            });
            $(this).click(function() {
                 if($(this).children("td").hasClass('selected')){    
                 $(".navigateable .selected").removeClass('selected');
             }else{
                $(".navigateable .selected").removeClass('selected');
                 $(this).children("td").addClass('selected');
            }
            });
        });
 });
}
and this style sheet
.tdOverClass{
background-color: blue !important;
}
.fixedFoot{
    display:none;
    }
        
 .selected {
   background-color: blue !important;
  }
and an expression with this code and expand content set to NO
"<script type='text/javascript'>
     osjs(function($) {
    $('#"+TableId+"').addClass('navigateable');
    
});
   tableNavigation();
</script>"

where tableid is an webblock input parameter that is the table id.

then you insert the webblock after the table you want and pass the tableredcord.id


The espace with the solution in attach
wrote:
 
 Thank you very much. I tried to use your application, but got the Intellectual Property Error and cannot run it.
in attach without ipp
wrote:
 
 Still getting the same error. I verified that I was using the new one. Could you please check it?
here...