I am trying to sum values where date = date choosed by md-datepicker.
Sum with users works good. But I am getting error when I want to do same thing with date.
Error: The ng-model for md-datepicker must be a Date instance or a value that can be parsed into a date. Currently the model is of type: object
There is a JSFiddle with code
Related
I have an array of date string. I created a date input field using
$('#mydatefield').datepicker({
multidate:true;
});
Need to add a validation, when someone inputs a date which exists in that array, should be removed with an error message.
Or
Is it possible to disable those dates on datepicker init?
Could you please share a sample custom object code to restrict the user from selecting the future date and populate a warning message from the questionnaire?
Using version -6.9 SP2
I am not really sure what you really want but what I am guessing is that you want to ensure that user only pick dates earlier than the current date in date input element.
For this you can use the "min" value of the date input field and set it to current date.
I am extending MomentDateAdapter for my requirement. When i am selecting a date from the calendar i am getting the correct output but when i manually type something in the input field i get wrong output.
For the selected date i am using _moment.utc({ year, month, date }).locale(navigator.language); to convert the selected value to UTC format but i am not sure on how to do the same when user searches in the input field.
StackBlitz.
to reproduce:
Try to select a value from calendar and see the console (notice the date is converted to UTC)
Now try to add a date manually by typing in and see the console (date is not converted to UTC).
You need to adapt your parse method call of moment to:
return moment.utc(value, parseFormat, this.locale, true);
to get utc Date from your input.
Here is your adapted Stackblitz.
The methods format and createDate are called if you set your date via picker, the parse method is called if you set it via input.
I am using PrimeNG calendar component. Initially I want to render the date input control without any date value and just a placeholder (mm-dd-yy), also as I need date value as a string so I am specifying dataType='string'
JS:
private datePickerValue = '';
HTML
<p-calendar [(ngModel)]="datePickerValue" dateFormat="mm-dd-yy" placeholder="mm-dd-yy" dataType="string"></p-calendar>
Problem here is, if my model value (datePickerValue ) is empty string, then the datepicker simply doesn't render.
Now if I initialize model with some string date like:
private datePickerValue = '01-01-2017'; then the datepicker control will render but it will also render the given date (01-01-2017).
How to render datepicker control without any default date?
Had the same problem, however in our case the datatype is Date and using Reactive Forms.
The issue is that if the date is initialized with new Date() p-calendar will show a date. The solution was to set the null/empty date to ''.
birthdate: (data.birthdate==null ? '': new Date(data.birthdate))
I'm trying to create an <input type="date"/> in Emberjs and I have two problems:
In my country the date is displayed as DD-MM-YYYY format while the date field requires a MM-DD-YYYY format (and then the browser displays it according to its locale). So the date should be formatted in one way if the browser supports the date input field and in the other way if not
The date is bound to a Date object
I'm using Momentjs for formatting and Ember Data.
I'm trying to extend Ember.TextField like this:
App.DateField = Ember.TextField.extend
value: ( (key, value) ->
if value?
if /Date/.test value.constructor #I assume that if the passed value is a Date object then it is arriving directly from the model
if Modernizr.inputtypes.date
moment(value).format('YYYY-MM-DD')
else
moment(value).format('DD-MM-YYYY')
else # if the passed value is not a Date object then the user is typing into the form
if Modernizr.inputtypes.date
value = new Date('value')
else
value
).property()
type: 'date'
For browsers with date input supports this works.
For the other browsers the date is correctly displayed, but it is saved as a (wrong formatted) string in the model.
How can I maintain the correct formatting while still using Date objects in the backend?
Demo
Update
Thanks to the blog post provided in the accepted answer I was able to update the demo to do what I want (with some weirdnesses, but not relevant at this time)
Demo2
Have look at these two blog posts:
This is a simple date picker:
http://hawkins.io/2013/06/datepicker-in-ember/
This one uses the bootstrap date picker
http://hawkins.io/2013/06/fancy-ember-datepicker-with-twitter-bootstrap/
Hopefully that will help
I don't see any parsing for the string use case. You will need to use something like Date.parse to convert the string entered by the user into a Date object.
if Modernizr.inputtypes.date
value = new Date(value)
else
value = Date.parse(value)