使用ajax 来画页面
画出分页的页面
自己刚刚到公司实习，公司的框架要求 ，在前辈后面进行学习一点心得 ，希望高手指点
步骤:
1. 准备json-rpc的JSONRPCBridge对象
<jsp:useBean id="JSONRPCBridge" scope="session"
class="com.metaparadigm.jsonrpc.JSONRPCBridge" />
2.准备好自己后台的javabean类，可以在js中调用javabean中的方法来操作数据库
3.如果需要call json-rpc，注册你的javabean 到jsonbridge
JSONRPCBridge.registerObject("bean",businessBean);
JSONRPCBridge.setDebug(true);
4. 加入一些全局的jsp页面，导入类以及校验的js
5.写入静态文字，和一些错误提示信息。具体的在content.properties 与error.properties 中进行写入。
6.分为两种页面：
6.1 分页的查询列表页面：
（1）定义一个空的列表和空的列表头：
var mainlist={
h:[ {a:'width=\"40\"},',v:'<%=MsgMgr.getContent(language,"CMAP3300.NO")%>'}
,'<%=MsgMgr.getContent(language,"CCPM1900.REFERENCE_NO")%>'
],
rs:{
a:'align=center',
v:null或者[]
}
};
（2）定义一个列表对象
Var listTableObj=new js.ListTable(windows,’mainlist’,mainlist);
(3)定义一个动态画页面的listpage
Var listpage=new js.ListPageBox(window,’mainlist’,
function search(pageNo) {
3.1 //显示“正在载入”
F('shsm','<%=MsgMgr.getContentQuote(language,"message.loading")%> <img src="<%=request.getContextPath()%>/newUI/images/process_animation.gif">');
3.2//调用javabean方法从数据库中进行查找记录
jsonrpc.bean.listTrxCde(doneSeach,"<%=language%>",null,pageNo);
return null;
}，
3.3注意：其中doneSeach 是回调方法 ，将查找出来的记录动态的画在页面上。
function drawFun(ListPageForm){
var pageNum=listPageForm.page.currPageNo;
var list=listPageForm.page.DBlist.list;
var recordNo=(pageNum-1)*listPageForm.page.recordPerPage+1;
var row1;
mainlist.rs.v=[];
for(var i=0;i<list.length;i++){
row1=list[i].db;
mainlist.rs.v.push(
[
{a:'id="buttonTD'+i+'" ',v:'<input type=radio name="redioValue" value="'+row1.BK_BANK_ID+'">'
+'<img style="cursor:pointer" onclick=\"javascript:toUpdate('+i+')\" '
+'src="<%=request.getContextPath()%>/newUI/images/editicon.gif">'
},
recordNo+i,
{a:'id="inputTD1_'+i+'" ',v:row1.BK_BANK_ID},
{a:'id="inputTD2_'+i+'" ',v:row1.BK_SHORT_NAME},
{a:'id="inputTD2_'+i+'" ',v:type[row1.BK_BANK_TYPE]},
{a:'id="inputTD5_'+i+'" ',v:row1.BK_STATUS},
{a:'id="inputTD6_'+i+'" ',v:row1.BK_OUTSTD_BAL}
]
);
}
listTableObj.setJson(mainlist);
return listTableObj.html();
}
， <%=language%>
）；
function doneSeach(result,e)
{
F("hdsm");
if(e!=null){
F("catchException",e);
return;
}
listPage.drawUpdate(result);
}
}
（4）画页面
document.write('<div id="tableLayerDIV">');
w(listPage.html(<%=CodeUtil.marshallJSON(trxCdeMgr.listTrxCde //展现列表 (language,null,pageNo,"trxcdemain"))%>));
document.write('</div>');