I want to implement a date field using 3 mat-select components. How should I fill the day, month (by number) and year fields? I think I should use a constant values on a ts file and use these values instead of keeping them in a database table. Am I wrong? And is there a proper example for this kind of usage?
Note: For some limitation I need to use mat-select instead of mat-datepicker. For this reason please give your suggestions based on mat-select approach.
As of your limitations, I've created one reusable component for you at
StackBlitz.
Using this control you can do two-way data (Date) binding.
And you can customize it with your own design choice.
Use of the component is also demonstrated.
Related
I build a custom form control composed of 3 mat-select as shown on the following demo:
Stackblitz
I want to make only month and year field required and make the day field optional in this form control. The examples are generally apply the required to all the components in that user control. But instead of applying to all of 3 select lists, I just want to make required 2 fields of them.
So, how can I do this?
If it's possible, you should use angular forms in the DateSelect component as well and pass the value of the form to the onChange function. This way you have control over every input field individually. Mixing angular forms and binding can unnecesarily complicate things.
I was trying to implement a custom Date filter in ag grid using React. The link I followed is a link!
I was able to create the component (SingleDatePicker) and able to render it on the cell. But I had tried a lot to make it filter the data with the selected date. It does not happen to filter. I have used the methods according to the documentation like updateAndNotifyAgGrid etc. but still no luck.
I am using the agDateColumnFilter and my own custom component for rendering.
Could anyone please help me point out where I am doing wrong for this to not filter the data.
I have 10 inputs in my webpage, out of which 4 inputs requires date(Date of birth, Purchase date and many), I have my own custom calendar. Currently I'm repeating the code below all 4 inputs which requires date, Is there any efficient way to do without repeating
Since you are already using AngularJS, and already have your own custom calendar, you can change your custom calendar to a directive. Since, there are multiple instances of directive in a single page, create directive have isolated scope, and use this directive in your form.
Similarly, for validation too, you can create your own directive to do validations.
I have 10 inputs in my webpage, out of which 4 inputs requires date
What you should be doing for a date input is using the date input type. This gives you a semantically correct form.
I have my own custom calendar
Write your own polyfill for the date input type, overriding whatever you need.
Reusability of repeatable code in html
In the general case, consider using Web Components. https://www.webcomponents.org/ This is a newly revived standard around reusable HTML, and works much the same way a lot of front-end frameworks do.
I'm looking for a solution to pick up a date on mobile app (using Ionic framework). I would like the user click on a button and it triggers a selection of days, month, year, like on the picture below :
I'm not talking about multiple selections, but a combination a choice in the same select tag.
Any idea how to do it with JS/AngularJS ? I don't want to use JQuery.
Take a look at this. It has a list of all the input types and their behavior on mobile devices.
http://mobileinputtypes.com/
I found a partial solution for date. On the ionic website, there is a component which give the opportunity this behavior with date (http://ionicframework.com/html5-input-types/#date).
But I have still no idea how to deal with custom options using multiple columns.
I have 2 comboboxes. The first selects a category, the second selects the sub category. Both categories are stored in one store with fields: id, parentId, label. Filtering the store isn't working since both comboboxes are bound to the same store.
How can I link the comboboxes? How can I filter the list of the second combobox?
Instead of referring to the same store use Ext.create() to create a new instance of the same store for the second combo box. Use select or change listeners on comboboxes to trigger filtering from one to the other.
EDIT:
Here is an example of such a beast :) http://extjs.wima.co.uk/example/1
This is not mine but sounds exactly what you are doing. Please note the way the stores are setup for each combo box. The first Combo CREATES a new store with the new operator - although this is not the best practice, it will work. The best practice is just to use Ext.create(..).
The second Combo refers to an existing store. In your case since you are reusing the same store definition you want to use Ext.create(...) on both Combos.
For more reference on best practices of class system read this guide: http://docs.sencha.com/ext-js/4-0/#!/guide/class_system
friend.....try filter on the store.