note_cloud--笔记分享功能

笔记的分享功能
------------------------------------------------------------------------------------------------

发送请求

发送事件：点击“分享”事件

请求参数：noteId

请求地址：/share/add.do

服务器处理

创建Share的实体类

Controller

Service

Dao

cn_share（insert）

回调处理

success：

1.增加图标处理<i class="fa fa-sitemap"></i>

2.提示分享成功

error：

提示分享失败

------------------------------------------------------------------------------------------------

实体类：

public class Share implements Serializable{private String cn_share_id;private String cn_share_title;private String cn_share_body;private String cn_note_id;

------------------------------------------------------------------------------------------------

Dao接口：

package cn.tedu.cloud_note.dao;import cn.tedu.cloud_note.entity.Share;public interface ShareDao {//分享笔记(插入数据)public void share(Share share);}

------------------------------------------------------------------------------------------------

业务层接口：

package cn.tedu.cloud_note.service;import cn.tedu.cloud_note.util.NoteResult;public interface ShareService {//分享笔记public NoteResult<Object> shareNote(String noteId);}

------------------------------------------------------------------------------------------------

业务层实现类;

package cn.tedu.cloud_note.service;import java.util.Map;import javax.annotation.Resource;import org.springframework.stereotype.Service;import cn.tedu.cloud_note.dao.NoteDao;import cn.tedu.cloud_note.dao.ShareDao;import cn.tedu.cloud_note.entity.Share;import cn.tedu.cloud_note.util.NoteResult;import cn.tedu.cloud_note.util.NoteUtil;@Service("shareService")public class ShareServiceImpl implements ShareService {@Resource(name="shareDao")private ShareDao shareDao;@Resource(name="noteDao")private NoteDao noteDao;//分享笔记public NoteResult<Object> shareNote(String noteId) {NoteResult<Object> result= new NoteResult<Object>();//实例化ShareShare share = new Share();share.setCn_note_id(noteId);//获取idString shareId = NoteUtil.createId();share.setCn_share_id(shareId);//主键//根据传入的参数noteId查找出其余所需的参数Map<String,String> map = noteDao.findByNoteId(noteId);String noteTitle = map.get("cn_note_title");String noteBody = map.get("cn_note_body");share.setCn_share_title(noteTitle);share.setCn_share_body(noteBody);//分享笔记shareDao.share(share);result.setStatus(0);result.setMsg("分享笔记成功");return result;}}

注意事项：

1.Share有4个属性，在业务层中要对其进行实例化,并调用Dao时传入

2.ajax中发送请求参数noteId，在业务层中通过noteId访问数据库查到noteTitle和noteBody用于给Share的属性赋值，还有一个属性通过UUID获取

------------------------------------------------------------------------------------------------

控制层Controller：

package cn.tedu.cloud_note.controller;import javax.annotation.Resource;import org.springframework.stereotype.Controller;import org.springframework.web.bind.annotation.RequestMapping;import org.springframework.web.bind.annotation.ResponseBody;import cn.tedu.cloud_note.service.ShareService;import cn.tedu.cloud_note.util.NoteResult;@Controller@RequestMapping("/share")public class ShareController {@Resource(name="shareService")private ShareService service;//分享笔记@RequestMapping("/add.do")@ResponseBodypublic NoteResult<Object> execute(String noteId){NoteResult<Object> result = service.shareNote(noteId);return result;}}

------------------------------------------------------------------------------------------------

HTML部分代码：

//笔记下拉按钮的分享功能(单击分享,成功后弹窗提示成功)$("#note_ul").on("click",".btn_share",share);

------------------------------------------------------------------------------------------------

引用的JS代码：

//分享笔记function share(){  //获取请求参数--$(this)表示当前点击的jQuery  var $li = $(this).parents("li");  var noteId = $li.data("noteId");  //alert(noteId);  //发送ajax  $.ajax({  url:path + "/share/add.do",  type:"post",  data:{"noteId":noteId},  dataType:"json",  success:function(result){  if(result.status == 0){//回调成功  //新节点的图标(title还可以通过$li.text()获取)  var a = '<i class="fa fa-file-text-o" title="online" rel="tooltip-bottom"></i>'+  $li.text() + '<i class="fa fa-sitemap"></i>'+    '<button type="button" class="btn btn-default btn-xs btn_position btn_slide_down"><i class="fa fa-chevron-down"></i></button>';  //将笔记的li元素的<a>标记内容替换  $li.find("a").html(a);  //提示分享成功  alert(result.msg);  }  },  error:function(){alert("分享笔记失败");}  });  }

注意事项：

1.$(this).parents("li")获取笔记列表的li（jQuery对象）

2.回调函数中对li中的<a>标签进行了重新定义

3.$li.text()可以获得li标签里的内容（不包括标签）

------------------------------------------------------------------------------------------------

测试结果：