<kendo ui> Second article: Kendo initialization of the UI basic control

Source: Internet
Author: User

Kendo UI controls are initialized in a number of ways, but I'm used to initializing buttons and plain text boxes in HTML code, the rest of them, such as drop-down boxes, date controls, tables, and some more special numeric text boxes, which I'm accustomed to initialize in jquery code. I only write the initialization of several commonly used controls, and more of the controls are initialized in much the same way that you can check the official documents of kendo.

Kendo the initialization of the normal text box:

    <ID= "Your text box id" Type= "text" class= "K-input k-textbox"      

Of course, you can also use the style attribute in the inside to add some element style, such as width and so on, all can be expressed in PX units.


Kendo the initialization of the button:

    <ID= "your button id" Type= "button" value= "Your buttons display text" class     

The above two kinds of controls I like to initialize them in HTML, the following is the use of JS to initialize the operation:

Kendo the initialization of the drop-down box:

    <id= "xxx"></Select     

Similarly, in this selector, in addition to the ID selector, you can also use the tag Selector, class selector, attribute selector and so on, of course, the use of the ID selector is the most accurate, but at the time of initialization, it is recommended to add a global drop-down box initialization of the JS code, using the tag selector:

    $ ("select"). Kendodropdownlist ();  

Kendo initialization of the date selection control:

    <ID= "Your date control id" " value=" " placeholder      

    $ ("#你的日期控件ID"). Kendodatepicker ();  

Here, the placeholder property is the default prompt to set the text box or date box, which is the ToolTip for the gray font, which can be used without writing this property.

Kendo the initialization of a numeric text box control:

  <ID= "Your numeric text box ID"  type= "Number" value = "0" min = "0" max= "10" 

where min is the minimum value that the text box can enter, Max is the maximum value that can be entered, and the format in the JS code is the formatting that specifies the number of the text box, for example, with no decimal points, whether it can only lose integers, For some detailed instructions on Kendoui's Kendonumerictextbox controls, you can read the following two websites:

Introduction to the properties of a numeric text box

Official description of format

Initialization of the Kendo table:

<id= "MYTB"></div     

Kendo Grid table is the most troublesome and the most difficult operation of the kendo control, which contains a lot of properties, such as paging properties, data source properties, if you want to learn kendo, the first thing to break through is the kendo grid, in the back of the blog, I'll go through some of the ways in which grids are used in detail.

<kendo ui> Second article: Kendo initialization of the UI basic control

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.