I'm developing a web app where I should get time and date through a form. I have tried time but unfortunately it is not compatible with all browser. For example it doesn't work properly in Safari. So which is the best way to get date and time?
Select a time: <input type="time" name="usr_time">
this element doesn't work correctly on Safari
The new HTML 5 input types are very poorly supported right now.
Some options:
You can leave the code as it is and sanity check the input with JavaScript.
Use two input fields as suggested by #HaukurHaf
Use a JavaScript library
Write your own JavaScript
The quickest to get right would be to use a library that uses JavaScript to attach a script to the input field giving the user a better experience with perhaps a clock or other selector to help them.
For example, the JQuery based Time Entry helper by Keith Wood.
Related
I have a rather stupid question, but I would like some input on the issue.
On some websites you have a date input field, which has a placeholder in the form of mm/dd/yyyy.
However, when you start typing, the characters are getting replaced one by one, like 02/3d/yyyy.
So its not a placeholder but some sort of dynamic input already. My question is, how is this generated? Is this a javascript library (jquery, angularjs etc.) or any other feature im not aware of?
Thanks for your help, I tried finding appropriate code online but nothing did the function described above.
I mean of course you could program in JS an event listener on keypress, and depending on the input you adjust the field accordingly, but I wonder if there is an easier way to do so!
You can create the mask by following this guide: https://github.com/RobinHerbots/Inputmask
I am trying to call a page in my customers webapplication (Exact Synergy Enterprise)
This is the link: http://someserveridontdisclose/Synergy/docs/CSCANEduCourseCard.aspx?ProjectNr=ACPGINTV
Within this page is an Ajax TabContainer with several TabPanels. One of them is called 'Doelgroepen'
I dont have the source for this application, as i am not the developer of it. We only develop custom extentions to it.
Here's the question: Is it possible to focus on one of the tabs USING ONLY AN URL? If so How?
Thank you very much for your thoughts about this.
try to set with javascript. you'll have to write your own js to get index number you want from url, then set like this
$find('<%=TabContainer1.ClientID%>').set_activeTabIndex(2);
http://forums.asp.net/t/1127834.aspx
http://www.aspforums.net/Threads/420684/ASPNet-AJAX-TabContainer-Set-Active-Tab-Client-side-using-JavaScript/
If you do not have access to the code and if this is not part of the requirement / design specification for the application you are using (ie: what you asked the developer to do), then the answer is No.
The control does not have "native" support for URL tab selection. There needs to be specific code in the application in order to handle this.
It is however very easy to implement, if you absolutely need it, it shouldn't take much time (about 15-30 lines of code, depending on how many tabs/urls combination you need).
You can find a running sample of the AjaxControlToolkit Tabs control at the following link (the available functionnalities are described in there):
http://www.asp.net/ajaxLibrary/AjaxControlToolkitSampleSite/Tabs/Tabs.aspx
If the TAB has an ID you could make it visible by adding '#tabid' to the URL.
I have a time input, basically just:
Time: <input type="time" name="timeinput"/>
http://jsfiddle.net/X8E9N/
According to
http://www.w3.org/TR/html-markup/input.time.html
it supports the step attribute. Is it possible to use this attribute (or other means) to set the step size to 10 minutes? If so, how?
I am aware of some other solutions (e.g. datebox plugin), but I'm hoping for a purely html solution if possible. I am using the datebox plugin sometimes, but it seems pretty slow on mobile devices so I am trying to use the native time pickers when possible.
It's possible. You just need to put seconds in step parameter, ex.
<input type="time" step="300"> <!-- 5 min step -->
Yes. You can specify step attribute in seconds.
However, Opera, iOS Safari, and Google Chrome don't reject non-aligned user input. A user can specify 11:59 to such time field. Then, Opera and Google Chrome show a validation error message when he tries to submit the form.
Seems like Chrome 86 does not support this.
As of iOS 9.1, iOS doesn't support max min or step.
http://caniuse.com/#feat=input-datetime
Sadly, this isn't as cut and dry as I had hoped. Over the past few weeks I had been researching the use of jQuery with CRM. While it's nice and dandy for style alterations, I couldn't find any examples that are closer to business logic.
For example, today I needed to alert the browser if one of 4 fields were empty. Two were date fields, one a picklist and one a checkbox (bit). I thought that calling $("#formElement").val() would have gotten the value, and in some cases it did, such as the picklist after I parsed it as an int. However, the date fields always returned an empty string.
Looking through the CRM form HTML, I see that "#formElement" isn't always the ID of an input for a CRM form element. Case in point, the date fields had ID="DateTime" (or something similar). At this point, I had thought that I will need to create a filter that will take the table that contains #formElement as it's ID and look for the value of the first input in that table, but at that point using crmForm.all.formElement.DataValue just seemed easier.
I'm sure someone here has a solution for this (and maybe some explaination of how CRM Forms are written to help with a filter), and it really stinks not being able to install add-ons for Internet Explorer here at work. Thanks for any and all help.
Use jQuery to select the form itself (either by its ID or just by $(form)) and then iterate over its children that are input text fields. I haven't done this for a form before but it might work for you.
For anyone else who is looking for an answer, I have figured it out to a managable degree. Unfortuantely, I haven't been able to use CSS selectors to shorten attribute names, but I have been able to utilize jQuery to cut down on time. If you'd like to use a CRM 4 attribute with jQuery, it looks like this:
$(crmForm.all.new_attribute).bind("click", function() { ClickFunction(); });
What I was really gunning for was chaining, because there are plenty of times when I need to null a field, disable it, and then force it to submit. A little bit of magic and this:
crmForm.all.new_attribute.DataValue = null;
crmForm.all.new_attribute.Disable = true;
crmForm.all.new_attribute.ForceSubmit = true;
Becomes:
crmForm.all.new_attribute.dataValue().disable().forceSubmit();
I hope this helps some of you guys out!
I need to validate a date/time field on a webpage but want it to do it without reloading the page and would like 'instant' feedback for the users.
What's the best/easiest solution.
BTW: easiest scores 65% of total points
Edit:
What if best was 65% of total points?
If you would like to use JavaScript then it has built in date validation functions. However, if you do not want to go the JavaScript route, you could change the UI to dropdown controls which would limit the users ability to enter invalid data. You would still need to check server side to ensure nobody submits Feb 30th.
Check out this javascript date validation function.
It uses javascript, regular expressions and the 'onblur' event of a text input.
#David H. Aust
Using onblur for validation is problematic, because some folks use the enter key, not the mouse, to submit a form. Using onblur and the form's onsubmit event in conjunction could be a better solution. Back when I did JS validation for forms a lot more, I would run against keyup events. This gave the user instant feedback on whether or not their entry was correct. You can (and I did) also put checks in place so that the user doesn't receive an "incorrect" message until they've left the field (since you shouldn't tell them they're incorrect if they aren't done yet).
I would recommend using drop-downs for dates, as indicated above. I can't really think of any reason not to--you want the user to choose from pre-defined data, not give you something unique that you can't anticipate.
You can avoid February 30 with a little bit of Javascript (make the days field populate dynamically based on the month).
#Brian Warshaw
That is a really good point you make about not forgetting the users who navigate via the keyboard (uh, me).
Thanks for bringing our attention to that.
A simple javascript method that reads what's in the input field on submit and validates it. If it's not valid, return false so that the form is not submitted to the server.
... onSubmit="return validateForm();" ...
Make sure you validate on the server side too, it's easy to bypass javascript validation.
If you're using ASP.NET, it has validator controls that you can point to textboxes which you can then use to validate proper date/time formats.
There are a couple of date widgets available out in the aether. Then you can allow only valid input.
I've used this small bit of js code in a few projects, it'll do date quickly and easily along with a few others.
Link
Looks like there's a great video about the ASP.NET AJAX Control Toolkit provides the MaskedEdit control and the MaskedEditValidator control that works great. Not easy for beginners but VERY good and instant feedback.
Thanks for all the answers though!
asp.net
Unfortunately I can't accept this answer.