java返回值：modelAndView.put("data", data);
modelAndView.put("keys", new String[]{"id","vessel_name_en","vessel_name_cn","voyage"});
modelAndView.setViewPath("/ajax/jsonResult.ftl");
freemarker 的json值：[
<#list data as row>
{
<#list keys as key>
<#if key_index=keys?size-1>
"${key}":"${row["${key}"]?default("")}"
<#else>
"${key}":"${row["${key}"]?default("")}",
</#if>
</#list>
}
<#if row_index!=data?size-1>
,
</#if>
</#list>
]
jquery的ajax方法：
$(document).ready(function(){
$("#vessel_name_en").autocomplete('${webroot}/suggest!vessel.do', {
mustMatch:false ,
width:300,
parse: function(data) {
return $.map(eval(data), function(row) {
return {
//固定就得這么寫
data: row,
//匹配內容
value: row.vessel_name_en,
//最后回填的數據
result: row.vessel_name_en
}
});
},
//顯示的內容
formatItem: function(item) {
return item.vessel_name_en +" / "+item.vessel_name_cn+" / "+item.voyage;
}
}).result(function(event,item){
$("#shipInfoId").val(item.id);
$("#vessel_name_cn").val(item.vessel_name_cn);
$("#voyage").val(item.voyage);
$("#bill_no").focus();
});
<#macro vesselInfo index=index readonly=true>
<table class="guide" style="width:100%;" id="base_tbl">
<tr>
<th>英文船名</th><td><input type="hidden" name="shipInfoId" value="${index.ship_info_id?if_exists}" id="shipInfoId"/><input name="vesselNameEn" id="vessel_name_en" value="${index.vessel_name_en?if_exists}"/></td>
<th>中文船名</th><td><input name="vesselNameCn" id="vessel_name_cn" value="${index.vessel_name_cn?if_exists}"/></td>
<th>航次</th><td><input name="voyage" id="voyage" value="${index.voyage?if_exists}"/></td>
</tr>
</table>
</#macro>