kendoui: set calendar depth for column in kendoGrid - kendo-ui

I have date column in my grid, with format dd/MM/yyyy when I set field like 12/12/12 it updates grid with 11/12/12, (that happens due to silly time conversion:
kendo.parseDate('Mon Dec 12 2012 00:00:00 GMT+0100 (CET)').toISOString(). Is there any way to fix this?)
So I decided to stick with just 'Month Year'.
This is in grids columns array:
{ field: "published", title: "Published", format: "{0:MMMM yyyy}",
Dates are correct as Month Year on rows, but datepicker in edit mode pops up with 'day' precision, how do i tune it?

Ok I slapped it hard with the wrapper:
function Date2MDY(date) {
var dmy = '';
dmy += String(date.getMonth()+1) + '-'
dmy += String(date.getDate()) + '-'
dmy += String(date.getFullYear())
return dmy;
}
And it fixed the issue

Related

How to avoid rounding up of number in kendo format method?

I am looking to format the "amount" with maximum 13 decimal precision to populate a grid cell which i'm doing in the following way.
text box is
$(gridId + "#Units")
.parent()
.append("<input type='text' id='UnitsA' onkeyup
='checkdigit(this,\"Units\",8,13)' value='" + txval + "'></input>");
my .cshtml file has :
columns.Bound(p => p.Units)
.Width("20%")
.Title("Units")
.ClientTemplate("#: formatAmountTo13Dec(Units, '') #")
.HtmlAttributes(new { #class = "grid-number" })
;
the function formatAmountTo13Dec has the following.
function formatAmountTo13Dec(data, defaultValue)
{
return data != null ? kendo.format("{0:c13}", parseFloat(data)) : defaultValue;
}
When i enter -999.9999999999999 in the cell ( 999 followed by 13 decimals) it is formatted by calling the above function.
kendo.format("{0:c13}", parseFloat("-999.9999999999999"))
However this rounds up the amount and populates the cell with
(1,000.0000000000000), but the expected amount is (999.9999999999999)
To Avoid rounding up, instead of kendo.format, i tried kendo.toString() ,
But the result to this is -999.999999999999, without the brackets for negative number which is required for the amount field in the grid i have.
Can someone please help me out on how to achieve the expected with no rounding and with brackets for negative numbers.

Vue js & validate DOB is within a range?

Using Vue js and v-validate how can I determine if the date of birth is greater than 21 and less then 55 years old? Any help is greatly appreciated.
import * as moment from "moment";
let birthday = moment(moment.now()).diff(moment(this.user.day + this.user.month + this.user.year, "DD.MM.YYYY"),"years");
if(birthday > 21 && birthday < 55) {
// do next steps
}
Moment(npm install moment) is used to parse, manipulate & display dates and times in JavaScript. moment.now() will give the present date and assuming you have three fields for day, month and year in different variables, format it and use the diff function to find the age.
The example from Madhuri works for me but i change the input as hard coded string.
enter code here let birthday = moment(moment.now()).diff(moment('01.01.1990', "DD.MM.YYYY"), "years");
if(birthday >= 20 && birthday <=70 ){
return birthday;
}
}
I solved it with with value from form input which works for me.
checkBirthday(){
const birthDayDate = document.getElementById("birthdate").value;
const age = moment().diff(birthDayDate, "years");
// let birthday = moment(moment.now()).diff(moment('01.01.1990', "DD.MM.YYYY"), "years");
if(age >= 18 && age <=74 ){
return age;
}
},

How can I make a CakePHP 3 time object remain consistent between AJAX and PHP?

When I load a page with a Time object and echo it out on the page through PHP, I get this:
<?= $user->last_login ?>
// 12/30/14, 5:21 pm
When I load data through ajax, it's returned to me like this:
console.log(response.user.last_login);
// 2014-12-30T17:21:31+0000
I haven't set anything different from the default CakePHP 3 setup, and I need events that are added to the page (returned via ajax) to be in the same time format as events that were pulled on page load (return via PHP).
The default output in string format for Time objects is controlled by the setToStringFormat method http://book.cakephp.org/3.0/en/core-libraries/time.html#setting-the-default-locale-and-format-string
It is a good practice to not hardcode a format there, but to only change the current locale so that the right format is selected for you,
But the format that is used to encode to json is not possible to control it via configuration as it is a standard that dates should be presented in such format when encoded in a JSON API. Instead, what you can do is alter the jsonSerialize method in your User entity:
public function jsonSerialize() {
$toEncode = parent::jsonSerialize();
return ['last_login' => (string)$this->last_login] + $toEncode;
}
What it does is converting to string the last_login property before it is encoded to json. Converting to string will then use the globally configured toString format.
You can convert the format of the date using the javascript Date object
JSFiddle
var date = new Date(response.user.last_login)
//returns a timestamp of 1419960091000
var n = date.getTime();
var day = date.getDate();
var month = date.getMonth();
month = month + 1;
//increment the month by 1 as it starts from 0
var year = date.getFullYear();
year = year.toString().substr(2,2);
//this removes the first 2 characters to give yy, remove the above line for yyyy
var hours = date.getHours();
var minutes = date.getUTCMinutes();
var period='am';
if(hours==0){ //At 00 hours we need to show 12 am
hours=12;
}
else if(hours>12){
hours=hours%12;
//remove the above line for 24 hour format
period='pm';
}
Now you can piece together the date in the required format
var last_login = day + '/' + month + '/' + year + ' ' + hours + ':' + minutes + ' ' + period;
//gives 30/12/14 5:21 pm
Hope this helps!

KendoUI scheduler Week view :-how to get date of start of week

I am using KendoUI scheduler in my application. is there any way to get the start of week when the selected view is week.
Yes. Use the navigate event to catch current date and get the start of week by manipulating the retrieved date. i.e.
navigate: function (e) {
if (e.view.toLowerCase() === "week") {
GetStartDateOfWeek(e.date);
}
}
function GetStartDateOfWeek(d) {
d = new Date(d);
var day = d.getDay(),
diff = d.getDate() - day + (day == 0 ? -6:1); // adjust when day is sunday
var startOfWeek = new Date(d.setDate(diff));
}
Hope it helps!
Reference: JavaScript - get the first day of the week from current date

Date format in D3.js

I have a column (date) in csv which stores the date in "2003-02-01"(y-m-d). I would like to format the date in month and year like Apr 2003. how do i do that?
var format = d3.time.format("%m-%Y");
data.forEach(function(d,i) {
d.date = format(d.date);
});
I am getting the following error Error: TypeError: n.getFullYear is not a function Line: 5
the csv file contains values:
200,300,400,288,123,2003-01-01
300,700,600,388,500,2003-02-01
what is the issue here?
Javascript doesn't automatically recognize the values in the CSV file as dates, just reading them in as strings. d3's time functions make it pretty easy to convert them to datetime objects:
> parseDate = d3.time.format("%Y-%m-%d").parse
> parseDate('2003-01-01')
Wed Jan 01 2003 00:00:00 GMT-0600 (Central Standard Time)
To format the dates like you want, we need to go the other way, from a date object to a string:
> formatDate = d3.time.format("%b-%Y")
> formatDate(parseDate('2003-01-01'))
"Jan-2003"
I would recommend representing your dates within your program with date objects and only formatting them as strings when you need to display them.
D3 version 4 has different time methods now.
https://keithpblog.org/post/upgrading-d3-from-v3-to-v4/
https://github.com/d3/d3/blob/master/CHANGES.md
Your source date
var d = {created_time : "2018-01-15T12:37:30+0000"}
The structure of that date = %Y-%m-%dT%H:%M:%S%Z
I search google with "2018-01-15T12:37:30+0000" and it's suggestions provided the date structure string. Handy.
Create a timeParser to convert(parse) your date string into a date object
var parseDate = d3.utcParse("%Y-%m-%dT%H:%M:%S%Z")
//parseDate(d.created_time)
Now create a time formatter to return a formated date string for displaying.
var formatDate = d3.timeFormat("%b-%Y")
return formatDate(parseDate(d.created_time))
i.e.
Jan-1970
from Adam answer, here is a small helper function to convert a time string from a format to another:
var formatTime = function(input, formatInput, formatOutput){
var dateParse = d3.time.format(formatInput).parse;
var dateFormat = d3.time.format(formatOutput);
return dateFormat(dateParse(input));
};
use:
formatTime("2003-01-01", "%Y-%m-%d", "%b-%Y");
// output -> "Jan-2003"
if you are getting date lets say in variable " d = (e.g: '2003-03-01')" in string format then,
var monthNameFormat = d3.time.format("%b-%Y");
return monthNameFormat(new Date(d));
this will result date in "Jan-2003" format.
In D3Js v3, this worked for me:
var s = "2018-11-01T19:37:55Z";
d3.time.format("%Y-%m-%dT%H:%M:%SZ").parse(s);
// Thu Nov 01 2018 19:37:55 GMT-0700 (Pacific Daylight Time)

Resources