前端:
1一个下拉html:此处省略
2下面是ajax
//动态选择产品:根据产品类型动态编辑产品 function changepType() { $.ajax({ async : false,url : "${ctx}/res/factoryAssembly/ajax2",type : "post",data : { pType : $("#pType").val() },dataType : "json",success : function(data) { $("#tbody").empty(); //清空上一次下拉的数据 jQuery.each(data,function(i,item){ //循环这个集合 alert(item.goodsName+","+item.num); var n = $('#tbody').append('<tr>' + '<td readonly="false"><input id="goodsName" value="'+item.goodsName +'">'+'<td></td>'+ '<td readonly="false"><input id="num" value="'+item.num+'">'+'</td></tr>'); }); } }); }
3后台:
@RequiresPermissions("res:factoryAssembly:view") @ResponseBody @RequestMapping(value = "ajax2") public String ajax2(String pType,HttpServletRequest request,HttpServletResponse response,Model model) throws Exception { List<Product> products = productService.selectByPtype(pType); return JsonMapper.getInstance().toJson(products);//把数据返回给success函数 }下拉选择数据发送给后台 -通过ajax-> 后台 -查询返回--> ajax --拼接html---> 数据展示成功
原文地址:https://www.jb51.cc/ajax/160428.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。