Given a ui control that when you select 01/01/2017 it returns a Javascript date as "Sun Jan 01 2017 05:00:00 GMT+0000" (note, an actual Javascript Date object) so its not a string...
However, I definitely need the date part (01/01/2017) and "as UTC"
C# has a DateTime.SpecifyKind(datetimevalue, DateTimeKind kind) method
Basically whats the equivalent to this that doesnt convert it:
moment(vm.theDate).specifyKind(utc)
Looking for to get a moment instance that is 01/01/2017, isUtc=true, from that type of Javascript Date UI control. (Its the Angular ui-datepicker control)
You should look in the UI control's docs for a way to retrieve the selected value as a string instead of a date object. A date object will be influenced by the local time zone, which will throw off your results - especially around DST transitions. Many good datepicker controls will offer this as a separate property (ex, theControl.value or theControl.text instead of theControl.date). Without knowing the specific control you are using, I can't offer anything more specific.
Once you have the string, use moment.utc(yourInputString, yourInputFormat)
Related
I would like to make a react floating date filter that works exactly like the default filter. The default filter has equals, greater than, less than, not equal and in range. I would like to preserve the behavior of these filters. The only things that I would like to change is the input format. The input format of the date is for the default is mm/dd/yy and I would like to change is that I can input a date like this 09 Mar 2019. Is there an easy way to change the date format? If not will I have to create a custom filter? And if I do have a make a custom one, where can I find the implementation of the default one as reference.
what I would like to modify
you can't (currently) do it with the current datefilter because it internally uses <input type="date" /> (if using chrome, otherwise just a text field) which always takes the browsers locale as described in https://stackoverflow.com/a/9519493/885338
also described in https://github.com/ag-grid/ag-grid/issues/1029 (has also a vue.js example)
so you will either have to
follow the steps outline here https://github.com/ag-grid/ag-grid/issues/2233
which modifies the prototype of the DateFilter and is a rather hacky solution
because it will overwrite every DateFilter and modifies (via prototype) ag-grid code. It worked for our cases, but might not in yours.
create a custom filter
and use the default filter https://github.com/ag-grid/ag-grid/blob/master/packages/ag-grid-community/src/ts/filter/dateFilter.ts as a reference.
if you create a custom filter you could supply additional params like the desired date format via FilterParams
The method init(params) takes a params object with the items listed below. If the user provides params via the colDef.filterParams attribute, these will be additionally added to the params object, overriding items of the same name if a name clash exists.
taken from: https://www.ag-grid.com/javascript-grid-filter-component/#ifilter-params
with that you could write a date filter that can work with different date formats (for example with using moment.js) by supplying the format via colDef.filterParams
Ag-Grid has some nice examples for Dates -> https://www.ag-grid.com/javascript-grid-date-component/
also see https://github.com/ag-grid/ag-grid/issues/1029#issuecomment-393546876 for this exact, still unresolved, issue and an example for vue.js which you may use as a starting point for your react based filter
I am trying to display initial values on my redux form when it first load. Every fields work except the date input field. I tried to use moment to format string (YYYYMMDD) to MM/DD/YYYY and it's not working. No matter how I formatted, the field fail to display and instead showing the default place holder character mm/dd/yyyy until I selected a date. I am using the default redux-form input component date type. How should I do this right? Appreciate for any help.
When you are setting the initial date in your state, you need to provide it as per ISO-8601 standards, so YYYY-MM-DD, i.e. 2018-08-22 for 22nd August 2018.
I have never used redux-form library before, but I found a codesandbox example in their guide, and managed to get it to work here by just relying on them having followed the ISO standard. Feel free to play around with it.
I am using this calendar https://github.com/mattlewis92/angular-bootstrap-calendar for showing events and time slots for people all over the world. During sign up, every user has to set his timezone and then my application uses this timezone for further date computation rather than client machine timezone.
The problem is that when I make user timezone default using moment.tz.setDefault(timezone) and change the machine's timezone, the calendar calculates dates wrongly.
Here is my excerpt of my code:
moment.tz.setDefault($rootScope.timezone)
vm.calendarView = 'month';
vm.viewDate = moment().startOf('month').toDate();
vm.cellIsOpen = true;
Attached is the screenshot:
[Screenshot]
You can see that user's timezone is currently Asia/Karachi +5 and my machine's timezone is Beijing +8. Today's date is 8 September and the day is Friday, but on the calendar 8 September is showing as a Saturday instead of Friday.
mwl-calander did not provide support for timezone, you can use full calander
https://fullcalendar.io/
Demo https://fullcalendar.io/js/fullcalendar-2.9.1/demos/timezones.html
Its angular directive can be found at
https://github.com/angular-ui/ui-calendar
It would appear that this particular UI control does not support selecting a time zone. Simply using moment.tz.setDefault is not good enough, because everything the control is doing both internally and in its external API is using Date objects, which cannot represent arbitrary time zones. In other words, the author of that control would have to remove all .toDate() calls and use Moment objects as the primitive in the control instead of Date objects. That would be a breaking change for them.
I suggest filing an issue in that project's GitHub repository, and reference this page.
I'm having a hard time to have an active data for the calendar date on my system. I am using Visual Test on SilkTest, and I have noticed that whenever I am clicking a value from the calendar, I'm getting a #time property. And that time property contains the Epoch Time format.
So whenever I try to playback the script, there are instance that I will get an error where Silktest cannot locate the selected date on the recording. Do you have any idea on how can I convert the Epoch time to its specific value?
Screenshot:
Use the identify tool to see whether there are other properties that you can use to identify the control instead of using the #time value.
I have a textbox and using data-ng-model="EmpDetails[0].DateOfJoining" So what happens here is the date comes along with the time and I only want the date.
I have seen multiple place where you use {{EmpDetails[0].DateOfJoining | date: 'MM/dd/yyyy'}} but what I want is within the model, its got a 2 way bind.
Any help will be appreciated.