0 0

jquery easy ui 查询问题5

后台java:
//接受参数page和rows
		String  page =request.getParameter("page");//每页显示的记录数
		String  rows = request.getParameter("rows");//当前第几页
		String stu_id = request.getParameter("stu_id");
		String stu_name = request.getParameter("stu_name");
		System.out.println(stu_id);
		System.out.println(stu_name);
		//当前页  
		int intPage = Integer.parseInt((page == null || page == "0") ? "1":page);
		//每页显示条数  
        int number = Integer.parseInt((rows == null || rows == "0") ? "10":rows); 
      //每页的开始记录  第一页为1  第二页为number +1   
        int start = (intPage-1)*number;  
        
        PrintWriter out = response.getWriter(); 
		StudentDAO sd = new StudentDAOImpl();
		//得到总共有多少条数据
		int totalCount = sd.getCount(stu_id,stu_name);
		ArrayList<Student> students= sd.getStudents(start,number,stu_id,stu_name);

		Map<String, Object> jsonMap = new HashMap<String, Object>();//定义map
		jsonMap.put("total",totalCount);//total键 存放总记录数,必须的  
        jsonMap.put("rows", students);//rows键 存放每页记录 list  
        JSONObject result = JSONObject.fromObject(jsonMap);//格式化result   一定要是JSONObject
        
        System.out.println(result);
        
		out.print(result.toString());
		out.flush();
		out.close();


js:
    	<script type="text/javascript">
	$(function(){
		  $('#dg').datagrid('getPager').pagination({
			    displayMsg:'当前显示从{from}到{to},共{total}记录',
			    onBeforeRefresh:function(pageNumber, pageSize){
			     $(this).pagination('loading');
			     $(this).pagination('loaded');
			    }
			   });
	});
	
	</script>
 </head>
	<body>

	<table id="dg" title="My Users" class="easyui-datagrid" style="width:700px;height:400px"  
            url="test"  pagination="true" 
            toolbar="#toolbar"  
            rownumbers="true" fitColumns="true" singleSelect="true">  
        <thead>  
            <tr>  
                <th field="id" width="50">id</th>
                <th field="stu_id" width="50">stu_id</th>  
                <th field="stu_name" width="50">stu_name</th>  
                <th field="stu_password" width="50">stu_password</th>  
                <th field="stu_yuanxi" width="50">stu_yuanxi</th>  
                <th field="stu_phone" width="50">stu_phone</th>  
                <th field="stu_qq" width="50">stu_qq</th>  
                <th field="stu_sex" width="50">stu_sex</th> 
                <th field="stu_age" width="50">stu_age</th> 
            </tr>  
        </thead>  
    </table>  
 <div id="toolbar"> 
    <div>
      <span>stu_id:</span>  
	  <input id="stu_id" style="line-height:26px;border:1px solid #ccc">  
	  <span>stu_name:</span>  
	  <input id="stu_name" style="line-height:26px;border:1px solid #ccc">  
	  <a href="#" class="easyui-linkbutton" plain="true" onclick="doSearch()">Search</a>  
  </div> 
  <div> 
	        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="newUser()">New User</a>  
	        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="editUser()">Edit User</a>  
	        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="destroyUser()">Remove User</a>  
   </div>
 </div>  
      
    <div id="dlg" class="easyui-dialog" style="width:400px;height:280px;padding:10px 20px"  
            closed="true" buttons="#dlg-buttons">  
        <div class="ftitle">User Information</div>  
        <form id="fm" method="post" novalidate>  

            <div class="fitem">  
                <label>stu_id:</label>  
                <input name="stu_id" class="easyui-validatebox" required="true">  
            </div>  
            <div class="fitem">  
                <label>stu_name:</label>  
                <input name="stu_name" class="easyui-validatebox" required="true">  
            </div>  
            <div class="fitem">  
                <label>stu_password:</label>  
                <input name="stu_password">  
            </div>  
            <div class="fitem">  
                <label>stu_yuanxi:</label>  
                <!-- validType="email" -->
                <input name="stu_yuanxi" class="easyui-validatebox" >  
            </div>  
              <div class="fitem">  
                <label>stu_phone:</label>  
                <input name="stu_phone" class="easyui-validatebox" required="true">  
            </div>  
              <div class="fitem">  
                <label>stu_qq:</label>  
                <input name="stu_qq" class="easyui-validatebox" required="true">  
            </div>  
             <div class="fitem">  
                <label>stu_sex:</label>  
                <input name="stu_sex" class="easyui-validatebox" required="true">  
            </div>  
              <div class="fitem">  
                <label>stu_age:</label>  
                <input name="stu_age" class="easyui-validatebox" required="true">  
            </div>  
              
        </form>  
    </div>  
    <div id="dlg-buttons">  
        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-ok" onclick="saveUser()">Save</a>  
        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-cancel" onclick="javascript:$('#dlg').dialog('close')">Cancel</a>  
    </div>  
    <script type="text/javascript">  
        var url;  
        function newUser(){  
            $('#dlg').dialog('open').dialog('setTitle','New User');  
            $('#fm').form('clear');  
            url = 'add';  
        }  
        function editUser(){  
            var row = $('#dg').datagrid('getSelected');  
            if (row){  
                $('#dlg').dialog('open').dialog('setTitle','Edit User');  
                $('#fm').form('load',row);  
                url = 'edit?id='+row.id;  
            }  
        }  
		function saveUser(){
			$('#fm').form('submit',{
				url: url,
				onSubmit: function(){
					return $(this).form('validate');
				},
				success: function(result){
					var result = eval('('+result+')');
					if (result.success){
						$('#dlg').dialog('close');		// close the dialog
						$('#dg').datagrid('reload');	// reload the user data
					} else {
						$.messager.show({
							title: 'Error',
							msg: result.msg
						});
					}
				}
			});
		}
        function destroyUser(){  
        	var row = $('#dg').datagrid('getSelected');
			if (row){
				$.messager.confirm('Confirm','Are you sure you want to remove this user?',function(r){
					if (r){
						$.post('destroy',{id:row.id},function(result){
							if (result.success){
								$('#dg').datagrid('reload');	// reload the user data
							} else {
								$.messager.show({	// show error message
									title: 'Error',
									msg: result.msg
								});
							}
						},'json');
					}
				});
			}
        } 
		function doSearch(){
			$('#dg').datagrid('load',{
				stu_id: $('#stu_id').val(),
				stu_name: $('#stu_name').val(),
			});
		}
    </script> 


