使用.NET和Jquery打造简单的便签纸

本文根据 http://tutorialzine.com/2010/01/sticky-notes-ajax-php-jquery/ 编写，并增加了删除功能

演示： http://demo.tutorialzine.com/2010/01/sticky-notes-ajax-php-jquery/demo.php 

主要代码是1）建立标签内容

            string sql = " SELECT * FROM worklog_notes where username='"+User.Identity.Name+"' ORDER BY id DESC ";
            DataSet ds = DBHelper.Instance.ExeDataSet(sql);
            StringBuilder sb = new StringBuilder();
            foreach (DataRow dr in ds.Tables[0].Rows)
            {
                string[] position = dr["xyz"].ToString().Split(new char[] { 'x' });
                left = position[0];
                top = position[1];
                zindex = position[2];
                sb.Append("<div   class=\"note "+dr["color"]+ "\" style=\"left:"+left+"px; top:"+top+"px; z-index:"+zindex+"\">");
                sb.Append("<div class=\"delbtn\" noteid="+dr["id"].ToString()+">x</div>");
                sb.Append(dr["text"].ToString());
                sb.Append("<div class=\"author\">"+dr["name"].ToString()+"</div>");
             sb.Append("<span class=\"data\">"+dr["id"].ToString()+"</span>");
                sb.Append("</div>");
            }
            lbl_notes.Text = sb.ToString();
        

2）

删除时，处理是由ajax文件夹下的文件进行处理

    $('.delbtn').click(
   function() {
        $(this).parent().hide();
        $.get('ajax/delete.aspx', { id: $(this).attr('noteid')

       });

   }
)

具体的见源代码

https://files.cnblogs.com/mqingqing123/StickNotes.rar