$(document).ready(function(){ getJsonServicecontent(); }); function getJsonServicecontent(){ $.post ( '<%=basePath%>/itemgrade/servicestandardAction!queryJsonServicecontent.action?s='+new Date(), { servicelevelid: function(){return $("#servicelevelid").val();} }, function(data) //回调函数 { $("#servicecontentid").empty(); $("#servicecontentid").append($("<option/>").text("请选择").attr("value","")); $(data).each(function () { var nametemp=this.name; if(nametemp.length>4){ nametemp=nametemp.substring(0,4)+"..."; } $("#servicecontentid").append($("<option title="+this.name+" />").text(nametemp).attr("value",this.id)); $("#servicecontentid").val('${servicecontentid}'); }); }, "json" //返回类型 ); }
<div class="lbsz_content_022" > <div class="bddh_content_01" style="padding-left:0px; font-size: 14px;">项目考评管理 < <strong><span style="color:#fa7917;">服务标准管理</span></strong></div> <div class="tj_content_211"> <table width="744" border="0" cellspacing="0" cellpadding="0" height="50" align="left"> <tr> <td width="123" style="color:#333" > 服务标准名称</td> <td width="168"> <input name="queryname" value="${queryname}" type="text" class="chaxun_shurukuang" id="queryname" /> </td> <td width="78"> 服务等级 </td> <td width="103"> <select id="servicelevelid" name="servicelevelid" onchange="getJsonServicecontent()"> <option value="">请选择</option> <c:forEach items="${cachemap.servicelevel}" var="servicelevel"> <option value="${servicelevel.key}" <c:if test='${servicelevel.key==servicelevelid}'>selected="selected"</c:if>>${servicelevel.value}</option> </c:forEach> </select> </td> <td width="78"> 服务内容 </td> <td width="103"> <select id="servicecontentid" name="servicecontentid" style="width: 90px;"> </select> </td> <td width="73"><a href="javascript:void(0)" onclick="queryfun();"><img src="<%=basePath%>images/ny_chaxun.jpg" width="65" height="28" /></a> </td> <td width="19"></td> <td width="180" style="color:#333"> </td> </tr> </table> </div>
/** * 根据服务等级查询服务内容 * @return */ public String queryJsonServicecontent(){ HttpServletRequest request = ServletActionContext.getRequest(); HttpServletResponse response = ServletActionContext.getResponse(); response.setCharacterEncoding("utf-8"); String servicelevelid=null; if(request.getParameter("servicelevelid")!=null&&!request.getParameter("servicelevelid").equals("")){ servicelevelid=request.getParameter("servicelevelid"); } String jsonRoad=itemgradeService.queryJsonServicecontent(servicelevelid); try { PrintWriter out = response.getWriter(); out.print(jsonRoad); out.flush(); out.close(); } catch (IOException e) { e.printStackTrace(); } return null; }
public String queryJsonServicecontent(String servicelevelid) { JSONArray jsonArray = new JSONArray(); List<Servicecontent> servicecontentList=itemgradeDAO.queryJsonServicecontent(servicelevelid); for(Servicecontent s:servicecontentList){ JSONObject jsonobject = new JSONObject(); try { jsonobject.put("id",s.getCode()); jsonobject.put("name", s.getName()); jsonArray.put(jsonobject); } catch (JSONException e) { e.printStackTrace(); } } return jsonArray.toString(); }
public List<Servicecontent> queryJsonServicecontent(String servicelevelid){ return getSqlSession().selectList("itemgrade.queryJsonServicecontent",servicelevelid); }
<select id="queryJsonServicecontent" resultType="net.hlj.procomplaints.bean.Servicecontent" parameterType="java.lang.String" > select * from TBDIC_SERVICECONTENT where servicelevelid=#{servicelevelid,jdbcType=VARCHAR} </select>
相关推荐
### jQuery + Ajax + JSON 级联:深入解析与应用 在现代Web开发中,级联选择器(Cascade Selectors)是一种常见的用户界面设计模式,主要用于处理多层级的数据选择,如国家-省份-城市的选择。本文将深入探讨如何...
在IT行业中,构建高效、动态的Web应用是关键任务之一,而"ajax+jQuery+ssh+oracle级联实例"提供了一个具体的实现方案。这个实例涵盖了前端到后端的关键技术,包括异步数据交互(Ajax)、JavaScript库(jQuery)、...
当用户在前端选择省份时,jQuery会发送一个Ajax请求到后台,获取对应省份的城市数据。 JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,易于人阅读和编写,同时也易于机器解析和生成。在本例中,...
下面是做的一个前台用JQUERY,AJAX调用后台方法做的无刷新级联菜单 CasMenu.aspx页面: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="CasMenu.aspx.cs" Inherits="_Default" %> <!DOCTYPE...
在实现下拉框级联时,JQuery负责监听用户在第一个下拉框中的选择,然后通过Ajax异步请求向Servlet发送数据,获取相应的级联数据,并更新第二个下拉框的选项。 以下是实现步骤: 1. **创建Servlet**:在Servlet中,...
在实际开发中,为了使代码更加模块化和易于维护,可能会使用jQuery或者其他JavaScript库来简化AJAX调用和DOM操作。同时,良好的错误处理机制也必不可少,确保在数据请求失败或者解析错误时,能够给用户友好的提示。 ...
**jQuery和Ajax技术详解** jQuery是一款非常流行的JavaScript库,它极大地简化了JavaScript的DOM操作、事件处理以及Ajax交互。在Web开发中,jQuery是实现动态和交互性网页的关键工具。Ajax(Asynchronous ...
最后,在前端,利用JavaScript(可能配合jQuery库)编写Ajax请求,动态更新城市下拉框的内容。 总结起来,"Ajax+SSH实现省份城市级联查询"是一个综合运用了多种技术的Web应用示例。Ajax提供异步交互,Spring负责...
虽然Ajax主要关注后台数据的交互,但为了提高用户体验,前端界面的样式和动画也很重要。可以使用CSS来美化级联菜单,或者利用jQuery库简化DOM操作和添加动态效果。 8. **跨域问题**: 如果Ajax请求的URL不在当前...
在"ajax_struts_jquery_json级联菜单"的场景中,我们将看到如何利用这四种技术协同工作来创建这样的功能。 首先,Struts框架在后台处理业务逻辑。当用户在前端选择了一个父级菜单项后,Struts Action会接收到这个...
多级级联下拉列表的工作原理是:当用户在一个下拉列表中做出选择时,该选择会触发一个事件,这个事件会发送一个Ajax请求到服务器,服务器根据请求参数返回相应的下一级选项,然后jQuery将这些新数据填充到下一个下拉...
1. **异步通信**:Ajax的核心是JavaScript的XMLHttpRequest对象,它可以在后台与服务器进行数据交换,而不会影响用户对页面的交互。 2. **局部刷新**:通过Ajax,我们可以只更新页面的一部分,而不是整个页面,提高...
在实现无刷新级联的过程中,jQuery的主要作用是监听用户的交互,动态更新DOM元素(如下拉列表),并使用Ajax进行后台数据的异步请求。 1. **基础步骤**: - 创建HTML结构:为省市区分别创建`<select>`元素,通常...
在本示例中,"Ajax级联下拉列表.rar"是一个关于如何使用Java技术和Ajax实现级联下拉列表的小功能的压缩包。 级联下拉列表是一种常见的前端交互设计,用户在一个下拉列表中做出选择后,第二个或更多的下拉列表会根据...
3. **Ajax请求**:级联联动通常需要后台数据支持。当省份变化时,我们需要通过Ajax向服务器发送请求,获取对应省份的城市列表。jQuery的`.ajax()`或者简化的`.get()`、`.post()`方法可以实现这个功能。例如: ```...
- 异步处理:确保AJAX请求在后台执行,不会阻塞页面的正常渲染。 - 错误处理:设置适当的错误处理机制,处理如网络中断、服务器错误等情况。 - 跨域问题:如果AJAX请求涉及到跨域,需要配置PHP或服务器允许CORS(跨...
在IT行业中,级联菜单(Cascading Menu)是一种常见的用户界面元素,它允许用户通过多级选择来筛选或导航到特定的信息。在本案例中,我们关注的是如何使用Java和Ajax技术来实现一个二级联动的菜单。Ajax,即...
jQuery城市级联插件的核心是利用jQuery的事件监听和Ajax异步请求。它通过监听用户在省市区选择框中的操作,触发Ajax请求,从服务器获取并填充下一级别的数据。这一过程主要分为以下几个步骤: 1. 初始化:在页面...