JavaScript表单填写时，数据索引筛选自动填写功能效果

       在开发中，经常需要在做索引操作，比如根据某ID的部分数字去索引出类似该ID的所有相关数据，然后选择其中一条，就会将该ID的整条数据自动填写到对应的表单中。

JavaScript代码：

<script type="text/javascript">

$(function() {
$("#id").keyup(function(){
var id = $.trim($(this).val());
if(id != ""){
$.post('----url----test.action',{"对象.id":id},function(data){
$("#id").autocomplete({
source: initAutoComplete(data),//设置选择时的显示数据
maxHeight:100,
select: function(e, ui){
var noName = ui.item.value; //选中的那个value值
if(noName != null) {
setValue(data,noName);//将选中的数据自动填充
}
}
});
},"json");
}
});
});

<pre name="code" class="javascript">function initAutoComplete(json){
var availableTags = [];
$.each(json, function(i) {
var row = {label: "【对象ID】"+json[i].id + "【对象名称】"+json[i].name,value: json[i].id};
availableTags.push(row);
});
return availableTags;
} function setValue(data,noName){ $.each(data, function(i) { if(data[i].id == noName){if($("#id").val() == "") $("#id").val(data[i].id); if($("#name").val() == "") $("#name").val(data[i].name); }});}</script>

后台代码：

1.

public void test() {
String result = entityService.findById(对象.getId());//此处后台为模糊查询
Struts2Utils.renderJson(result);
}2.
public String findById(对象 entity) {
String result = null;
List<对象> list = entityDAO.findByLikeNo(对象.getId());
if(list != null){
JsonConfig jsonConfig = new JsonConfig();
jsonConfig.registerJsonValueProcessor(Date.class,new JsonDateValueProcessor());
result = JSONArray.fromObject(list, jsonConfig).toString();
}
return result;
}

其他java文件和jarpublic class JsonDateValueProcessor implements JsonValueProcessor{
private String datePattern = "yyyy-MM-dd";
public JsonDateValueProcessor() {
super();
}
public JsonDateValueProcessor(String format) {
super();
this.datePattern = format;
}
public Object processArrayValue(Object value, JsonConfig jsonConfig) {
return process(value);
}
public Object processObjectValue(String key, Object value,
JsonConfig jsonConfig) {
return process(value);
}

private Object process(Object value) {
try {
if (value instanceof Date) {
SimpleDateFormat sdf = new SimpleDateFormat(datePattern,Locale.UK);
return sdf.format((Date) value);
}
return value == null ? "" : value.toString();
} catch (Exception e) {
return "";
}

}
public String getDatePattern() {
return datePattern;
}
public void setDatePattern(String pDatePattern) {
datePattern = pDatePattern;
}

}

需要    json-lib-2.1.jar