How to add buttons to a List View row?

  • 20 July 2016
  • 2 replies
  • 410 views

Userlevel 3
Badge +10


 

Symptoms

 


Custom Button column does not show on List
 

 

Diagnoses

 


When adding a Button control to the List View, the button only shows up in Edit mode.
 

 

Resolution

 

 

 

I've compiled a workaround that lets you add buttons to the row that will allow you to utilize that row's SmartObject reference:

---

1) Add a hidden data label to the views toolbar to track which row action button has been clicked, and name it: RowButtonState

2) Add a hidden literal data label to the views toolbar, with an expression containing the following JavaScript method that will be used to handle the button click, and store which button was clicked in the state variable from step #1:

<script type="text/javascript">
function MyView_RowButtonClicked(name) {
   var xpath = 'Controllers/Controller/Controls/Control[@Name="RowButtonState"]';
   var windowToUse = window;
   if (!checkExists(windowToUse.viewControllerDefinition)) { windowToUse.viewControllerDefinition = $xml(windowToUse.__runtimeControllersDefinition); }
   var control = windowToUse.$sn(windowToUse.viewControllerDefinition, xpath);
   var controlInfoObj = new windowToUse.PopulateObject(null, name, control.getAttribute('ID'));
   windowToUse.executeControlFunction(control, 'SetValue', controlInfoObj);
   windowToUse.raiseEvent(control.getAttribute('ID'), 'Control', 'OnChange');
}
</script>

This takes the button name being clicked and stores it in the Data Label created in step #1.

3) Add a column to the list view that will render the necessary per-row action buttons. Add a literal data label to the row with the following script:

<button onclick="MyView_RowButtonClicked('button1')">Button1</button>

This creates the necessary buttons, with each calling the MyView_RowButtonClicked method, passing its button name. This is a logical button name that is used to identify which button was clicked – it need not be an actual identifier.

4) Implement the List Item Clicked rule for the view, and use conditions to check the value of RowButtonState:
- If RowButtonState contains button1
- Perform actions



 

2 replies

This appear to work, button is created, but it affects all rows, not just a row at a time. I followed these steps but the rules created apply to all rows. Do you have any insight on how to get it to work for pnly the row in which the button is clicked in the List View?

Yes, This is a working and easy solution but Never forget to clear the data label "RowButtonState" at the end of your desired action or else it will trigger the delete event even if you click anywhere on the row item after clicking the delete button once.

 

Thanks

 

Vaisakh

Reply