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

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

阅读量：2340 次

发布时间：2019-05-10

本文共 1959 字，大约阅读时间需要 6 分钟。

在fleaphp论坛有相关的讨论： =，但是帖子里面说得不完整。

于是自己动手做了尝试

修改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'}} 