KendoUI系列:ComboBox

时间:2022-03-16 11:28:28

  1、基本使用

  1>、创建Input

<input id="color" placeholder="Select Color..." />
<link href="@Url.Content("~/Content/kendo/2014.1.318/kendo.common.min.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/kendo/2014.1.318/kendo.default.min.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/kendo/2014.1.318/jquery.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/kendo/2014.1.318/kendo.web.min.js")" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
$("#color").kendoComboBox({
dataTextField: "text",
dataValueField: "value",
dataSource: [
{ text: "Black", value: "1" },
{ text: "Orange", value: "2" },
{ text: "White", value: "3" }
],
filter: "contains" // 包括:eq,neq,gt,gte,lt,lte,startswith,endswith,contains,doesnotcontain
//index: 1 // 默认选中项索引,索引从0开始。
});
});
</script>

  效果预览:

KendoUI系列:ComboBoxKendoUI系列:ComboBox

  设置初始化时选中项:

var color = $("#color").data("kendoComboBox");
color.select(1); // 设置初始化时选中项,索引从0开始。

  获取当前选中项Value值:

var color = $("#color").data("kendoComboBox");
color.value();

  获取当前选中项Text值:

var color = $("#color").data("kendoComboBox");
color.text();

  2>、创建select

KendoUI系列:ComboBox的更多相关文章

  1. KendoUI系列:Window

    1.基本使用 <link href="@Url.Content("~/Content/kendo/2014.1.318/kendo.common.min.css") ...

  2. KendoUI系列:MultiSelect

    1.基本使用 1>.创建Input <link href="@Url.Content("~/Content/kendo/2014.1.318/kendo.common. ...

  3. KendoUI系列:DatePicker

    1.基本使用 <link href="@Url.Content("~/C ontent/kendo/2014.1.318/kendo.common.min.css" ...

  4. KendoUI系列:DropDownList

    1.基本使用 1>.创建Input <input id="dropDownList" /> <link href="@Url.Content(&q ...

  5. &lbrack;转&rsqb;KendoUI系列:Grid

    本文转自:http://www.cnblogs.com/libingql/p/3774879.html 1.基本使用 <div id="grid"></div&g ...

  6. C&num; WinForm开发系列 - ComboBox

    5.一个带CheckBox,分组,颜色标记等功能的下拉框  PowerComboBoxCSharp.rar 包含自动完成下拉框,字体下拉框,电脑盘符,多列下拉框,带CheckBox,树型下拉框等.代码 ...

  7. KendoUI系列:TreeView

    1.加载本地数据 <link href="@Url.Content("~/Content/kendo/2014.1.318/kendo.common.min.css&quot ...

  8. KendoUI系列:TabStrip

    <link href="@Url.Content("~/Content/kendo/2014.1.318/kendo.common.min.css")" ...

  9. KendoUI系列:PanelBar

    <link href="@Url.Content("~/Content/kendo/2014.1.318/kendo.common.min.css")" ...

随机推荐

  1. Cordova应用程序修改启动画面或者Icon

    1)  制作启动画面图片或icon ionic resources //同时生成icon和splash ionic resources --icon //只生成icon ionic resources ...

  2. EntityFramework 7 Linq Contains In 奇怪问题(已修复)

    问题说明: 博客问题纪录 Use EF7, Linq Contains In is error. EF7 Code Commit adding (client side) support for Co ...

  3. 使用sublime编写c&sol;c&plus;&plus; 总结

    大块头IDE Visual studio太大了,记事本也能写代码但无疑是装逼过分了.写一些轻量级的c/c++代码使用sublime来写是个很好的选择. 三步走: 编译器(win下安装了vs就使用cl, ...

  4. Atitit cms wordpress get&lowbar;post &&num;160&semi;返回的WP&lowbar;Post 规范 标准化

    Atitit cms wordpress get_post  返回的WP_Post 规范 标准化 public $ID; public $post_author = 0; * The post's l ...

  5. Dev gridView中设置自适应列宽和日期显示格式、金额的显示格式

    在Dev GridView控件中,数据库中表数据日期都是长日期格式(yyyy-MM-dd HH:mm:ss),但显示在控件变成短日期格式(yyyy-MM-dd),金额显示要显示精确的数值, 比如80. ...

  6. Activiti 工作流会签开发设计思路

    http://man1900.iteye.com/blog/1607753 在流程业务管理中,任务是通常都是由一个人去处理的,而多个人同时处理一个任务,这种任务我们称之为会签任务.这种业务需求也很常见 ...

  7. Course4-Python ftp&sol;ssh

    1. ftp Python 自带有模块支持ftp. 可以参看一下代码. #!/usr/bin/env python import sys import os import time import ge ...

  8. 百度前端学院-基础学院-第七天到第八天之BFC

    1.BFC简介 BFC全称"block formatting context",中文为“块级格式化上下文”.特征总之记住一句话: BFC元素特征表现原则就是:内部元素无论怎么翻江倒 ...

  9. 【uoj336】【清华集训2017】无限之环

    题目 描述 ​ 给出一个\(n*m\)的网格,每个格子里的水管可能向四个方向都有接口: ​ 游戏的目的是不能让水管漏水,即所有接口都有另一个接口与之相接: ​ 你一步可以将一个格子中的水管旋转\(90 ...

  10. AJAX控件——多层弹出Accordion

    <asp:Accordion ID="Accordion1" runat="server" ContentCssClass="content&q ...