`
heaven_jin
  • 浏览: 4002 次
  • 性别: Icon_minigender_1
社区版块
存档分类
最新评论

easyui crud demo1

阅读更多
// 测试环境
/*$(function(){
   alert($===jQuery);
$.messager.alert('提示','内容')
});*/

$(function(){
  $("#mydatagrid").datagrid({
     title:'用户列表',
  width:500,
  height:'auto',
  idField:'id',
  fitColumns:true,
    loadMsg:'正在加载数据,请稍等........',
    pagination:true,
    pageSize:10,
    pageList:[5,10,15,20],
    pageNumber:2,
    striped:true,
    nowrap:true,
    url:'../../userServlet?method=pageList&time='+new Date().getTime(),
    columns:[[ 
    {field:'id',title:'编号',width:100,hidden:true},
    {field:'name',title:'名字',width:100},
        {field:'sex',title:'性别',width:100},   
        {field:'birthdayStr',title:'出生日期',width:100},   
        {field:'hobby',title:'爱好',width:100,align:'center'}   
    ]],   
  toolbar:[
  {text:'新增',iconCls:'icon-add',handler:function(){newUser();}},
  {text:'编辑',iconCls:'icon-edit',handler:function(){editUser();}},
  {text:'移除',iconCls:'icon-remove',handler:function(){removeUser();}}
  ]
  });
});

function newUser(){
  $('#myform').form('clear');
  $('#mydialog').dialog('open').dialog('setTitle','新增用户');
}

function saveUser(){
   $("#myform").form('submit',{
    url:'../../userServlet?method=edit',  
   onSubmit:function(){
     return $(this).form('validate');
   },
   success:function(result){
     $("#mydialog").dialog('close');
     $("#mydatagrid").datagrid('unselectAll');
     $('#mydatagrid').datagrid('reload');
     $.messager.show({
       title:'系统提示',
        msg:result,
        timeout:3000,
        showType:'slide'
     });
   }
   });
}


function editUser(){
   var model=$("#mydatagrid").datagrid('getSelected');
   if(model){
    $.ajax({
     type:'post',
     url:'../../userServlet?method=get',
     data:{id:model.id},
     dataType:'json',
      success:function(user){
        $("#mydialog").dialog('open')
        $('#myform').form('load',user);
      }
    });
   }
}

function removeUser(){
  var model=$("#mydatagrid").datagrid('getSelected');
  if(model){
  $.messager.confirm('系统提示','您确定要删除数据吗?',function(r){
     if(r){
      $.post('../../userServlet?method=delete',{id:model.id},function(result){
      $("#mydatagrid").datagrid('unselectAll');
      $("#mydatagrid").datagrid('reload');
      $.messager.show({
       title:'系统提示',
       msg:result,
      timeout:3000,
      showType:'slide'
      });
      });
     }
  })
  }else{
   $.messager.show({
     title:'系统提示',
     msg:'请先选择要删除的数据',
     timeout:3000,
     showType:'slide'
   });
  }
}

分享到:
评论

相关推荐

    easyui-crud-demo

    "easyui-crud-demo" 是一个使用 jQuery EasyUI 实现的CRUD(创建、读取、更新、删除)操作的示例项目。这个项目涵盖了从数据获取、展示到用户交互的核心功能,下面我们将详细解析其关键知识点。 1. **jQuery EasyUI...

    easyui简易demo

    1. **组件使用**:EasyUI 提供了如 `datagrid`(数据网格)、`form`(表单)、`dialog`(对话框)、`menu`(菜单)等多种组件,这些组件的使用方法会在示例中得以展示,帮助我们理解如何在 HTML 结构中引入并配置...

    mvc4.0+easyui-CRUD

    这个**Demo**展示了如何在MVC4.0项目中集成EasyUI,实现基本的CRUD功能。开发者可能通过以下步骤实现: 1. **创建控制器**:创建对应的控制器类,比如`StudentController`,每个操作(CRUD)对应一个方法。 2. **...

    easyui1.7 官网示例大全

    easyui\easyui-crud-demo.zip easyui\easyui-datagrid10-demo.zip easyui\easyui-datagrid11-demo.zip easyui\easyui-datagrid12-demo.zip easyui\easyui-datagrid13-demo.zip easyui\easyui-datagrid14-demo.zip ...

    crud-demo_easyui增删查改_zip_

    【标题】"crud-demo_easyui增删查改_zip_" 指的是一个使用EasyUI框架实现的CRUD(Create, Read, Update, Delete)操作演示项目,被压缩为ZIP格式的文件。CRUD是数据库操作的基本功能,代表创建、读取、更新和删除...

    easyui-crud-demo.zip

    在 "easyui-crud-demo.zip" 这个压缩包中,我们可以看到一个使用 EasyUI 和 PHP 实现的简单 CRUD(创建、读取、更新、删除)操作示例。这个示例非常实用,尤其对于初学者来说,是理解如何结合前端与后端进行数据交互...

    SSH和easyui整合Demo

    SSH和EasyUI整合是Web开发中的一个重要实践,它将Struts2、Spring和Hibernate这三大流行框架与...通过深入研究和实践这个Demo,开发者可以提升自己在SSH和EasyUI整合方面的技能,从而更好地应对复杂的Web应用开发挑战。

    EasyUI使用的demo

    1. **整体布局**:EasyUI提供了多种布局模式,如`grid`、`panel`、`tabs`、`accordion`等,可以帮助开发者快速构建页面结构。在这个demo中,可能展示了如何使用这些布局元素来创建一个有层次、清晰的用户界面。例如...

    spring mvc+ibatis+mysql+easyui简单demo

    Spring JDBC或iBATIS可以与MySQL进行交互,提供数据的CRUD操作。 【EasyUI】 EasyUI是基于jQuery的前端UI框架,主要用于快速构建美观的管理界面。它提供了一系列预先设计好的组件,如表格、表单、对话框、菜单、树...

    mvc easyui 项目 demo 增删改查

    标题“mvc easyui 项目 demo 增删改查”表明这是一个基于MVC(Model-View-Controller)框架和EasyUI库的Web应用示例,主要功能集中在基本的数据操作:增加、删除、修改和查询。这个项目可能是为了帮助初学者理解如何...

    SpringMVC+Spring Data JPA+Shiro+EasyUI 简单demo

    "SpringMVC+Spring Data JPA+Shiro+EasyUI 简单demo"是一个整合了上述四个技术的Web应用示例。这个项目可能包含了以下组件: 1. **配置文件**:如`applicationContext.xml`用于配置SpringMVC和Spring Data JPA,...

    easyuidemo:easyui的demo,包括CRUD操作、级联、datagrid、echarts等。使用oracle、jdbc、servlet

    1. **CRUD操作**:CRUD是数据库操作的基础,EasyUI通过与后端服务(如servlet)配合,实现了对数据的增删改查。例如,用户可以通过EasyUI的表单组件填写信息,提交到服务器执行SQL语句,完成数据的添加;通过...

    easyui+三层+json增删改查DEMO

    【标题】"easyui+三层+json增删改查DEMO"是一个基于EasyUI前端框架,结合三层架构和JSON数据格式实现的Web应用程序示例,主要用于演示如何在实际项目中进行CRUD(创建、读取、更新、删除)操作。这个DEMO涵盖了...

    java后台+easyui框架实现的所有demo

    1. **数据展示**:EasyUI的Grid组件可以与Java后端的RESTful API进行交互,实现动态加载数据。通过Ajax请求,后台Java程序处理数据库查询,返回JSON格式的数据,前端则使用这些数据填充Grid。 2. **表单操作**:...

    Maven+springmvc+mybatis+easyui+mysql DEMO

    在DEMO中,MyBatis用于数据库操作,通过XML或注解定义SQL语句,与SpringMVC配合实现数据的CRUD操作。 4. EasyUI: EasyUI是一个基于jQuery的UI组件库,主要用于构建桌面级的Web应用界面。它提供了一系列的UI组件,...

    基于SSH + jquery easyui 的一个通讯录Demo

    在通讯录Demo中,Hibernate用于将Contact对象映射到数据库表,实现了数据库的CRUD(Create、Read、Update、Delete)操作。通过编写简单的HQL(Hibernate Query Language)或使用Criteria API,我们可以方便地执行...

    .NET_MVC_CORE_EasyUI_login_ADD_EDIT_DELETE.demo.rar

    标题中的".NET_MVC_CORE_EasyUI_login_ADD_EDIT_DELETE.demo.rar"表明这是一个使用.NET MVC Core框架结合EasyUI库实现登录功能以及数据的添加、编辑和删除操作的演示项目压缩包。这个实例通常是为了帮助开发者理解...

    基于jquery-easyui的用户管理系统实例

    数据的`增删查改`(CRUD操作)是任何管理系统的核心功能。在EasyUI中,可以使用`datagrid`组件展示数据,它具有分页、排序、过滤等功能,同时支持行级别的操作按钮,如新增、编辑、删除。这些操作通常会触发AJAX请求...

    springboot+mybatis+easyui增删改查分页Demo

    【标题】"springboot+mybatis+easyui增删改查分页Demo"是一个基于Spring Boot、MyBatis和EasyUI实现的Web应用程序示例,主要用于演示如何在这些技术栈中进行基本的数据操作,如添加(Add)、删除(Delete)、修改...

Global site tag (gtag.js) - Google Analytics