搜索笔记功能

按键监听事件

    $("#search_note").keydown(function(event){
var code=event.keyCode;
if(code==13){
请求发送
}
})

select * from cnshare cnshare_title like '%'

发送Ajax请求

  • 事件绑定:键盘监听事件(keydown)

  • 获取参数:keyword,作为模糊查询的基础

  • 发送请求:/share/find.do

服务器处理

  • ShareController.searchNote(String keyword)

  • ShareService.searchNote(String keyword)

    String title="%";
    
    if(keyword!=null){
    
        title="%"+keyword+"%";
    
    }
    
    shareDao.findLikeTitle(title);
    1. 不输入关键字,实现全表查询('%')

    2. 输入关键字,进行模糊查询('%keyword%')

  • ShareDao.findLikeTitle(String keyword)

  • Mapper: select *

        from cn_share 
    
        where cn_share_title like #{keyword}

Ajax回调处理

  • success:

    1. pcpart6显示,隐藏pcpart2

    2. 将li元素添加到$("#search_ul")列表中

      sli+='

    3. ';

      sli+='';

      sli+='<i class="fa fa-file-text-o" title="online"

      rel="tooltip-bottom">';

      sli+=shareTitle;

      sli+='<button type="button" class="btn btn-default btn-xs

      btnposition btnslide_down"><i class="fa fa-chevron-

      down">';

      sli+='';

      sli+='

    4. ';

  • error: 提示搜索笔记失败

搜索分页需求

    select * from cn_share 

    where cn_share_title like #{title}

    limit #{begin},3

    n:抓取记录的起点,从0开始(0表示第一条)

    m:抓取记录的最大数

    1 - 0

    2 - 3

    3 - 6

    n - (n-1)*3

处理插入数据库乱码问题

    "jdbc:mysql:///cloud_note?

    useUnicode=true&amp;charaterEncoding=utf8"

作业:实现搜索分享笔记的分页功能(重点)

02 - Unit08:搜索笔记功能、搜索分页、处理插入数据库乱码问题的更多相关文章

  1. Django中使用JS通过DataTable实现表格前端分页,每页显示页数,搜索等功能

    Django架构中自带了后端分页的技术,通过Paginator进行分页,前端点击按钮提交后台进行页面切换. 优缺点:后端分页对于数据量大的场景有其优势,但页面切换比较慢. 后端分页python3代码如 ...

  2. YII关联字段并带搜索排序功能

    1.简介 从接触yii框架到现在已经快有两个月了,但是自己对yii框架的了解程度并不是很深,并没有系统地去学习,仅仅只是在做项目的时候遇到不懂得知识才去翻手册. 在上一个项目中因为需要将关联的表的字段 ...

  3. python 全栈开发,Day115(urlencode,批量操作,快速搜索,保留原搜索条件,自定义分页,拆分代码)

    今日内容前戏 静态字段和字段 先来看下面一段代码 class Foo: x = 1 # 类变量.静态字段.静态属性 def __init__(self): y = 6 # 实例变量.字段.对象属性 # ...

  4. es站内站内搜索笔记(一)

    es站内站内搜索笔记(一) 第一节: 概述 使用elasticsearch进行网站搜索,es是当下最流行的分布式的搜索引擎及大数据分析的中间件,搜房网的主要功能:强大的搜索框,与百度地图相结合,实现地 ...

  5. 【音乐App】—— Vue-music 项目学习笔记:搜索页面开发

    前言:以下内容均为学习慕课网高级实战课程的实践爬坑笔记. 项目github地址:https://github.com/66Web/ljq_vue_music,欢迎Star. 搜索歌手歌曲 搜索历史保存 ...

  6. Vue2.0实现1.0的搜索过滤器功能

    Vue2.0删除了很多1.0的比较实用的过滤器,如filterBy,orderBy.官方文档给了通过计算属性实现1.0搜索过滤器功能,自己又加入了大小写通用检索功能,比较简单,学一下. <bod ...

  7. 用jsonp实现搜索框功能

    用jsonp实现搜索框功能 前面的话: 在上周本来想发一篇模仿必应搜索的界面.但是在准备写文章之前突然想到前面学习了ajax技术,在这里我也让我的页面有一种不需要手动刷新就能获取到数据.但是发现用前面 ...

  8. 1、SQL可搜索可排序可分页存储过程, 2、范围内的随机时间 适用于sql 2008以上

    -- ============================================= -- Author: 蜘蛛王 -- Create date: 2015-10-29 -- Descri ...

  9. [转载]SharePoint 2013搜索学习笔记之搜索构架简单概述

    Sharepoint搜索引擎主要由6种组件构成,他们分别是爬网组件,内容处理组件,分析处理组件,索引组件,查询处理组件,搜索管理组件.可以将这6种组件分别部署到Sharepoint场内的多个服务器上, ...

随机推荐

  1. 框架-spring源码分析(一)

    框架-spring源码分析(一) 参考: https://www.cnblogs.com/heavenyes/p/3933642.html http://www.cnblogs.com/BINGJJF ...

  2. fiddler抓包https

    http://blog.csdn.net/idlear/article/details/50999490 charles也能抓取https请求 http://blog.csdn.net/jiadoud ...

  3. MySQL返回影响行数的测试示例

    found_rows() : select row_count() : update delete insert 注:需要配合相应的操作一起使用,否则返回的值只是1和-1(都是不正确的值) 示例: d ...

  4. 还是 js 替代 vw vh 了

    有个需求是要层叠两张图,就像你现在看到的:整个浏览器和html页面,内层图片要水平居中,等比例与源UI图适配不同设备 本来很简单的使用 vw vh了( 核心代码             top: 13 ...

  5. ipconfig会出现多个IP地址

    一.问题描述 今天调试程序的时候发现电脑有两个IP地址,一时间不知道该用哪个?如下图: 二.问题分析 第一个叫ppp适配器,是一个逻辑的虚拟设备,ppp的意思是Point-to-Point Proto ...

  6. 【Python】使用codecs模块进行文件操作及消除文件中的BOM

    前言 此前遇到过UTF8格式的文件有无BOM的导致的问题,最近在做自动化测试,读写配置文件时又遇到类似的问题,和此前一样,又是折腾了挺久之后,通过工具比较才知道原因. 两次在一个问题上面栽更头,就在想 ...

  7. Libpacp 深度剖析

    Libpacp 深度剖析 1. Libpacp 的工作原理 ​ Libpcap的工作原理可以描述为,当一个数据包到达网卡时,通过网络分接口(即旁路机制)将数据包发给BPF过滤器,匹配通过的数据包可以被 ...

  8. Rails 5 Test Prescriptions 第6章Adding Data to Tests

    bcreate the data quickly and easily.考虑测试运行的速度. fixtures and factories.以及下章讨论的test doubles,还有原生的creat ...

  9. 如何使用Win8系统自带杀毒软件

    首先我们要说明的是,Windows Defender并不是我们杀毒首选,这只是微软在用户没有安装仍和杀软时提供的备用防护机制.因此我们如果安装了第三方的杀毒软件,系统就会将Windows Defend ...

  10. Netty自定义Encoder/Decoder进行对象传递

    转载:http://blog.csdn.net/top_code/article/details/50901623 在上一篇文章中,我们使用Netty4本身自带的ObjectDecoder,Objec ...