js创建下拉列表树

最新推荐文章于 2016-12-03 02:19:00 发布

justdoit1024

最新推荐文章于 2016-12-03 02:19:00 发布

阅读量114

点赞数

分类专栏： web前端文章标签： Java jQuery Ajax JSP prototype ViewUI

本文链接：https://blog.csdn.net/shiyong2008/article/details/83529324

版权

web前端专栏收录该内容

26 篇文章 0 订阅

订阅专栏

1、html


<tr>
	<td align="right">
		商品分类：
	</td>
	<td>
		<select name="cat_id" onchange="hideCatDiv()">
			<option value="">
				请选择...
			</option>
			<%=categorySelect%>
		</select>
		<a href="javascript:void(0)" onclick="rapidCatAdd()"
			title="添加分类" class="special">添加分类</a>
		<span id="category_add" style="display: none;"> <input
				class="text" size="10" name="addedCategoryName" /> <a
			href="javascript:void(0)" onclick="addCategory()"
			title=" 确定 " class="special"> 确定 </a> <a
			href="javascript:void(0)" onclick="return goCatPage()"
			title="分类管理" class="special">分类管理</a> <a
			href="javascript:void(0)" onclick="hideCatDiv()" title="隐藏"
			class="special"><<</a> </span>
		<span><font color="red">*</font></span>
	</td>
</tr>

2、js
addCategory:

  function addCategory()
  {
      var parent_id = document.forms['theForm'].elements['cat_id'];
      var cat = document.forms['theForm'].elements['addedCategoryName'];
      if(cat.value.replace(/^\s+|\s+$/g, '') == '')
      {
          alert(category_cat_not_null);
          return;
      }    

      //不能使用$,因为和prototype冲突
      jQuery.ajax({
			   type: "POST",
			   url: "/trade/manager/goods/ajaxAddCategory.jsp",
			   data: "parent_id="+parent_id.value+"&cat_name="+cat.value,
			   success: addCatResponse
			}); 

  }

addCatResponse:

 function addCatResponse(response)
  {

      var category_add_div = document.getElementById("category_add");
      category_add_div.style.display = 'none';

      response = eval('('+response+')');
      var selCat = document.forms['theForm'].elements['cat_id'];
      var opt = document.createElement("OPTION");
      opt.value = response.cat_id;
      opt.selected = true;
      opt.innerHTML = response.cat_name;


      //获取子分类的空格数
      var str = selCat.options[selCat.selectedIndex].text;
      var lengOfSpace = str.length - response.cat_name.length;
      if(response.parent_id != "")
      {
          lengOfSpace += 4;
      }
      for (i = 0; i < lengOfSpace; i++)
      {
          opt.innerHTML = ' ' + opt.innerHTML;
      }

      for (i = 0; i < selCat.length; i++)
      {
          if(selCat.options[i].value == response.parent_id)
          {
              if(i == selCat.length)
              {
                  if (Browser.isIE)
                  {
                      selCat.add(opt);
                  }
                  else
                  {
                      selCat.appendChild(opt);
                  }
              }
              else
              {
                  selCat.insertBefore(opt, selCat.options[i + 1]);
              }
              break;
          }
      }
      return;
  }

3、jsp

<%@ page language="java" import="java.util.*" pageEncoding="GBK"%>
<%@page import="com.trade.category.CategoryInfo"%>

<%

	//获取参数
	String cat_name = "",parent_id="";
	if(null != request.getParameter("cat_name")){
		cat_name = request.getParameter("cat_name");
		cat_name = new String(cat_name.getBytes("iso-8859-1"),"UTF-8");
	}
	if(null != request.getParameter("parent_id")){
		parent_id = request.getParameter("parent_id");
	}

	String user_id = "";
	if(null != session.getAttribute("SESSION_USER_ID")){
		user_id = session.getAttribute("SESSION_USER_ID").toString();
	}

	CategoryInfo cInfo = new CategoryInfo();
	int cat_level = cInfo.getParentIdCatLevel(parent_id)+1;
	String cat_id = cInfo.addCategory(cat_name,cat_level,parent_id,user_id);

	String result = "{cat_id:'"+cat_id+"',cat_name:'"+cat_name+"',parent_id:'"+parent_id+"'}";
	out.write(result);
%>