页面调用组件方法
<jsp:include page="/jsp/activity/selectSingle.jsp"> <jsp:param name="title" value="gymname" /> <jsp:param name="value" value="activity.gymname"/> <jsp:param name="url" value="/user/activity/singleControl.ao?method=selectGym"/> </jsp:include>
控件 JSP页面，需要JQuery支持
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ taglib uri="/WEB-INF/tld/struts-bean.tld" prefix="bean" %> <%@ taglib uri="/WEB-INF/tld/struts-html.tld" prefix="html" %> <%@ taglib uri="/WEB-INF/tld/struts-logic.tld" prefix="logic" %> <%@ taglib uri="/WEB-INF/tld/c.tld" prefix="c" %> <mce:script type="text/javascript"><!-- var ${param.title}o ={ jsongl:"", tipsFilter:function (e){ e=window.event||e; if(e.keyCode==40){ $("#${param.title}selectSingle").focus(); } var text=$("#selectText").val(); $("#${param.title}selectSingle").empty(); var options=""; for(var i=0;i<jsongl.length;i++){ if(jsongl[i]["title"].indexOf(text)!=-1){ options+="<option value='"+jsongl[i]["id"]+"'>"+jsongl[i]["title"]+"</option>"; } } $("#${param.title}selectSingle").append(options); } ,showTips:function (){ $("#divDialog").html( "<input id='selectText' type='text' οnkeyup='${param.title}o.tipsFilter(event)'/><br/>"+ "<select id='${param.title}selectSingle' isTop='true' multiple='multiple' size='5' οnclick='${param.title}o.selectSpace(this)' ></select><br/>"+ "<input type='button' value='确定' οnclick='${param.title}o.hideTips()'/>"); $("#divDialog").prompt(); $("#${param.title}selectSingle").html(""); $.post("<c:url value='${param.url}'/>",{}, function(jsons){ var options=""; jsons=eval(jsons); jsongl=jsons; for(var i=0;i<jsons.length;i++){ options+="<option value='"+jsons[i]["id"]+"'>"+jsons[i]["title"]+"</option>"; } $("#${param.title}selectSingle").html(options); if(document.getElementById("${param.value}").value.length>0) setTimeout(function(){$("#${param.title}selectSingle").val(document.getElementById("${param.value}").value)},100); }); } ,hideTips:function (){ try{ var index=$("#${param.title}selectSingle").attr("selectedIndex"); var options=$("#${param.title}selectSingle")[0].options; $("#${param.title}").val($("#selectText").val()); document.getElementById("${param.value}").value=options[index].value; }catch(e){ } $("#divDialog").close(); $("#${param.title}").focus(); } ,selectSpace:function (obj){ try{ var index=$("#${param.title}selectSingle").attr("selectedIndex"); var options=$("#${param.title}selectSingle")[0].options; $("#selectText").val($(options[index]).text()); document.getElementById("${param.value}").value=options[index].value; }catch(e){ } } } // --></mce:script> <input id = "${param.title}" οnclick="${param.title}o.showTips()" /> <html:hidden styleId = "${param.value}" property="${param.value}" />
