即时数据模块设计 版本V5

版本V5

实现基准：真正完成ajax加载模板，根据名单列表生成相应数据文本框。

做到这步，发觉数据表需要修改了：

<a href="http://jooben.blog.51cto.com/attachment/201005/19/253727_1274230862lsJH.png"></a>

只保留一张表，增加scoreInfo字段，存json格式的比分数据，其他两张表作废。

上一个版本中，定义了：

var json={"t_1_name":"美国男子篮球队","t_2_name":"立陶宛男子篮球队"};

这里就是名单，数据表中的scoreInfo为空，则从“名单列表”中获取参加该比赛的名单，然后封装成json格式的数据：

服务器上的做法：

//list存放了名单List&lt;Athlete&gt;

Map&lt;String,String&gt; jsonMap

= new LinkedHashMap&lt;String,String&gt;(list.size());

 for(int i=0,j=list.size();i&amp;lt;j;i++){           

int id = i+1;          

jsonMap.put("t_"+id+"_name", list.get(i).getTeamName());

 }

 JSONObject json = JSONObject.fromObject(jsonMap);

      request.setAttribute("json",json);

如果数据表中scoreInfo不为空，则获取到：

json

= {"t_1_section_2":"5","t_1_section_1":"30","t_2_totalScore":"80","t_2_section_4":"5","t_2_section_2":"10","t_2_section_3":"5","t_1_totalScore":"65","t_1_section_4":"5","t_1_section_3":"5","t_1_name":

"美国男子篮球队","t_2_section_1":"40","t_2_overtime_1":"10","t_1_overtime_2":"10","t_2_name":"立陶宛男子篮球队","t_2_overtime_2":"10","t_1_overtime_1":"10"};

所以是否存在这个数据，关键修改之后有没有提交。

ok，该有的，都有了，着手代码实现：

/**

  * 根据模板id获取模板内容

  * 然后重新拼装table

  * date  :2010-4-15

  */

function getModelCode(modelId){

  if(rsc!="" &amp;&amp; modelId!=""){

      jQuery.post("/admin/match_getModelCode.action", {Action:"get","rsc":rsc,"modelId":modelId},   

             function (data, textStatus){

    //data就是返回的模板内容

        //开始注入

                      //需要重新拼装table 这里省略代码.....

        //结束注入

       }); 

    }else{

   alert("数据不完整");

   }

后台模板效果图：

<a href="http://jooben.blog.51cto.com/attachment/201005/19/253727_1274230863XgHE.png"></a>

测试之后还是有小问题，就是在重新拼装table的时候，因为设置了全局的：

var table_basic_html = "";

var table_head_html = "";

需要清空先，不然就会一直追加内容，产生多个table，如图所示：

<a href="http://jooben.blog.51cto.com/attachment/201005/19/253727_127423086422TR.png"></a>

这些都是细节调整问题了，不能一步到位处理好，调试还是需要点时间，用心调试的。

ok，到此，版本V5算是比较成功了。

本文转自jooben 51CTO博客，原文链接:http://blog.51cto.com/jooben/317694