Angular UI datepicker altInputFormats does not allow formats that I need. I want to avoid using jQuery.
I need users to be able to input things like:
10JUN16
10JUN2016
AUGUST12
06/12 = June 12th, current year
06-10
061016
But the uibDateParser does not have compatible format codes.
I found a similar issue here but the advice was to change the source code which I'd prefer not to mess with. I'm thinking that some kind of parser in my Angular controller might help?
Any ideas? Here is a plunker I've been playing with
where I have
$scope.altInputFormats = ['M!/d!/yyyy', 'dd.MM.yyyy', 'dd-MMM-yy', 'dd-MMM-yyyy', 'd!-M!-yy'];
But the others won't work.
http://plnkr.co/edit/yNERf1jrtThVvJ1SBjBY?p=preview
Related
I would like to create an input field which lets the user select a month and a year. HTML5 introduced the input type "month" which suits my problem. It works fine in Chrome, Opera and Edge (https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/month).
If the user is using Firefox (or IE or any older Browser version), the input field doesn't show a date picker but instead expects a plain text input.
How can I implement my form in a way, that if the current browser supports input type="month", it shows the native browser datepicker, and if that's not the case, it shows a custom date picker? I expect the input type="month" to work in future Firefox versions and would like to automaticly use that functionality once it exists.
What would be the best way to implement a custom date picker?
I'm already using JQuery in my project. Furthermore I'm using Laravel, although I don't think that Laravel offers any utily in that regard.
Yes HTML5 elements are not supported on the old browsers. You can't expect new technologies to work on old systems. :)
So as you already know you can use a custom date picker. And I will recommend http://www.daterangepicker.com/, as I have been using it for some time now.Pretty stable.
Not recommending jQueryUI datepicker anymore, as it come with lot of other stuff as a bulk and it will slowdown your app loading time.
Give shot to daterangepicker it will solve your issue. ;)
I'm working with a programm in which some settings shall be imported by values set in an Pdf-form that is editable. Adobe Acrobat DC Pro is the program I use for creation of the Pdf-form. Problem is it just has controls like TextBox, ComboBox etc. but no DatePicker.
After I searched the internet I found the guys from Acroform and they have a Javascript that enables the use of a DatePicker inside of a Pdf-form. I downloaded their code from here and had no problem to get it running but the DatePicker starts with Sunday. I guess that is due to the fact that the Date Enumeration starts with 0 = Sunday, 1 = Monday etc. but I would like the change the DatePicker to start with Monday(the way Windows displays a DatePicker), problem is I have no experience in Javascript. I thought that if I just change all the Arrays of Days in the code to Sunday being at the end instead of the start would work but this just makes the dates for Monday-Saturday to be empty and then it starts with Sunday and paints on to the right where no Day-captions are anymore. Because I habe no experience in Javascript I cannot find out which code is responsible for this behaviour.
My questions are:
1) Does anyone have had a similar problem with a DatePicker in Javascript and found a solution he/she could share ?
2) Does anyone know a different Javascript DatePicker Example that can be used without having to buy it ?
The code has roughly 1200 lines of code so I will not post it here but it can be downloaded here.
Why not saying that you are talking of the FormRouter date picker (I guess they fixed the missing August 31 in the meantime). But then, you get what you pay…
Anyway, it is possible to create a date picker using the Dialog Object in Acrobat JavaScript. This then allows to freely configure the date picker whether to follow ISO standards (beginning the week with Monday), or USAn use (beginning the week with Sunday). It is essentially using the capabilities of the Date Object in JavaScript.
That date picker is available as developer toolkit. But not for free; creating smart and complex PDF applications is my business, and there is quite a bit of work behind that datepicker (however, if the datepicker is part of a project, it is not billed separately…). Feel free to contact me in private for further information an pricing (several customers told me that pricing is reasonable).
Anyway, studying the Date Object, understanding arrays, and grasp some knowledge about the Dialog Object would get you in the shape to create your own version.
The trick with the beginning of the week is indeed the enumeration of the day of the week. Add an offset, and you can set it to any day…
In short the answer to question 1: Yes; problem solvable and solved; to question 2: Yes, but No.
The html specs are a bit inconsistent about datetime fields:
https://html.spec.whatwg.org/multipage/forms.html#date-and-time-state-(type=datetime)
http://www.w3.org/TR/2014/REC-html5-20141028/forms.html#date-state-(type=date)
even so, it's almost expected that such problem to emerge time to time.
Looking for implementations, i've found a few:
https://github.com/chemerisuk/better-dateinput-polyfill
https://github.com/chemerisuk/better-timeinput-polyfill
But to solve my problem using angular i needed to bind the same attr model on two inputs, and it's bad, since two fields, each one with your own clear button will erase both inputs. Also it is defective on firefox. (please see plunker):
`angular.module("foo",[]).controller("fuzz",function($scope){
$scope.bar=new Date();
$scope.buzz=function(){ alert($scope.bar); };
});`
http://plnkr.co/edit/UAU30vaRwst83jZDL5Nx?p=preview
Is there a better way? will i need to use two fields? does datetime works on mobile?
Any guidance is quite welcome.
I have question, i'm creating project and in them i'm need to create datetimepicker,
standart datetime i can't use because firefox doesn't support this item, jquery i can't use because they didnt work (i guess problem in using jquery items before in my project). Where i can find analogs, please give me some links, or code with example.
Some like this, working only in chrome and IE, but not in firefox :
<input type="datetime-local" name="bdaytime">
Really thanks all for the help!
Do not use type="datetime-local"
Instead use type="datetime"
W3C HTML has dropped input type#datetime-local; "little independent
value & source of potential developer confusion"
Source
Jquery date and timepickers works as charm in all projects. I think, that you have problems with them because of conflicts with other libraries, such as MooTools or prototype.
Read that article about resolving jquery conflicts:
http://api.jquery.com/jquery.noconflict/
And as for dateTimepicker, i recommend:
http://trentrichardson.com/examples/timepicker/
Also, if you really need clock picker (analog clock), you should try and look for http://www.jqueryscript.net/demo/jQuery-Clock-Style-Time-Picker-Plugin-For-Bootstrap-3-clockpicker/
Does anybody know whats the name of the multi-month selector control used in Mint.com?
I have a video of it been used here. I've come across a lot of date picker and calendar controls but all of them are pretty much the same.
Preferably in jQuery
How about jQuery UI Datepicker? Its widely used and well tested.
It seems to me that this is a control from Qlik softwares (either Qlik Sense or QlikView) that allows users to do such selections. It can be embedded into Mint's solution.
Here's an example:
My Life in Data - Tab Running: https://eu-b.demo.qlik.com/QvAJAXZfc/opendoc.htm?document=qvdocs%2FMy%20Life%20in%20Data.qvw&host=demo11
Note that it is really hard to make sure as the video is not 'browsable'.