I'm working on a project in which I need to implement a list of dates. I have been able to pull the data from the api, however I have been having troubles parsing the format within these dates.
The data that I have been able to pull looks similar to this
[["2015-10-05T13:00:00Z","2015-10-05T21:00:00Z"],
["2015-10-06T13:00:00Z","2015-10-06T21:00:00Z"],
["2015-10-07T13:00:00Z","2015-10-07T21:00:00Z"]]
Which is sweet that i've been able to pull.....but as you can see, the dates are not really what a user will need.
I've been looking into moment() methods. (http://momentjs.com/) However the problems that i've run into is that the methods that you can use with moment() is that i've only been able to make anything work with one date, not with an array of dates such as what i have.
So my question is, are there any alternatives to moment(), or better ways of parsing an array of dates?
You'd have to loop and parse.. you can do it fairly simply with a .map call (with momentjs):
var formattedDates = array.map(function(inner) {
return inner.map(function(d) {
return moment(d).format("MM/DD/YYYY hh:mm A");
});
}).reduce(function(p, c) {
return p.concat(c);
});
Demo: http://jsfiddle.net/6ncpspc0/
Related
I have a problem, I can not make actual dates in the datepicker. I have an array of date strings in a state. I only need to put these dates in the datepicker so that only these dates are available for clicking, how can I do this please?
Array of dates:
Data
An example of how I want to do:
Example of Calendar
I have a default datePicker from MUI https://codesandbox.io/s/v0xqj0?file=/demo.js
Here is how it looks
I tried to use google, tried through renderday, but so far it did not work.
The maximum that happened is, it's funny))
My result
You can use the props "shouldDisableDate" to disable certain dates and pass a function that will return true if the value is not in your array of dates.
You have an example in the documentation here: https://mui.com/x/react-date-pickers/date-picker/
I forked your codesandbox here is what you could do: https://codesandbox.io/s/hardcore-yonath-kvk59t?file=/demo.js:917-921
Maybe this will come in handy for someone...
the parameter in the DesktopDatePicker helped me -
shouldDisableDate={getData}
and in it
const getData = (data) => {
dates.map((value) => {
some action...
})
}
First, for people wondering, I'm referring to this DatePicker
https://danielykpan.github.io/date-time-picker/#locale-formats
While the DatePicker feels and looks great, I have an issue with the outputting values. There are numerous options to format the view-part of a date, but I haven't seen or found examples or explanations on how I can switch the outputted ISO-8601 (2018-08-29T00:00:00.000Z) standard in my form. I'm using the datepicker in a reactive form and I have several pages with a similar prerequisite. I need to parse this value into a different format. For example...
29-08-2018
My first attempt - which wasn't too smart to begin with - was using [(ngModel)]="dateField" to grab the value that is inputted and change it into a value that I wanted to. Needless to say, of course it was changed in the view as well and since I didn't refer to index of the form field it merely caused a blank field. Shortly after I realized that the approach was poor to begin with, but since I can't find configurations for this particular problem I'm pretty lost as to what I can do.
#ak.leimrey. Normally all the datepicker give you a value of one type (in your case a string format in ISO, other case, e.g. using ng-bootstrap, return an object with day,month and year). if you want to send in other format, in the submit you can map the values and convert the form.value.
submit(form)
{
if (form.valid)
{
let result={
...form.value, //all the values of the form, but change some one
searchParams:form.value.searchParams.map(x=>{
...x
value.map(v=>{
let items=v.split('-');
return items[2].substr(0,2)+"-"+items[1]+"-"+items[0];
})
})
}
console.log(result)
}
}
Yes in your case transform the object is some hard but see as using the spread operator and map you can transform the value
use moment js libaray . its a simple and rich library that can help u ;
u can get it via npm : npm i moment .
then u can convert formats like this :
moment("2018-08-29","YYYY-MM-DD").format("YYYY-DD-MM"); // outputs : 2018-29-08
or
moment("2018-08-29","YYYY-MM-DD").format("DD-MM-YYYY"); // outputs : 29-08-2018
I am working on my first project using Meteor, and am having some difficulty with sorting.
I have a form where users enter aphorisms that are then displayed in a list. Currently the most recent aphorisms automatically display at the bottom of the list. Is there an easy way to have the most recent appear at the top of the list instead?
I tried:
Template.list.aphorisms = function () {
return Aphorisms.find({}, {sort: {$natural:1}});
};
And am stumped because the Meteor docs don't have many examples.
Assuming that the date_created is in a valid date format along with the timestamp, You should insert the parsed value of date_created using Date.parse() javascript function, which gives the number of milliseconds between January 1, 1970 and date value contained in date_created.
As a result of that, the most recently added record will contain greater value of date_created than the record inserted before it.
Now when fetching the records, sort the cursor in descending order of the date_created parameter as:
Aphorisms.find({}, {sort: {date_created: -1}});
This will sort records from newer to older.
I've found the following to be a cleaner solution:
Template.list.aphorisms = function () {
return Aphorisms.find().fetch().reverse();
};
Given that entire collection already exists in the reverse order that you would like, you can simply create an array of all the objects and reverse the order.
I am using the DXTREME framework from Devexpress to connect a HTML mobile app to an OData source.
One of my tables in SQL Server, exposed through the OData service is a table with a date (not datetime) field in it. It is exposed through OData like this:
<d:TaskDate m:type="Edm.DateTime">2010-04-01T00:00:00</d:TaskDate>
I am trying to filter the data on this field through a calendar control, but when I try to filter the datasource on the JS side, I get no matches. This is because the date is passed to the OData service, I believe, in UTC format, so if I query for TaskDate = '10/JUL/2013', I believe the date is passed as "09/JUL/2013 14:00". If I filter on TaskDate > '10/JUL/2013' I get results back from after "09/JUL/2013 14:00" at any rate.
I have tried declaring a new date with no time part:
filterDate = new Date(2013, 6, 10)
but is still doesn't work, it still subtracts 10 formy time zone on the JS side.
What I want to do is to return a lists of Tasks valid on that particular date. How can I achieve this?
I think my problem was the confusion around the dxDateBox control returning just a date, and that date being changed when passed to my odata service.
I solved the issue by converting the date to UTC myself, but just using the Date parts from the control, (where filterDate came from the control):
var paramDate = new Date(Date.UTC(this.filterDate().getFullYear(), this.filterDate().getMonth(), this.filterDate().getDate()));
this.dataSource.filter(["TaskDate", "=", paramDate]);
This works nicely, but seems rather verbose.
I have a spring MVC java application and I'm serializing joda DateTime to json.
When I examine the output through the browser the DateTime serialized data looks like this:
startDate: 1323147660000
I'm not sure which format this data is in. I've tried many different combinations of srcformat and newformat format options including the following based on this post:
{srcformat:'U', newformat:'m/d/Y'}
My hunch is that this is the number of milliseconds since the epoch but I'm not sure how to use it correctly within jqgrid.
Thanks in advance for any help.
Actually the milliseconds from epoch format was supported out-of-the-box in one of the previous versions of jqGrid. Unfortunately it has been dropped for an unknown reason.
Here is a workaround:
{
name:'startDate',
label: 'Start date'
formatter: function(cellValue, options) {
if(cellValue) {
return $.fmatter.util.DateFormat(
'',
new Date(+cellValue),
'UniversalSortableDateTime',
$.extend({}, $.jgrid.formatter.date, options)
);
} else {
return '';
}
}
}
Note that with custom formatter you can parse the date and format it in any way you wish. However I did my best to use built-in jqGrid formatting facilities (see the UniversalSortableDateTime?)