对Asp.net Mvc 和 jQuery UI使用者的一些忠告

简介: 在以前的工作中,我如果需要写一个类似于Google搜索的自动完成,那可能涉及到JS的编写,CSS样式,以及后台代码如何生成json或者xml传递给自动完成控件。 现在可以使用jQuery UI的Autocomplete,你的工作量会少的惊人。

在以前的工作中,我如果需要写一个类似于Google搜索的自动完成,那可能涉及到JS的编写,CSS样式,以及后台代码如何生成json或者xml传递给自动完成控件。

现在可以使用jQuery UI的Autocomplete,你的工作量会少的惊人。来看我如何实现:

 

1.添加jquery ui js和css引用。

image

 

2.页面添加一个textbox,并在该textbox上使用autocomplete脚本:

image

 

3.添加Action,并返回json。

在第二步中我们看到ID为complete的textbox它的source为home这个controller下的action: Users。所以接下来我们要来实现Users这个action:

image

 

我们使用Asp.net mvc自带的Json转换方式来把一个string Array转化为json,并返回给客户端的autocomplete控件。

 

运行下看看结果:

先输入一个“s”:

image

 

在Action设置断点,可以看到jQuery ui的autocomplete控件已经把s序列化成json传输到服务器端,asp.net mvc反序列化后,传给方法Users(string term)。

 

image

 

 

 

 

这里随便写了一个数组,并把该数组序列化成json,返回到客户端,客户端结果:

image

 

很简单的几步就搞定了自动完成。

最令人觉得激动地是所有的样式都完成可以在jQuery UI官网上生成你需要的皮肤,然后导出,替换现在的jquery ui的css文件就OK了。

 

其次我觉得比较值得使用的是jquery ui的Dialog控件和Datepicker控件。

你的datepicker完成可以做成通用的控件放到Share文件夹下。

 

Dialog控件的使用可以让你的增删改成弹出框方式来展示,增强网站的友好型。这里你需要结合jquery的ajax方法,比如load,get来把view页面加载下来,然后使用jquery的系列化方法来把数据Post到服务器端。

具体的例子我以后尽量写几个,今天赶时间不写了先。

 

最后一部分想和大家分享使用asp.net mvc的开发人员几点忠告:

a.先删除掉AccountController,从来都别使用那个自带的用户管理Controller,自己去实现。

 

b.能使用IoC 容器就使用吧。 只有好处没有坏处。例如Autofac,Ninject。 不过初级的程序员先注意下IoC容器的单体模式和工厂模式,不然项目中使用后,你会发现你悲剧了。多了解,深了解,否则,别用在项目中。

 

c.尽量别用ViewData这个玩意。

 

d.记得一定要使用FIlter这个属性来实现AOP编程,你不需要自己去写你的AOP组件。例如Dynamic.Proxy这些都先别考虑,首先考虑Global Filter。

 

e.自定义你的ViewEngine。 你需要定义好你的viewengine,不然以后你会发现很多扩展都是无法实现的。。。。。

 

目录
相关文章
|
3月前
|
开发框架 前端开发 JavaScript
ASP.NET MVC 教程
ASP.NET 是一个使用 HTML、CSS、JavaScript 和服务器脚本创建网页和网站的开发框架。
46 7
|
3月前
|
Linux C# Android开发
一个开源、跨平台的.NET UI框架 - Avalonia UI
一个开源、跨平台的.NET UI框架 - Avalonia UI
129 3
|
7月前
|
Linux C# Android开发
.NET Avalonia开源、免费的桌面UI库 - SukiUI
.NET Avalonia开源、免费的桌面UI库 - SukiUI
325 5
|
3月前
|
存储 开发框架 前端开发
ASP.NET MVC 迅速集成 SignalR
ASP.NET MVC 迅速集成 SignalR
74 0
|
4月前
|
开发框架 前端开发 .NET
ASP.NET MVC WebApi 接口返回 JOSN 日期格式化 date format
ASP.NET MVC WebApi 接口返回 JOSN 日期格式化 date format
55 0
|
4月前
|
开发框架 前端开发 安全
ASP.NET MVC 如何使用 Form Authentication?
ASP.NET MVC 如何使用 Form Authentication?
|
4月前
|
开发框架 .NET
Asp.Net Core 使用X.PagedList.Mvc.Core分页 & 搜索
Asp.Net Core 使用X.PagedList.Mvc.Core分页 & 搜索
142 0
|
4月前
|
前端开发 Linux API
Avalonia:一个.NET跨平台UI框架
Avalonia:一个.NET跨平台UI框架
152 0
|
7月前
|
开发框架 前端开发 JavaScript
JavaScript云LIS系统源码ASP.NET CORE 3.1 MVC + SQLserver + Redis医院实验室信息系统源码 医院云LIS系统源码
实验室信息系统(Laboratory Information System,缩写LIS)是一类用来处理实验室过程信息的软件,云LIS系统围绕临床,云LIS系统将与云HIS系统建立起高度的业务整合,以体现“以病人为中心”的设计理念,优化就诊流程,方便患者就医。
83 0
|
7月前
|
开发框架 前端开发 .NET
C# .NET面试系列六:ASP.NET MVC
<h2>ASP.NET MVC #### 1. MVC 中的 TempData\ViewBag\ViewData 区别? 在ASP.NET MVC中,TempData、ViewBag 和 ViewData 都是用于在控制器和视图之间传递数据的机制,但它们有一些区别。 <b>TempData:</b> 1、生命周期 ```c# TempData 的生命周期是短暂的,数据只在当前请求和下一次请求之间有效。一旦数据被读取,它就会被标记为已读,下一次请求时就会被清除。 ``` 2、用途 ```c# 主要用于在两个动作之间传递数据,例如在一个动作中设置 TempData,然后在重定向到另
362 5

相关实验场景

更多