您的位置:首页 > Web前端 > JavaScript

实现基于json的级联菜单

2008-01-03 10:11 423 查看
 对于ajax应用来说,把和控件榜定的数据用json来承载,既可以避免频繁调用httprequest,也可以避免xml带来的性能解释。
假设我们要有一个级联菜单,显示用户组以及下面的用户,我们可以这样做
      $group_user = Array();   
      $groups = $db->getAll("select * from $dbutils->group");

      for ($i = 0, $count = count($groups); $i < $count; $i++) {
     
         $users = $db->getAll("select * from $dbutils->user_group ug,$dbutils->user u where ug.user_id = u.user_id and ug.group_id = ".$groups[$i]['group_id']);
         $group_user[$groups[$i]['group_id']]['users'] = $users;
      }

      $json = new JSON(JSON_LOOSE_TYPE);
      $group_user_json_data = $json->encode($group_user);  //将数据从php数组转换成javascript数组
     
     
      $group_user_javascript_data = '' . "/n"
   . '' . "/n"
   . '';
 
在模板表单里面
 echo $group_user_javascript_data;    //把json的数据显示出来
 
?>

 
function addOptions(optionList, optionMenu)
{
 removeOptions(optionMenu);  // clear out the options
 for (var i=0; i < optionList.length; i++) {
  
   optionMenu[i] = new Option(optionList[i].truename, optionList[i].user_id);

  }

}
 
function removeOptions(optionMenu)
{
  len = optionMenu.options.length;
  for (var i=len-1; i >=0 ; i--) {
  
    optionMenu.options[i] = null;

  }
}
 
function change_group() {

  var users = group_user_json_data[document.getElementById('receive_group').value]['users'];//从json里面得到对象

  addOptions(users, document.getElementById('receive_user'))

 
  
}

 
                                                                          接收部门                                                                            
                                                                          接收人                                                                                

Trackback: http://tb.blog.csdn.net/TrackBack.aspx?PostId=1252065
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: