1.引入以下js和css

  <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet"
type="text/css" />
<link href="@Url.Content("~/Content/themes/base/jquery.ui.all.css")" rel="stylesheet"
type="text/css" />
 <script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")"
        type="text/javascript"></script>      <script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")"
        type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery-ui-1.8.11.min.js")"
        type="text/javascript"></script>

2.  html代码如下

<input type="text" id="t" name="t" data-autocomplete-source="@Url.Action("News","AutoComplete")" />

3.后台代码如下:

   public ActionResult News()
{
var list = db.Artists.Select(m => new { value=m.Name}).ToList(); return Json(list,JsonRequestBehavior.AllowGet);
}

4. js调用代码如下

<script type="text/ecmascript">

    $("#t").each(function () {
var target = $(this);
target.autocomplete({ source: target.attr("data-autocomplete-source") }); }) </script>

MVC笔记3:JQuery AutoComplete组件的更多相关文章

  1. 【ASP.Net MVC】在AspNet Mvc使用JQuery AutoComplete组件

    在AspNet Mvc使用JQuery AutoComplete组件 官方文档: http://api.jqueryui.com/autocomplete/#entry-examples 要使用JQu ...

  2. Bootstrap Typeahead/Jquery autocomplete自动补全

    使用Bootstrap Typeahead 组件: Bootstrap 中的 Typeahead 组件就是通常所说的自动完成 AutoComplete,自动填充. 效果如图所示: 实现方式: 1.引入 ...

  3. MVC+Jquery+autocomplete(汉字||拼音首字母搜索)

    最近项目中用到了autocomplete了,总结一下经验. 我们先来看一下效果:

  4. JqueryUI学习笔记-自动完成autocomplete

    <!DOCTYPE html><html><head><meta charset="UTF-8"><title>Inse ...

  5. [Jquery] Jquery AutoComplete的使用方法实例

    jQuery的Autocomplete(自动完成.自动填充)插件 jquery-autocomplete配置: <script type="text/javascript" ...

  6. [转]jQuery.Autocomplete实现自动完成功能(详解)

    本篇文章除了介绍jquery.autocomplete基本参数外,主要说明jquery.autocomplete的数据源的格式问题.     1.jquery.autocomplete参考地址 htt ...

  7. jQuery.Autocomplete实现自动完成功能(详解)

    1.jquery.autocomplete参考地址 http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/ http://do ...

  8. jquery.autocomplete自动补全功能

    项目实例: 一:js //SupplierAutoComplete.js $().ready(function () { $("#txtSupplier").autocomplet ...

  9. Jquery AutoComplete的使用方法实例

    jquery.autocomplete详解 语法: autocomplete(urlor data, [options] ) 参数: url or data:数组或者url [options]:可选项 ...

随机推荐

  1. Nginx配置-伪静态,隐藏index.php大入口

    server { listen ; server_name ; root E:/www/wvtuan/; index index.php index.html; log_not_found off; ...

  2. 认识和选用常用的几种 GPRS 模块(转)

    源:http://blog.sina.com.cn/s/blog_4d80055a0100e8kr.html 我在这里把常见的GPRS模块分成3种: (1)GPRS DTU(GPRS数传单元,常称GP ...

  3. 【floyd】 poj 2240

    #include <iostream> #include <map> #include <string> #include <memory.h> usi ...

  4. 救援行动(save)

    救援行动(save) 题目描述 Angel被人抓住关在一个迷宫了!迷宫的长.宽均不超过200,迷宫中有不可以越过的墙以及监狱的看守.Angel的朋友带了一个救援队来到了迷宫中.他们的任务是:接近Ang ...

  5. 扩展方法实现DevExpress控件校验

    DevExpress控件中,如果要控件的值进行校验,需要用到DXValidationProvider控件和DXErrorProvider控件,按照正常思路,无论使用哪个控件要实现校验效果时都需要对每个 ...

  6. libevent和libev的区别对比(二)

    之前有一篇文章描述过一些对比: http://www.cnblogs.com/charlesblc/p/6078029.html 这里在代码和应用方面再说一下. 看一下两边的Helloworld基本就 ...

  7. CG之菲涅尔效果简单实现

    菲涅尔效果,指当光到达两种材质的接触面时,一些光在接触面的表面被反射出去,而另一部分光将发生折射穿过接触面. 现在要用shader来实现这种效果,如果要精确地描述这种底层的物理,其计算公式是非常复杂的 ...

  8. Button MouseEvent颜色变化

    public partial class Form1 : Form { public Form1() { InitializeComponent(); this.button1.Enter += bu ...

  9. achartengine画出动态折线图

    achartengine画出动态折线图的效果最近有个项目需要用到实时曲线图,我也上网搜索了一下,最后还是选择使用achartengine这个现成的东西,毕竟自己再canvas一下实在是太麻烦,而且项目 ...

  10. PAT (Advanced Level) 1029. Median (25)

    scanf读入居然会超时...用了一下输入挂才AC... #include<cstdio> #include<cstring> #include<cmath> #i ...