Datetimefield control added for ext (with source code)

Recently, I used ext to develop a project because of my own hot mind. I referenced this huge class library. All the people went to the backend, and I was alone at the front-end. A little fun!

Because the project is a little special and requires Custom forms, my solution was to use XML to organize the layout at the front end, which maintained the maximum flexibility for the front end, you only need to edit the corresponding XML for all previous layout changes. In this way, all controls are destined to display all Ext. (After the project is completed, write an article about how to use XML to dynamically organize ext ).

At the beginning, I thought that ext's built-in controls were enough for my project. The more I got, the more I found myself fighting with controls every day.

By following this complaint, the ext class library is too boring to even have a built-in datetime control. There is a bug widely spread on the internet, and I feel that it is not very convenient to use it. I just want to modify it myself. The tests should be perfect,CodeIt is compressed and easy to carry. It is essential for home travel! Share it! The following is a demo image:

(Select the hour interface, double-click the selected back-to-Main Interface) (select the sub-interface, double-click the selected back-to-Main Interface)

 

After the transformation, the main control is specific, there is a large selection of hours and points of the interface, the user can double-click to deal. If you want to adjust the settings in the current time, you can adjust the settings on the main interface left and right. This is really convenient.

Add several custom attributes:

1 Prevhourtext: " Previous hour " , // Title text displayed on the left arrow of the hour (1)
2 Nexthourtext: " Next hour " , // Title text displayed on the right arrow of the hour
3 Hourtext: ' Choose hour ' , // Displayed on the hour selection page, top description text
4 Prevminutetext: " Previous minute " , // Title text displayed on the left arrow of the minute of Adjustment
5 Nextminutetext: " Next minute " , // Title text displayed on the right arrow of minute adjustment
6 Minutetext: ' Choose minute ' , // The description text displayed on the top of the page in minutes is useless because the layout is too crowded.
7
8 Hourname: " H " , // Indicator text
9 Minutename: " M " , // Minute
10

These attributes are displayed in English. You can set them in the corresponding package or specify them dynamically. More importantly, you can change the code to Chinese!

PS: if a brother uses a project and has a bug, email me directly! Click to download