搜索笔记功能

按键监听事件

    $("#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. ubuntu 18.04 64bit如何安装GPU版本tensorflow

    注:笔者的ubuntu18.04 64bit已经安装好了显卡驱动,因此没有此步操作 1.获取cuda(https://developer.nvidia.com/cuda-downloads,选择ubu ...

  2. NSwag给api加上说明

    参考http://petstore.swagger.io 给controller加上description https://github.com/RSuter/NSwag/issues/1803 xm ...

  3. HDU 2485 Destroying the bus stations(费用流)

    http://acm.hdu.edu.cn/showproblem.php?pid=2485 题意: 现在要从起点1到终点n,途中有多个车站,每经过一个车站为1时间,现在要在k时间内到达终点,问至少要 ...

  4. POJ 1780 Code(欧拉回路+非递归dfs)

    http://poj.org/problem?id=1780 题意:有个保险箱子是n位数字编码,当正确输入最后一位编码后就会打开(即输入任意多的数字只有最后n位数字有效)……要选择一个好的数字序列,最 ...

  5. Mac 下安装Java

    下载:https://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html 打开下载的文件,出现如下 ...

  6. Android之网络图片加载的5种基本方式

    学了这么久,最近有空把自己用到过的网络加载图片的方式总结了出来,与大家共享,希望对你们有帮助. 此博客包含Android 5种基本的加载网络图片方式,包括普通加载HttpURLConnection.H ...

  7. Leetcode 39

    //经典回溯法class Solution { public: vector<vector<int>> combinationSum(vector<int>& ...

  8. 057——VUE中vue-router之路由参数默认值的设置

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. POJ 3087 Shuffle'm Up bfs

    题目链接:Shuffle'm Up 除了英文题有点恶心.发现模拟 + bfs 就可以过的时候,就是水了. 一个bug 就是filp函数得到string s12失败了.恩.据大腿告知,string 并不 ...

  10. c++ o2 优化

    有时候,写代码的时候要卡常 这时候就要用到o2优化 #pragma GCC optimize(2) 只要把这句话加在程序开头,就可以手动开o2优化了