Problem
While creating interactive forms with table of data in it, it is helpful to the form users if the data columns in the table are sortable. I have addressed this requirement is ubiquitous; hence wrote a sample Javascript function which sorts the table column's in ascending/descending order
Solution
The sorting can be done with few simple steps as shown below: 1. Exporting the Table data into an XML variable 2. Create a two dimensional array and initialize the array with the XML data 3. Sort the two-dimensional array 4. Update the table data 5. Re-merge the form layout with the modified data
Detailed explanation
I have created a Javascript function which has the following prototype
function SortTable(tableRef,colIndex,isNumeric,Asc);
tableRef - is the complete SOM reference to the table which needs sorting
colIndex - is the 0 based column index which needs sorting
isNumeric - a boolean parameter speicifes that the column which requires sorting contain Numeric values or not
Asc - specifies the sorting sorting should be either Ascending or Descending
And invocation sample code is shown below
sortingUtil.SortTable(xfa.datasets.data.form1.page1.Table1,0,true,true);
A custom sort function is written to sort the two-dimensional array and numeric values.
The function prototype is
function sortFunc(a,b)
////////////////////////////// The Complete Code written inside SortingUtil Script Object /////////////////////////////////////////////////
var col = 0; // column index
var num = false; // Is numeric column
var OrderAsc = true; // Order of sorting
function SortTable(tableRef,colIndex,isNumeric,Asc)
{
try
{
col = colIndex;
num = isNumeric;
OrderAsc = Asc;
// String variable containing the form data as XML String
var data = tableRef.saveXML('pretty');
// An XML variable contains the deserialized XML data
var xmlData = xfa.datasets.createNode("dataGroup",tableRef.name);
xmlData.loadXML(data);
// Number of table rows
var rowsCount = xmlData.nodes.length;
//Number of columns in the table
var cols = xmlData.nodes.item(1).nodes.length;
// A two dimensional array contains complete table data
var master = new Array();
// Fill the array with XML data
for(var i=1;i<rowsCount;i++)
{
master[i-1] = new Array();
for(var j=0;j<cols;j++)
{
master[i-1][j] = xmlData.nodes.item(i).nodes.item(j).value;
}
}
//Sort the 2D array
master.sort(sortFunc);
// Re-fill the XML variable with Array data
for(var i=0;i<master.length;i++)
{
for(var j=0;j<master[i].length;j++)
{
xmlData.nodes.item(i+1).nodes.item(j).value = master[i][j];
}
}
// Modify the table data and remerge the form
var result = xmlData.saveXML('pretty');
tableRef.loadXML(result,1,1);
xfa.form.remerge();
}catch(e)
{
app.alert(e)
}
}
// Customize the sort function to handle 2D array and Numeric columns
function sortFunc(a,b)
{
var x = a[col];
var y = b[col];
try
{
if(num)
{
x = parseInt(a[col]);
y = parseInt(b[col]);
}
}catch(e){}
if(OrderAsc)
{
return x==y?0: (x < y ? -1 :1)
}
else
{
return x==y?0: (x < y ? 1 :-1)
}
}
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
+
This work is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License. Permissions beyond the scope of this license, pertaining to the examples of code included within this work are available at Adobe.
