Jquery的自动填充功能
完成JQUERY的自动填充功能:
首先在页面要去去要填充数据:
页面:
<tr>
??? <td nowrap="true">
??????? 设备号:
??? </td>
??? <td>
??????? <input type="text" id="VehicleNumber"/>
??? </td>
???
</tr>
首先设置#VehicleNumber的最小长度为0.
然后去去该文本框中的数据。
然后设置该文本框的点击事件,当点击的时候就去触发显示该下拉列表。
他返回的是JSON数据的格式。
?$("#VehicleNumber").autocomplete({
??????????? minLength: 0
??????? });
??????? $.getJSON('@Url.Action("GetVehicleSearchData")', {}, function (data) {
??????????
??????????? $("#VehicleNumber").autocomplete("option", "source", $.map(data, function (val) { return val.VehicleNumber }))
??????? });
??????? $("#VehicleNumber").focusin(function () {
??????????? $("#VehicleNumber").autocomplete("search");
??????? });
action代码:
首先是定义数据的模型类,也就是我们页面所需要的数据集合;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
namespace RSUWeb.Models
{
??? public class InitSearchVehicle
??? {
??????? public string VehicleNumber { get; set; }//车辆编号
??????
??????? public string VehicleTypeNumber { get; set; }//整车型号
?????
??????? public string RsuNumber { get; set; }//RSU编号
???????
??????? public string SimNumber { get; set; }//SIM卡号
??? }
}
然后定义ACTION中的查找方法:
?public ActionResult GetVehicleSearchData()
??????? {
??????????? return Json(positionServiceIndexService.GetVehicleSearchData(), JsonRequestBehavior.AllowGet);
??????? }
???????
服务层代码:
一定要注意的问题,我们不能用我们已经定义好的实例类模型,估计是我定义的实例类模型中有别的对象的引用的
原因,通过实体框架我查找到的是Vehicle类型的对象,然后我通过给我自定义的类型进行赋值,然后再返回给页面。
public List<InitSearchVehicle> GetVehicleSearchData()
??????? {
??????????? List<InitSearchVehicle> result = new List<InitSearchVehicle>();
??????????? var vehicles = positionServiceIndexRepository.GetMany(vehicle => 1 == 1);
??????????? foreach (var vehicle in vehicles)
??????????? {
??????????????? InitSearchVehicle initvehicle = new InitSearchVehicle();
??????????????? initvehicle.VehicleNumber = vehicle.VehicleNumber;
??????????????? initvehicle.VehicleTypeNumber = vehicle.VehicleTypeNumber;
??????????????? initvehicle.RsuNumber = vehicle.RsuNumber;
??????????????? initvehicle.SimNumber = vehicle.SimNumber;
??????????????? result.Add(initvehicle);
??????????? }
??????????? return result;
??????? }