前台怎么传值过去,就是说 function doSearch(){
$('#dg').datagrid('load',{
stu_id: $('#stu_id').val(),
stu_name: $('#stu_name').val(),
});
}

这块怎么写url,怎么把值传到后台
2013年3月25日 11:49

3个答案 按时间排序 按投票排序

0 0

采纳的答案

你完全可以使用同一个url查询的,只是第一次传过去的参数为0,查询时传过去的参数不为0而已。然后在service层拼接sql调用dao层就可以了,不知道我说的你能否明白

2013年3月26日 09:08
0 0

   $('#list').datagrid('options').url = '../../Ashx/News/News_Comment.ashx?func=GetList';
        $('#list').datagrid("reload");

2013年3月25日 18:19
0 0

定义 datagrid 时设置了URL,在调用 load 方法不需要传URL,你最后写的doSearch方法中的调用就是正确的参数传递方法。

2013年3月25日 12:38

相关推荐

    jquery easy ui 离线API文档

    《jQuery Easy UI 离线API文档详解及CSS设计技巧》 jQuery Easy UI 是一个基于jQuery的前端开发框架,它提供了丰富的UI组件,使得开发者能够快速构建出美观且功能强大的Web应用。离线API文档是开发者在无网络环境下...

    jquery easy ui模板

    **jQuery Easy UI 模板详解** jQuery Easy UI 是一个基于 jQuery 的前端开发框架,它提供了一系列的组件和样式,使得开发者能够快速构建出美观且功能丰富的 Web 应用程序。这个压缩包包含的 "jQuery Easy UI 学习...

    jquery easy-ui

    jQuery EasyUI就是在jQuery的基础上,提供了一系列易于使用的UI组件。 2. **EasyUI组件**: - **树形控件(Tree)**: 用于展示层次结构的数据,如目录结构,组织架构等。通过简单的配置,可以实现节点的展开、折叠...

    jQuery UI以及jQuery easy-ui技术手册

    jQuery Easy-UI 是基于jQuery和jQuery UI的一个轻量级框架,它简化了jQuery UI的使用,提供了一套易于上手的预设样式和组件。Easy-UI的主要目标是让开发者能快速构建出美观且功能丰富的Web应用。 - **组件精简**:...

    jQuery Easy UI基础篇

    《jQuery Easy UI基础篇》是针对初学者及开发者的一份宝贵资源,包含了多个关于jQuery Easy UI基础组件的代码示例。这些示例旨在帮助用户快速理解并掌握如何使用这个强大的前端框架来创建交互式和响应式的网页应用。...

    JQuery Easy UI 增删改查 示例

    **jQuery Easy UI 增删改查 示例** jQuery Easy UI 是一个基于 jQuery 的前端框架,它提供了一系列易于使用的组件,如对话框、表格、表单等,帮助开发者快速构建用户界面。在“JQuery Easy UI 增删改查”这个示例中...

    jquery easy ui使用全解

    ### jQuery Easy UI 使用详解 #### 一、简介与安装配置 jQuery Easy UI 是一个基于 jQuery 的简化用户界面库,提供了一系列预定义的 UI 组件,如按钮、对话框、网格等,大大简化了 Web 应用程序的开发过程。通过...

    jquery easy ui 中文帮助

    **jQuery EasyUI 中文帮助** jQuery EasyUI 是一个基于 jQuery 的前端框架,它提供了一系列的预定义组件,帮助开发者快速构建用户界面。EasyUI 的核心理念是通过简单的 HTML 标签和 CSS 类来实现复杂的 UI 功能,...

    jQuery easy ui + SpringMVC

    本资源是本人将SpringMVC + jQuery easy ui整合的CRUD demo,后台核心是spring注解实现的(通过jsbcTemplate连接数据库),前台有基本的jsp和easy ui 两种展现方式,数据库使用oracle,可以通过更改配置文件和驱动jar...

    jquery easy ui edatagrid 动态编辑表格 例子

    在本文中,我们将深入探讨jQuery Easy UI中的`edatagrid`组件,以及如何实现动态编辑表格,特别是下拉框的联动功能。`edatagrid`是jQuery Easy UI库中的一个强大工具,它扩展了基本的`datagrid`功能,提供了更丰富的...

    jQuery easy ui学习教程

    jQuery EasyUI 是一个基于 jQuery 的强大 UI 库,它为 web 开发者提供了一套完整的用户界面组件,旨在简化创建功能丰富的、美观的前端应用的过程。通过使用 jQuery EasyUI,开发者无需深入研究 JavaScript 和 CSS,...

    Jquery easy ui 中文帮助手册

    **jQuery Easy UI 中文帮助手册** 是一份详细指导开发者如何使用 jQuery Easy UI 框架的文档,旨在帮助用户更好地理解和应用这个强大的前端开发工具。jQuery Easy UI 是基于 jQuery 的一个轻量级、易于使用的组件库...

    jquery api 、 jquery easy ui

    **jQuery API** jQuery 是一个广泛使用的JavaScript库,它极大地简化了HTML文档遍历、事件处理、动画制作和Ajax交互。其API(应用程序编程接口)提供了丰富的功能,使得开发者能够高效地编写JavaScript代码。jQuery...

    jquery easy ui demo

    《jQuery Easy UI 框架深度解析与应用实践》 jQuery Easy UI 是一款基于 jQuery 的前端框架,它为开发者提供了一系列精美的UI组件,如分页、数据网格、树形结构等,极大地简化了Web应用界面的开发工作。在本篇文章...

    jquery easy ui 框架

    《jQuery Easy UI 框架详解与应用实例》 jQuery Easy UI 是一款基于 jQuery 的前端开发框架,它为开发者提供了一系列轻量级、易于使用的组件,帮助快速构建出美观且功能丰富的Web应用程序。这个框架的核心理念是...

    Jquery Easy UI 1.2.6 示例代码

    **jQuery Easy UI 1.2.6 示例代码详解** jQuery Easy UI 是一款基于 jQuery 的前端框架,它提供了丰富的组件和简单易用的API,帮助开发者快速构建用户界面。在版本 1.2.6 中,这个框架包含了多个功能强大的控件,如...

    【JQuery Easy UI】后台管理系统的简单布局

    同时,JQuery Easy UI 的文档详尽,社区活跃,遇到问题时可以查阅官方文档或在线寻求帮助,降低了开发难度,提高了开发效率。 总的来说,JQuery Easy UI 以其简洁的 API 设计和强大的功能,成为构建后台管理系统...

    jquery easy ui 增改删 表格

    **jQuery Easy UI 知识点详解** jQuery Easy UI 是一个基于 jQuery 的前端框架,它提供了一系列的组件,如对话框、表格、下拉菜单等,用于简化网页开发,特别是对于后台管理界面的构建。在“jQuery Easy UI 增改删 ...

    jquery easy ui 上下排序功能

    jQuery Easy UI 是一个基于 jQuery 的前端开发框架,它提供了一系列的UI组件,使得开发者能够快速构建功能丰富的Web应用。在jQuery Easy UI中,上下排序功能是常见的一种数据展示和交互方式,尤其适用于列表或者表格...

Global site tag (gtag.js) - Google Analytics