Table sorting broken for new items

Tomáš Navrátil

June 7, 2017 at 3:12 am #4368

Hi all,

I have a problem with table sorting. In my application I have set a Table coach view bound to a list of objects. Table sorting by one column works as expected, but when I use table’s method appendElement to add a new table row, this new item is never placed correctly when sorting, even after I click on the column header to trigger the sorting again. Is this a known problem? How can I set the table to sort newly included items?

Thank you,

Tomas

SPARK Support

June 8, 2017 at 9:25 am #4373

Hi Tomas,

The appendElement() and sort() methods should be working fine for the table.

For my test harness, I used BPM 8.5.7, with SPARK UI version 4.5.02.  The Table is bound to a complex type list containing str1, str2, int1 and dec1.  For convenience, I also named my input fields str1, str2, int1 and dec1.  I have a button that calls the appendElement with the following On Click:

${Table1}.appendElement( { str1:${str1}.getData(), str2:${str2}.getData(), int1:${int1}.getData(), dec1:${dec1}.getData() } );

After appending the new element, all of the fields are sorting in the correct order.  I also added a sort() to my On Click event to automatically sort the new record based on the 4th column in descending order:

${Table1}.sort(3,true);

However, I found that the appendElement() wasn’t quite finished executing, so I added a setTimeout to the sort:

setTimeout(function(){${Table1}.sort(3,true);},100);

The full Append Element On Click as follows works as intended:

${Table1}.appendElement({str1:${str1}.getData(),str2:${str2}.getData(),int1:${int1}.getData(),dec1:${dec1}.getData()});setTimeout(function(){${Table1}.sort(3,true);},100);

Are you adding any complex functionality in your Table, such as Custom cells with a sort value set?

Regards,

Stephen P.

Tomáš Navrátil

June 12, 2017 at 6:03 am #4382

Hi Stephen,

I have tried your test and it works. However, my scenario is still broken. It is a bit more complicated than I thought. Here is how to replicate my problem, starting with the example you described:

1. Set renderAs to “Custom” for the first table column and provide following “On Custom Cell” event handler to enable case-insensitive sorting:
if (cell.colIndex == 0)  { cell.setSortValue(cell.value.toLowerCase()); } return “S”;

2. Allow table item editing either by setting field in the first table column as editable or add a new cell with deferred section as described here:
https://salientprocess.zendesk.com/hc/en-us/articles/213236248-Achieve-Better-Performance-Within-a-Table-through-Decoupling-and-Lazy-Loading

3. Run the CSHS. sorting works as expected for all items (img_1).

4. Edit a table item – directly or from a modal section with item detail (img_2).

5. Table sorting doesn’t work for the edited item, even after firing the sort by clicking column header or by calling sort() method.

It seems that custom cell remembers its “sort value” and doesn’t update it after the real value changed. Can I somehow make it update itself?

Regards,

Tomas

SPARK Support

June 13, 2017 at 1:28 pm #4389

Hi Tomas,

The On Custom Cell event is only executed when a new row is added to the Table.  Therefore, you would need to create a separate form that captures the elements to be used for the data of the new row, then appendElement() with the supplied data to apply the sort value.

The example that you have referenced appends a new record, and then inputs the data.  At this time, there is no available method to recalculate the sort value other than deleting the row and adding it again.

The On Row Added by User does allow an element to be passed in just as the appendElement() takes a data object.  You could use this event to capture the values from a group of controls in combination with the Table’s built-in Add Button.

Regards,

Stephen P.