I have a vuetify Data-table with multisort enabled like so:
<v-data-table
ref="insuranceTable"
:headers="headers"
:items="getRows"
:sort-by="['created']"
:sort-desc="[true]"
multi-sort
:search="search"
:items-per-page="10"
>
one of the columns in the table is Insurance Type. this value is fetched by using an index like this {{insuranceType[item.code]}}. The insuranceType array is defined as follows:
insurancetype:[
this.$t('insuranceType.life'),
this.$t('insuranceType.health'),
this.$t('insuranceType.property'),
]
The values are displayed in the data-table without any issue. However, When I try To sort the table by Insurance Type Column, nothing happens. The Sorting works for all other columns. The sorting works for Insurance Type column if I use a non i18n array like this:
insurancetype:['life','health','property']
How can I configure the V-Data-Table so it can be sorted by columns with i18n values?
You can define a custom sorting function for the Insurance Type column in your headers array. I've used this method before to be able to sort some custom string dates formats like this:
headers: [
{
text: 'Created date',
value: 'created_at',
align: 'center',
sort: (a, b) => {
var date1 = a.replace(/(\d+)\/(\d+)\/(\d+)/, '$3/$2/$1')
var date2 = b.replace(/(\d+)\/(\d+)\/(\d+)/, '$3/$2/$1')
return date1 < date2 ? -1 : 1
}
},
...
]
You should be able to add your own logic to be able to sort those. Can you replicate the issue in a codesanbox or codepen?
Related
I am new to qlik sense, I have a data say - 'data', it contains four columns - 'name', 'amount', 'category', 'mode'
'name' is basically customers name, 'amount' is total spent, 'category' is like - cloths, foods, gadgets and 'mode' is offline or online.
I have created a drill down bar chart with x axis as - name/category (drill down) and y axis as amount(sum). I need to show the count of repetition in two kpi charts of mode upon selecting a particular bar
for eg - If I select the bar of foods, the kpi will show offline - 32, online -7 based on the selection I made i.e., foods
I have tried - Count({<mode={'offline'}>}mode)
but it's not working. Any help will be appreciated.
When using drill-down Qlik is actually selecting the values, which are "drilled". You can see that selections are made in the selection bar.
You can build the KPI objects based on the number of selected values into the drill-down fields.
GetSelectedCount function will return the number of distinct selected values in a field. The function will return 0 if nothing is selected.
An example expression:
= if(GetSelectedCount(category) > 0,
count( {<mode = {'offline'} >} category),
if(GetSelectedCount(name) > 0 ,
count( {<mode = {'offline'} >} name),
count( {<mode = {'offline'} >} SomethingElse // if nothing is selected in "name" and "category" fields
))
)
I have a table with N rows. How can I get the total number of rows present in the table?
I search for a name, and that particular name is in row number X, how can I get the value of that particular row.
You can use .find to solve both of your cases.
To get the table row count:
cy.get("#tableID")
.find("tr")
.then((row) => {
//row.length will give you the row count
cy.log(row.length);
});
To get the value ( index ) of the particular row, you can do something like this.
cy.get("#Table Id")
.find("tr")
.then((rows) => {
rows.toArray().forEach((element) => {
if (element.innerHTML.includes("Your Value")) {
//rows.index(element) will give you the row index
cy.log(rows.index(element));
}
});
});
Additional tip: If you want to select a specific table cell containing a value, you can do this:
cy.get("#customers").find("tr").find("td").contains("Germany");
Note: to get the table row index there can be many other alternative ways. Hope you will figure them out on the go.
I want to expand all lists and records in a json response.
Columns are like e.g. (this is dynamically, it also can be 10 records and 5 lists):
Text, Text, [List], [List], Text, [Record], [Record], String, [Record]
I wrote a function for getting all columns with the specific type
Cn.GetAllColumnsWithType = (table as table, typ as type) as list =>
let
ColumnNames = Table.ColumnNames(table),
ColumnsOfType = List.Select(ColumnNames, (name) =>
List.AllTrue(List.Transform(Table.Column(table, name), (cell) => Type.Is(Value.Type(cell), typ))))
in
ColumnsOfType;
and a function to expand all lists from a table
Cn.ExpandAllListsFromTable = (table as table, columns as list) =>
let
expandedListTable = List.Accumulate(columns, table, (state, columnToExpand) =>
Table.ExpandListColumn(state, columnToExpand))
in
expandedListTable;
all lists are now records and i want to dynamically expand all these records.
I think i need a foreach to iterate through the list (which are only records cause of Cn.GetAllColumnsWithType),
Table.ExpandRecordColumn each element with it's Table.ColumnNames and add it to the table but i don't know how to do it.
Maybe you can help me out cause it's driving me crazy.
Cheers
Edit:
I recently opened a thread but there i wanted to expand a specific one like
#"SelectItems" = Table.SelectColumns(records,{"$items"}),
#"$items1" = #"SelectItems"{0}[#"$items"],
but now i want to do it all dynamically.
Chris Webb wrote a function to do this for Table-type columns:
http://blog.crossjoin.co.uk/2014/05/21/expanding-all-columns-in-a-table-in-power-query/
I've shared a tweaked version of that that I made for Record-type columns:
https://gist.github.com/Mike-Honey/0a252edf66c3c486b69b
You do not need a function for that. Assuming that the previous step in M was named Removed Other Columns, and that the column to expand is named Data, then make regular Expand step and replace its code of #"Expanded Data" with the following code:
#"Expanded Data"
= Table.ExpandTableColumn(
#"Removed Other Columns",
"Data",
List.Union(List.Transform(#"Removed Other Columns"[Data], each Table.ColumnNames(_)))
)
It expands all columns without referencing their names.
I have a table with 3 columns and when I sort column 1 or 2 then I would like to sort column 3 by descending.
I'm using fnPreDrawCallback (I tried to use fnDrawCallback too).
Here is my code:
"fnPreDrawCallback": function (oSettings) {
var column = oSettings.aaSorting[0][0];
if (column !== 3) {
oSettings.aaSorting.push([3, "desc"]);
}
}
This code looks fine, but, for example, when I sort column 1, the column 3 isn't sorted and, more awkward, when I try to sort at a 2nd time on column 1, the sort result is always ascending.
How can I achieve this?
The data has already been "sorted" by the time the preDrawCallback is fired, so changing aaSorting in here won't change the outcome of the table.
You can verify by checking oSettings. There is aiDisplay and aiDisplayMaster properties. aiDisplay is an ordered array of the elements that changes as they are sorted from clicks on a th. aiDisplayMaster is the original order that the data came back from the server or was existing on the page.
I would recommend manually calling fnSort from the click event of your th elements. To do this you will have to unbind the click event that datatables installs.
Create a function like this and call it from fnInitComplete so it only runs after datatables has been setup.
function unbindDTSorting() {
//unbind sort event, prevent sorting when header is clicked
$j('[id$=table] th').unbind('click.DT');
//create your own click handler for the header
$j('[id$=table] th').click(function(e) {
var oTable = $j('[id$=table]').dataTable();
//here is where you can do all of your if/else logic to create the desired multidimensional sorting
if(this.cellIndex == 3){
oTable.fnSort( [ [2, 'asc'],[3,'desc' ]] );
}
});
}
I have a DataGrid, created programmatically and loaded from ItemFileReadStore.
I want the first column of DataGrid always be sorted in descending order and disabled for user for sorting. Any other column should be available for sorting as a secondary sortable.
I don't want to give users such a powerful(complex and confusing) feature, as sorting by multiple columns, because there are too many columns in my grid.
So, it should be one sortable column for user and another one "already sorted unsortable" column in fact.
Does anyone know how can this be achieved?
Thanks.
To sort the first column add "sortInfo:-1" when you created your object.
To allow sorting the grid from any other columns but not the first you need to overwrite the function canSort.
To create you grid should now look like this .
dijit.grid.DataGrid({
canSort: function (sortInfo) {
if (Math.abs(sortInfo) == 1){
return false;
} else {
return this.inherited("canSort", arguments);
}
},
sortInfo: -1, .....
If you need to sort on more as one column you need dojox.grid.enhanced.plugins.NestedSorting.
http://dojotoolkit.org/reference-guide/1.7/dojox/grid/EnhancedGrid/plugins/NestedSorting.html