ajax+jquery+flea+smarty实现了通过选择下拉列表动态显示相应的数据

本文介绍了一个使用FleaPHP框架实现AJAX功能的例子。通过在控制器中定义AJAX方法并结合Smarty模板引擎，实现了根据选择项变化动态加载数据的功能。

在fleaphp论坛有相关的讨论： http://www.fleaphp.org/bbs/viewthread.php?tid=3345&highlight=，但是帖子里面说得不完整。

于是自己动手做了尝试

修改FleaPHP/Example/Smarty/APP/Controller/Default.php

 
     function actionIndex() {
        $ajax =& FLEA::initAjax();
        $ui =& FLEA::initWebControls();
         //读取地区性分类 :注册一个ajax方法，当id为islocalesite的select下拉菜单onchange时间出发后，调用服务器端的'GetLocalCategories'方法，以其值作为参数post. 成功后，调用客户端名为setlocaldpl的js函数
   
$this->_registerEvent('#islocalesite', 'change', 'GetLocalCategories', array(   
'data' => '#islocalesite',   
'success' => 'setlocaldpl',   
));   
        $smarty =& $this->_getView();
        /* @var $smarty Smarty */
        $smarty->assign('my_var', 'The smarty template engine.');
        $smarty->assign('islocalesite', '1');
        $smarty->display('tpl-index.html');
    }
    function actionGetLocalCategories()   
    {   
        $t = time();
        $nodes = array(
            array('name' => '列表项目 1', 'class_id' => date('Y-m-d H:i:s', $t++)),
            array('name' => '列表项目 2', 'class_id' => date('Y-m-d H:i:s', $t++)),
            array('name' => '列表项目 3', 'class_id' => date('Y-m-d H:i:s', $t++)),
            array('name' => '列表项目 4', 'class_id' => date('Y-m-d H:i:s', $t++)),
            array('name' => '列表项目 5', 'class_id' => date('Y-m-d H:i:s', $t++)),
            array('name' => '列表项目 6', 'class_id' => date('Y-m-d H:i:s', $t++)),
        );
      FLEA::loadClass('FLEA_Ajax');   
      echo json_encode($nodes);   
      exit;
    }

FleaPHP/Example/Smarty/templates/tpl-index.html

 
  <script language="JavaScript" type="text/javascript" src="../../FLEA/FLEA/Ajax/jquery.js"></script>
<script type="text/javascript">   
function setlocaldpl(response)   
{   
alert(response)
var list=eval('(' + response + ')');   
$('#class_id').get(0).options.length=null;   
for(var i=0;i<list.length;i++)   
{   
  //alert(list[i].name)   
  $('#class_id').get(0).options.add(new Option(list[i].name,list[i].class_id));
}   
}   
</script>   
{{ dump_ajax_js }}
<select name="islocalesite" id="islocalesite">   
          <option value="0" {{if $islocalesite==0}}selected="selected"{{/if}}>无地域性</option>   
          <option value="1" {{if $islocalesite==1}}selected="selected"{{/if}}>有地域性</option>   
</select>   
{{webcontrol type="dropdownlist" items=$topcategories name='class_id'}} 

 