EasyUIプラグインjquery.Autocomplete自動検索+js、cssパッケージ
4483 ワード
var availableTags = [
"ActionScript",
"AppleScript",
"Asp",
"BASIC",
"C",
"C++",
"Clojure",
"COBOL",
"ColdFusion",
"Erlang",
"Fortran",
"Groovy",
"Haskell",
"Java",
"JavaScript",
"Lisp",
"Perl",
"PHP",
"Python",
"Ruby",
"Scala",
"Scheme"
];
$("#bus").autocomplete(
availableTags,{ scroll:false,autoFill:false,matchContains: true,minChars:0}
).result(function(event, data, formatted){
//alert(availableTags);
});
<input id="bus" name="bus" type="text"
style="width: 225px" />
動的に追加:
$(function(){
var availableTags = [];
$.ajax({
type: 'POST',
url: $.test.contextPath + "/xxxAction.do?method=xxx",
dataType: 'json',
success: function(data) {
$(data).each(function(){
alert(this.text);
availableTags.push(this.text);
});
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
}
});
/* availableTags = [
"ActionScript",
"AppleScript",
"Asp",
"BASIC",
"C",
"C++",
"Clojure",
"COBOL",
"ColdFusion",
"Erlang",
"Fortran",
"Groovy",
"Haskell",
"Java",
"JavaScript",
"Lisp",
"Perl",
"PHP",
"Python",
"Ruby",
"Scala",
"Scheme"
];*/
$("#bus").autocomplete(
availableTags,{ scroll:false,autoFill:false,matchContains: true,minChars:0}
).result(function(event, data, formatted){
//alert(availableTags);
});
});
public ActionForward xxx(ActionMapping mapping, ActionForm form,
HttpServletRequest request, HttpServletResponse response)
throws Exception {
JSONObject json = new JSONObject();
JSONObject json2 = new JSONObject();
JSONObject json3 = new JSONObject();
JSONArray jsonArray = new JSONArray();
json.put("text","abc");
json2.put("text","ade");
json3.put("text","aef");
jsonArray.add(json);
jsonArray.add(json2);
jsonArray.add(json3);
Utils.writeJsonText(jsonArray.toString(), response);
return null;
}
:[{"text":"abc"},{"text":"ade"},{"text":"aef"}]