Date Selection in webapp and webapp date Selection

Source: Internet
Author: User

Date Selection in webapp and webapp date Selection

When developing a webapp, do you choose which third-party date Selection Control to use?

In fact, this is not so troublesome. Now mobile terminals are all WebKit kernels and support HTML5. In fact, as long as the input is weak, type = "date" will be OK, the operating system automatically identifies the date type and calls the date selection that comes with the system. Don't worry about the inconsistent style of the date control, because who cares? O (MMM □mmm) o, everyone is staring at their own mobile phones. Who chooses a date to compare other mobile phones?

Recently, I saw a very awesome date-based plug-in called mobiscroll, which has a very good reputation on the Internet. I also downloaded the plug-in for a while, the reason why he is not so awesome is that he chose a style like IOS and Android, but his price is as high as $800, which is expensive. Also, let's take a look at the Directory: Five css files, if there are so many NIMA js files, do users not need to pay for traffic?

The following describes how to use the date control that comes with HTML.

HTML:

1 <input id="start_time" name="start_time" type="date" class="form-control" />

JS:
1 $ ('# start_time'). val (new Date (); // you can specify the current Date as the default value of the control.

Of course, some children's shoes will ask me that it is of the date type and its value may be Fri Apr 03 2015 15:15:00 GMT + 0800 (China Standard Time ), how can I save these things to the database? Can I convert them to the string format I need? Of course!

JS:

1 // format formatStr: yyyy-MM-dd 2 Date. prototype. format = function (formatStr) 3 {4 var str = formatStr; 5 var Week = ['day', 'yi', '2', '3', '4 ', '5', '6']; 6 var month = this. getMonth () + 1; 7 str = str. replace (/yyyy | YYYY/, this. getFullYear (); 8 str = str. replace (/yy | YY/, (this. getYear () % 100)> 9? (This. getYear () % 100 ). toString (): '0' + (this. getYear () % 100); 9 str = str. replace (/MM/, month> 9? Month. toString (): '0' + month); 10 str = str. replace (/M/g, month); 11 str = str. replace (/w | W/g, Week [this. getDay ()]); 12 str = str. replace (/dd | DD/, this. getDate ()> 9? This. getDate (). toString (): '0' + this. getDate (); 13 str = str. replace (/d | D/g, this. getDate (); 14 str = str. replace (/hh | HH/, this. getHours ()> 9? This. getHours (). toString (): '0' + this. getHours (); 15 str = str. replace (/h | H/g, this. getHours (); 16 str = str. replace (/mm/, this. getMinutes ()> 9? This. getMinutes (). toString (): '0' + this. getMinutes (); 17 str = str. replace (/m/g, this. getMinutes (); 18 str = str. replace (/ss | SS/, this. getSeconds ()> 9? This. getSeconds (). toString (): '0' + this. getSeconds (); 19 str = str. replace (/s | S/g, this. getSeconds (); 20 return str; 21} 22 23 $ ('# start_time '). val (new Date (). format ("yyyy-MM-dd"); // yyyy/MM/dd can also be used. The separator is yours.


Summary:

Technological updates are advantageous for our developers. We should try to make full use of HTML5's potential, especially on mobile terminals. Do not follow the rules of using third-party components. The performance of mobile terminals is like a doll, we cannot withstand the storm. We need to take advantage of the tag attributes provided by HTML5 for our developers to simplify their work, and load as few third-party components as possible, such as js.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.