02 - Unit08:搜索笔记功能、搜索分页、处理插入数据库乱码问题

搜索笔记功能

按键监听事件

    $("#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"

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

时间: 2024-10-21 16:50:55

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

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

版本: django:2.1.7 python:3.7 Django架构中自带了后端分页的技术,通过Paginator进行分页,前端点击按钮提交后台进行页面切换. 优缺点:后端分页对于数据量大的场景有其优势,但页面切换比较慢. 后端分页python3代码如下: paginator = Paginator(stat_list, numtmp) try: flight_stats = paginator.page(1) except PageNotAnInteger: flight_stats =

Vue.js 实践(2):实现多条件筛选、搜索、排序及分页的表格功能

与上周的第一篇实践教程一样,在这篇文章中,我将继续从一种常见的功能--表格入手,展示Vue.js中的一些优雅特性.同时也将对filter功能与computed属性进行对比,说明各自的适用场景,也为vue2.0版本中即将删除的部分filter功能做准备. 需求分析 还是先从需求入手,想想实现这样一个功能需要注意什么.大致流程如何.有哪些应用场景. 表格本身是一种非常常用的组件,用于展示一些复杂的数据时表现很好. 当数据比较多时,我们需要提供一些筛选条件,让用户更快列出他们关注的数据. 除了预设的一

02 超级搜索术——资源搜索:全面、快速查找全网你想要的任何信息、情报

02 超级搜索术——资源搜索:全面.快速查找全网你想要的任何信息.情报 2018-07-30 目录 1. 超级搜索心法2. 资源搜索逻辑  场景1 庞杂资料搜索逻辑  场景2 专业文献资料的搜索逻辑  场景3 视频网站搜索3. 搜索技巧 1. 超级搜索心法 返回 超级搜索心法:遇到一切问题,首先想到的是搜索. 搜索资源时,要先百度,后淘宝,实在不行用知乎 这里的资源包括但不限于资料,视频,文献.软件,这里的百度不是单只百度,而是一切搜索引擎,包括不限于百度.搜狗微信.谷歌等等,淘宝代指一切购物网

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

Sharepoint搜索引擎主要由6种组件构成,他们分别是爬网组件,内容处理组件,分析处理组件,索引组件,查询处理组件,搜索管理组件.可以将这6种组件分别部署到Sharepoint场内的多个服务器上,组成适合需求的Sharepoint搜索场,搜索场的体系结构设计主要参考量是爬网内容量,微软根据爬网内容量不同将搜索场分为大型场,中型场和小型场,更多详细信息可参考: SharePoint Server 2013 中的搜索概述和在SharePoint Server 2013 中规划企业搜索体系结构.

linux笔记:搜索命令find,locate,which,whereis,grep

命令名称:find功能:文件搜索命令所在路径:/bin/find用法:find 搜索范围 匹配条件其他:举例:find /root -name initfind /root -size +1024find /root -user dashenfind /root -group yizufind /root -cmin -5find /root -size +1024 -a -size -2048find /root -type ffind /root -inum 1234find /root -

APP搜索附近功能的一种解决方案-基于百度LBS云服务

为了在APP中根据定位实现搜索附近(POI)的功能,采用百度LBS云服务,将所有POI数据上传后,可以实现该功能. LBS数据管理地址:在这里标记信息后(支持批量上传)即可开始使用搜索功能. http://lbsyun.baidu.com/datamanager/datamanage 搜索附近接口地址: http://api.map.baidu.com/geosearch/v3/nearby 请求方式: GET 参数: { ak:'540b088ff0f926b7d0b6d5a641******

SQL 可搜索 可排序 可分页存储过程 适用于sql 2008以上

-- ============================================= -- Author: 蜘蛛王 -- Create date: 2015-10-29 -- Description: 可搜索 可排序 可分页存储过程 适用于sql2008以上 -- (非常重要,请认真使用) -- ============================================= create PROCEDURE dbo.list ( @table varchar(1000),

Sharepoint2013搜索学习笔记之搜索构架简单概述(一)

Sharepoint搜索引擎主要由6种组件构成,他们分别是爬网组件,内容处理组件,分析处理组件,索引组件,查询处理组件,搜索管理组件.可以将这6种组件分别部署到Sharepoint场内的多个服务器上,组成适合需求的Sharepoint搜索场,搜索场的体系结构设计主要参考量是爬网内容量,微软根据爬网内容量不同将搜索场分为大型场,中型场和小型场,更多详细信息可参考:SharePoint Server 2013 中的搜索概述和在SharePoint Server 2013 中规划企业搜索体系结构. S

用jsonp实现搜索框功能的实现

用jsonp实现搜索框功能的实现 前面的话: 在上周本来想发一篇模仿必应搜索的界面.但是在准备写文章之前突然想到前面学习了ajax技术,在这里我也让我的页面有一种不需要手动刷新就能获取到数据.但是发现用前面的方法并不能获取到我想要的效果.无奈前几天电脑换系统,把之前的源码丢了(前面有个不好的习惯就是把最近在做的东西放桌面).今天想彻底把这个问题搞明白. 用jquery和ajax进行初步的尝试: (本代码是参考慕课网,搜索框制作视频制作,有关具体详情请参考视频.自己之前的代码找不到了,之前最先的想