tabulator number editor max and min not working - numbers

i tried to put max and min for number editor ,but it is not working as expected not validation
my code below
{ , title: "Grade", field: "grade", validator: "required", editor: "number", editorParams: { min: 10, max: 120, step: 1, } },
but it allowed all numbers with no validation ??

You only have a max and min set on the number editor, all this will do is stop you incrementing or decrementing out of the range, it still allows input of any other number, just like a normal number input would do.
You need to use the max and min validators for this, at the moment you are only using the required validator
so your validator property should look like this:
validator:["required", "min:10", "max:120"]
If you want to your max validator to have a variable maximum then you would need to use a custom validator function for this, in the example below you could change the maxValue variable to look up from a global variable thus allowing you to change it whenever you like:
//custom validator
var variableMax= function(cell, value, parameters){
var maxValue = 10;
return value <= maxValue;
}
//assign validator in column definition:
validator:["required", "min:10", {type:variableMax, parameters:{}}]

Related

ag-grid sort by column A using hidden column B

Is there a way to sort by column A (user clicks on A column header) but under the hood use column B?
For example, I have a column "name" that displays a user's name. But then I have a column "name frequency in general population" that is hidden. I want to display the regular "name" but sort by the other column under the hood.
Create your own customer comparator and set it to your name field by using Custom Sorting.
With custom sorting, you have access to all the data in each row where you can choose what should go where.
var columnDefs = [
{ field: 'name', comparator: customComparator },
{ field: 'name frequency in general population' },
];
function customComparator(valueA, valueB, nodeA, nodeB, isInverted) {
const nodeAValue = nodeA.data['name frequency in general population'];
const nodeBValue = nodeB.data['name frequency in general population'];
return (nodeAValue > nodeBValue) ? 1 : -1;
}

How to define default values for snippet placeholders?

When creating snippets I would like to know if it is possible to define a default value for a placeholder if no value is assigned.
For example, having this php snippet:
{
"get_list": {
"prefix": "get_list",
"body": "$${1:beanList} = $${2:bean}->get_list('${3:order_by}', \"${4:where}\", ${5:row_offset}, ${6:limit}, ${7:max}, ${8:show_deleted});",
"description": "Get a paginate bean list"
},
}
Where placeholders from tabstops 5 to 8 have the following default values:
$row_offset = 0
$limit= -1
$max= -1
$show_deleted = 0
I tried with choices in the following way, but with no success:
{
"get_list": {
"prefix": "get_list",
"body": "$${1:beanList} = $${2:bean}->get_list('${3:order_by}', \"${4:where}\", ${5:row_offset|0|}, ${6:limit}, ${7:max}, ${8:show_deleted});",
"description": "Get a paginate bean list"
},
}
Please take a look to the row_offset definition. When the snippet is rendered I get the following
$beanList = $bean->get_list('order_by', "where", row_offset|0|, limit, max, show_deleted);
In this scenario what I would like to happen is in case I omit a placeholder value 0 is assigned.
Thanks for any help.
The closest you will get to what you want are "choices". See snippet choices.
Your terminology is a little off. In ${6:limit} for example - that entire thing is the placeholder and limit is the default value for it. So it already has a default value - limit - and now you want to have another. So try this syntax:
${6:|limit,-1|}
Placeholders can have choices as values. The syntax is a comma
separated enumeration of values, enclosed with the pipe-character, for
example ${1|one,two,three|}. When the snippet is inserted and the
placeholder selected, choices will prompt the user to pick one of the
values.

Aurelia converted values and dataTables

I'm using DataTables jQuery plugin in Aurelia component. using column ordering and it works well excluding columns with dates.
Inside this columns I'm using value-convertet to convert isoString value to DD.MM.YYYY date format. Value covreters usage leads to wrong date column ordering, but if I'm not using value-converter everything works well. Unfortunately I didn't find any reason why it doesn't work correctly.
Wrong filtering example: I see rows with date value like 27.05.2010 before 18.05.2017
DataTables init:
$('#searchResultsTable').dataTable({
destroy: true,
searching: false,
paging: false,
orderMulti: false,
order: [[ 2, "desc" ]],
dateFormat: 'DD.MM.YYYY'
});
Date value converter (using moment library):
import * as moment from 'moment';
export class DateFormatValueConverter {
toView(value: Date, format: string): string {
if (value) {
return moment(value).format(format);
}
return null;
}
fromView(value: string, format: string): Date {
var isValid = moment(value, format, true).isValid();
if (value && isValid) {
return moment(value, format).toDate();
}
return null;
}
}
UPDATE:
Ordered with value converter
Orderd without ValueConverter(ordered like it should 2017 year value on the top)
The ordering mechanism of the data table is working correctly - it's your understanding that's off I'm afraid.
When ordering in descending order, any that start with 27. will be at the top, as they're the "biggest". Within all the dates that start with 27, it'll order on the month, biggest first, and then the year.
The order mechanism doesn't realise you're ordering a date so we need to look at the Custom Sorting Plugins;
https://www.datatables.net/plug-ins/sorting/
And specifically the Date-De plugin - as that matches your date format;
https://www.datatables.net/plug-ins/sorting/date-de
An example taken from the above page;
$('#example').dataTable( {
columnDefs: [
{ type: 'de_datetime', targets: 0 },
{ type: 'de_date', targets: 1 }
]
});

Angular 2: Resetting form ignores initial value

I have an Angular 2 app where I set default values for certain inputs like this:
this._stdSearchForm = this._formBuilder.group({
count: [{value: 50, disabled: false}, Validators.compose([Validators.required, Validators.minLength(1), Validators.maxLength(3), Validators.pattern("^[0-9]+$")])]
});
I have inplemented a "reset" feature like this:
(click)="resetStdSearchForm()"
and that just runs:
this._stdSearchForm.reset();
That resets the form, but ignores the initial value defined in the FormBuilder group.
Is this behaviour intended?
Can I programatically set the value of "count" after resetting the form? I tried doing this:
this._stdSearchForm.value.count = 50;
but that changed nothing.
You can try the following:
this._stdSearchForm.setValue({ count: 50});
or you can do the same by:
this._stdSearchForm.reset({ count: 50});
The reset method resets the FormGroup. This means by default:
The group and all descendants are marked pristine
The group and all descendants are marked untouched
The value of all descendants will be null or null maps

How to set the from 'day' and 'month' in datepickerfield in sencha touch 2

I am trying to do something which I think should be simple enough. I am using a datepickerfield in ST2.1 and trying to set the start date. I know I can set the year like so:
{
xtype: 'datepickerfield',
picker: {
yearFrom: newDate().getFullYear(),
yearTo: 1930
}
}
but I also want to be able to set the start day and month. Is this possible? The above produces a result like 'January 1, 2013' and that is not what I want.
If you just want to set the initial date the picker comes up with, then you just want the value config attribute of the picker.
{
xtype: 'datepickerfield',
value: (new Date()), // the value in the actual input (will also be in the picker UI)
picker: {
value: (new Date()), // use this if you DON'T want/have a value in the actual input
yearFrom: (new Date()).getFullYear(),
yearTo: 1930
}
}
Read more in the documentation (especially the "value" and "picker" config options). And here'a a Sencha Fiddle demonstrating usage.
You can create monthFrom,monthTo and dayFrom,dayTo configs. But for that you need to extend Ext.picker.Date. Create appropriate configs for those field and change createSlots method to limit month and day values.
In response to your comment, you can have reorder slots with slotOrder config in picker. Like -
slotOrder:['day', 'month', 'year']
Once you extend Ext.picker.Date you can modify certain slot as you want and then can have full day name in first slot.