使用easyui实现的添加公告功能(后台管理)
来源:互联网 发布:海岛奇兵步兵升级数据 编辑:程序博客网 时间:2024/04/28 06:44
easyui用来做后台管理还是很方便的,这两天又添加了几个小功能其中一个是添加公告。可以包括前台的公告。还有后台给管理员看的公告。后端实现的还是很粗糙的。实际项目中,公告具体出现的位置还有时机都应该是固定的。所以可以事先为这些公告定义标示,创建表结构中指定主键唯一标示这些公告。到时候通过主键获取公告。但是由于我现在需求还是不清晰。并不知道需要多少公告。所以添加公告时需要管理员为公告指定主键。等项目完成,添加公告时就不能再让管理员主键了,毕竟他不是程序员。
1.公告显示
当管理员点击菜单栏中的公告管理时,右侧出现上述窗口。上一篇博客已经说明了如何使用datagrid控件从后台取数据,以及优雅的实现分页功能。这里就不多说了。现在要做的就是新增,编辑,删除功能。现在一条条来。先来新建公告吧
2.新建公告。
2.1建立数据库表结构
其中notice就是标示公告的主键,名字,还有程序员通过这个字段查询公告。所以要设为候选键,决不能重复,我这里没设,心里明白就行了,description作为与notice同对出现的。是对notice的解释。指示这个公告的位置,功能的。
title标示公告的标题。content标示公告的内容。time作为时间,简单的一个表。暂时没有需求添加其他字段,(待添加的包括修改人,所需权限《我认为权限最好定义在表结构中,单纯依赖数据库提供的功能,还是不太好》,修改ID(关于修改的信息,到时候可以调出来这个公告的变动情况),其他暂时没想到)
2.2定义dao,service层。
关于这两层我不想多说,都快写吐了,我用的是hibernate,这段时间一直在封装。定义了BaseDao,及增删改查的标准实现。基本上每一个表的dao直接继承此类。其它功能不用填了。上代码吧
public class BaseDao { public SessionFactory sessionFactory; private Session session=null; /** * @param obj * @return */ public void CloseSession() { if(session!=null) { //�ر�session session.close(); } } public BaseDao() { } public BaseDao(SessionFactory sf) { sessionFactory = sf; HibernateUtil.SetSessionFactory(sessionFactory); } public boolean add(Object obj) { Transaction tran=null; boolean result=false; try { Sessionsession= sessionFactory.openSession(); tran=session.beginTransaction(); session.save(obj); tran.commit(); result=true; } catch (Exception e) { if(tran!=null) { //����ع� tran.rollback(); } } finally { if(session!=null) { session.close(); } } return result; } /** * @return ������� * ����Ϊ�ĵ�����id���� */ public boolean update(Object object) { // Session session=null; Transaction tran=null; boolean result=false; try { Sessionsession= sessionFactory.openSession(); tran=session.beginTransaction(); session.update(object); tran.commit(); result=true; } catch (Exception e) { if(tran!=null) { //����ع� tran.rollback(); } } finally { if(session!=null) { //�ر�session session.close(); } } return result; } /** * @param c * @param id ��ѯһ����ݸ�������id�� * @return */ public Object get(Class c,int id) { //Session session=null; Object object=null; try { Sessionsession= sessionFactory.openSession(); object=session.get(c,id); } catch (Exception e) { } finally { if(session!=null) { //�ر�session session.close(); } } return object; } /** * @param obj * @return ɾ����� */ public boolean delete(Object obj) { // Session session=null; Transaction tran=null; boolean result=false; try { Sessionsession= sessionFactory.openSession(); tran=session.beginTransaction(); session.delete(obj); tran.commit(); result=true; } catch (Exception e) { if(tran!=null) { //����ع� tran.rollback(); } } finally { if(session!=null) { //�ر�session session.close(); } } return result; } /** * @param <T> ��ѯ������¼ * @param sql sql��� * @param param �������� * @return */ @SuppressWarnings("unchecked") <span style="color:#ff0000;"> public <T> List<T> query(String sql,Object[] param)</span> { List<T> list=new ArrayList<T>(); //Session session=null; try { Sessionsession= sessionFactory.openSession(); Query query=session.createQuery(sql); if(param!=null) { for(int i= 0;i<param.length;i++) { query.setParameter(i,param[i]); } } list=query.list(); } catch (Exception e) { e.printStackTrace(); } finally { if(session!=null) { session.close(); } } return list; } /**
<span style="font-size:24px; white-space: pre;"></span><span style="font-size:24px;color:#ff0000;"><strong>*这个函数有问题</strong></span><span style="font-size:24px;"> * @param sql * @param param ��ѯ������¼ * @return */ <span style="color:#33cc00;">public Object queryOne(String sql,Object[] param)</span> { Object object=null; // Session session=null; try { Sessionsession= sessionFactory.openSession(); Query query=session.createQuery(sql); if(param!=null) { for(int i=0 ;i<param.length;i++) { query.setParameter(i,param[i]); } object=query.uniqueResult(); } } catch (Exception e) { } finally { if(session!=null) { session.close(); } } return object; } /** * @param <T> * @param sql * @param param * @param page * @param size * @return ʵ�ַ�ҳ��ѯ */ @SuppressWarnings("unchecked") <span style="color:#ff0000;"> public <T> List<T> queryByPage(String sql,String[] param,int page,int size)</span> { List<T> list=new ArrayList<T>(); try { Sessionsession= sessionFactory.openSession(); Query query=session.createQuery(sql); if(param!=null) { for(int i= 0;i<param.length;i++) { query.setString(i,param[i]); } } //ɸѡ���� query.setFirstResult((page-1 )*size); query.setMaxResults(size); list=query.list(); } catch (Exception e) { } finally { if(session!=null) { session.close(); } } return list; } /** * @param hql * @param pras * @return������ݸ��� */ <span style="color:#ff6666;">public int getCount(String hql, String[] pras) {</span> int resu = 0 ; // Session s = null; try { Sessionsession=sessionFactory.openSession(); Query q = session.createQuery(hql); if (pras != null) { for (int i =0 ; i < pras.length; i++) { q.setString(i, pras[i]); } } resu = q.list().size(); } catch (Exception e) { e.printStackTrace(); } finally { if (session != null) { session.close(); } } return resu; }public Session getSession() {return session;}public void setSession(Session session) {this.session = session;} public static void main(String[] args) { /* new BaseDao(HibernateUtil.getSessionFactory()); Category ca = (Category) queryOne("from Category ca where ca.category_id = 3", null); System.out.println(ca.getCategory_remark());*/ }public void setSessionFactory(SessionFactory sessionFactory) {this.sessionFactory = sessionFactory;} }</span>这个类我是从网上down的,已经找不到作者,特此感谢,帮了我很大的忙,也为他头疼不已,因为一开始不会hibernate,就down了它,然后项目中大量使用这个类,包括一个util类这个类是读取xml文件初始化hibernate用的,然后后期添加spring功能时,没少改动,把所有的初始化hibernate的部分全都改了,而且需要用spring对hibernate进行事物管理,还有会话管理。这两个整的我焦头烂额。最近稍稍摸索点头绪,确实承认hibernate为我们提供的对话关系映射很强大。(很方便,以后要买一本hibernate的书,作为支持下,听说现在不行了。)
加红的是主要用到的功能,加绿的错误的函数,其他的增删改函数。基本上继承这个类,dao层不用写代码了。弱dao,强service,把所有的业务代码,查询语句都放到service中。
其中service我定义了一个BaseService抽象模板类,这个很普通,就不贴代码了
2.3控制层action,基本上就是add,update,delete,query,然后分页查询。mvc部分贴一部分代码
public void AddNotice(){noticeService.addNotice(notice, title, content,description);System.out.println("title"+title+"notice:"+notice+"content:"+content);JSONObject jsonObject = JSONUtil.NewJSonObject();msg = "改公告已经保存";jsonObject.put("msg", msg);try {JSONUtil.ResponsePrint(jsonObject);} catch (IOException e) {e.printStackTrace();}}
msg返回给前端。还有json已经在上一篇博客中解释了。
2.5 View层
具体的功能有,用户第一次点击文本框提示文字会消失,这个添加公告内容的工具是ckeditor,功能还是很强大。可以基本实现博客功能,最后会转换为html格式的文本,保存在数据库中,调用时格式不会变,如果是实际项目我觉得还是得考虑下测试的可行性,毕竟公告的位置大小都是不同的。你不能让管理员一遍遍的试吧,这么改,这么改,他们会崩溃的。这是前段美工的事,我就不操心了,说实话我写easyui的博客是因为这工具很强大,很方便,以后外边接活后台部分完全不用美工了,前端工作者了。也是过一段时间有个微网站,需要配套的后台管理的CMS系统的需求。所以在我的小网站中先试试手。
然后一点击保存就通过ajax异步送到控制层,然后保存在数据库,如果成功界面返回到公告列表,否则停在本界面。并说明失败原因,(失败原因我没写,懒得写。我想这也是自己写着玩和接活做实际的企业级项目的区别吧,动力不足,总想练技术!不想研究业务需求)
<div id="cc" class="easyui-layout" style="width:100%;height:100%;"> <div id='north' data-options="region:'north',iconCls:'icon-add',title:'请输入公告标题',split:true" style="width:50%;height:78px;"> <textarea id="title" style="font-size:15pt" rows="1" maxlength="50" title="请输入公告标题,长度最大为50个字符"> </textarea> </div> <div id="east" data-options="region:'east',iconCls:'icon-add',title:'请添加对公告的名字和描述',split:true" style="width:300px;"> <textarea id="notice" style="font-size:15pt" maxlength="50" title="请输入公告名字"> </textarea> <br/><br/><br/> <textarea id="description" style="font-size:15pt" maxlength="100" title="请输入公告描述。最长100字符"> </textarea> <div align="center"> <br/><br/><br/> <input type="image" id="save" src="image/save.gif"></input> </div> </div> <div id="center" data-options="region:'center',title:'请添加公告内容',spilt:true" style="padding:5px;background:#eee;"> <ckfinder:setupCKEditor editor="content" basePath="ckfinder/" /> <%-- <ckeditor:editor basePath="ckeditor/" editor="content"/> --%> <textarea class="ckeditor" style="font-size:15pt" cols="80" id="content" name="content" rows="10"> <s:property value="#session.content"></s:property> </textarea>
前端代码。JS代码和之前的博客不同的不多,这是验证用户第一次点击文本框时,让提示文字消失的代码
var titleval = '请输入标题';var contentval = '请输入内容';var noticeval = '请输入公告的名字,名字用于程序员从后台通过该字段获取公告';var descriptionval = '请输入对公告的描述';$('#title').text(titleval);$('#content').text(contentval);$('#notice').text(noticeval);$('#description').text(descriptionval);$('#description').click(function(){if($('#description').val().replace(/\s+/g,"")==descriptionval){$('#description').text("");}});$('#title').click(function(){if($('#title').val().replace(/\s+/g,"")==titleval){$('#title').text("");}});/*$('#content').click(function(){});*/$('#notice').click(function(e){if($(this).val().replace(/\s+/g,"")==noticeval){$(this).text("");}});function deletetext(){if($('#content').val().replace(/\s+/g,"")==contentval){CKEDITOR.instances.content.setData('');}} CKEDITOR.instances["content"].on("instanceReady", function () { //set keyup event /* this.document.on("keyup", deletetext); */ //and click event this.document.on("click", deletetext); //and select event /* this.document.on("select", deletetext); */ });这就是添加公告这块
3.更新公告
这里稍稍复杂些。编辑和新加公告在前段上区别不大,我们需要做的就是当用户点击编辑按钮时,获取相应的公告ID,将它传回后台,然后后台将程序转移到编辑公告界面,同时在session中添加公告的相应信息,在前段获取,在合适位置显示。同时sava按钮的请求应变为更新请求。传到UpdateNoticeAction中。然后更新成功后,将界面转到公告列表中。
4删除公告
获取到相应公告iD,然后删除,上一篇博客有
结束语。easyui实现后台管理可以很优雅,利用jquery强大的功能,可以把网站做的和桌面应用一样漂亮,甚至更漂亮。我该好好学设计模式了,天天这么看前端,感觉自己都想做前端了!后续可能还会加一些easyui的博客
1 0
- 使用easyui实现的添加公告功能(后台管理)
- jquery.easyui-使用笔记-后台管理功能
- 使用EasyUI实现添加和删除功能
- 使用easyui 做后台管理界面,在Tab中的链接点击后添加一个新TAB的解决方法
- 使用easyUI的Tree实现授权功能
- Joomla后台文章管理添加其他功能的方法
- 【公告管理】开发总结-checkboxgroup的使用
- ASP.NET MVC5+EF6+EasyUI 后台管理系统(82)-Easyui Datagrid批量操作(编辑,删除,添加)
- ASP.NET MVC5+EF6+EasyUI 后台管理系统(82)-Easyui Datagrid批量操作(编辑,删除,添加)
- ASP.NET MVC5+EF6+EasyUI 后台管理系统(82)-Easyui Datagrid批量操作(编辑,删除,添加)
- ASP.NET MVC5+EF6+EasyUI 后台管理系统(82)-Easyui Datagrid批量操作(编辑,删除,添加)
- 使用easyUI添加查询功能在datagrid
- C# 使用easyUI datagrid 实现后台分页
- EasyUI管理后台模板(附源码)
- EasyUI管理后台模板(附源码)
- Easyui后台管理界面设计
- 构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(31)-MVC使用RDL报表
- 构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(31)-MVC使用RDL报表
- 网站设计感想
- <button ></button>与<input type="button" />的区别
- How to Start Intel Hardware-assisted Virtualization (hypervisor) on Linux to Speed-up Intel Android
- PROPACK
- Linux上挂载硬盘
- 使用easyui实现的添加公告功能(后台管理)
- JVM性能监控及故障处理工具
- POJ 1741Tree(树分治)
- None Python
- 关于NorFlash的一点总结
- iOS中的事件传递和响应者链条
- <include />实现标题栏复用
- 中国手机屏幕入口价值研究报告 2015年
- gdb优化相关