LayUI数据表格查询与重载

查询功能模块的工作流程是:

  1. 在输入框中输入关键字,点击查询按钮,数据传输到服务端。
  2. 服务端接收到数据,进行查询后将数据拼接成前端框架所需要的json类型。
  3. 服务端返回查询结果,前端数据表格方法级渲染的重载。
  4. 如果未输入数据点击查询按钮,弹窗提示用户输入数据。

前端数据展示与重载

编写输入框与查询按钮,监听按钮点击事件。

<div class="layui-inline layui-show-xs-block">
                            <input type="text" name="userName" id="userName" placeholder="请输入姓名/昵称" autocomplete="off"
                                   required="required"
                                   class="layui-input"></div>
<script>
      //点击搜索按钮根据用户名称查询
        $('#selectbyCondition').on('click',
            function () {
                if ($('#userName').val() == '') {
                    layui.use('layer', function () {
                        var layer = layui.layer;
                        layer.open({
                            title: '提示消息'
                            ,content: '查询条件不能为空!'
                        });

                    });
                } else {
                    //根据条件查询表格数据重新加载
                    table.reload('userTableReload', {
                        url: 'search.php',
                        where: { //设定异步数据接口的额外参数,任意设
                            userName: $('#userName').val()
                        }
                        , page: {
                            curr: 1 //重新从第 1 页开始
                        }
                    });
                }
            });
</script>

PHP服务端查询功能

后端程序以POST方式从前端接收查询关键字的值,进行数据查询并且将查询数据拼装成为前端框架所需要的json字段,实现代码如下所示。

<?php
header("content-type:text/html;charset=utf-8;");
require ('db_config.php');
$userName = $_POST['userName'];

$sql = "select id,time,object,name,message, case gender when 1 then '男' when 0 then '女' end as gender from donation order by id desc where donor like '%".$userName."%'";
$result = $mysqli->query($sql);
$arr = array();
while ($row = mysqli_fetch_array($result)) { 
    $arr[] = $row;
}
$donation_data = array(
    'code'=>0,
    'msg'=>'',
    'count'=>$count,
    'data'=>$arr
);
echo json_encode($donation_data);
//echo $sql;
?>

实现效果

在查询不到的情况下,显示“无数据”。
在这里插入图片描述

在可以查询到数据的情况下显示查询到的数据。
在这里插入图片描述

MySQL查询数据处理

数据库中以1和0分别代表性别“男”和“女”,在查询输出显示时需要以用户能看懂的中文“男”和“女”显示,所以,需要将代码稍加改进,改进后的代码如下。

select id,time,object,name,message, case gender when 1 then '男' when 0 then '女' end as gender from donation order by id desc where donor like '%".$userName."%'

相关文章:《PHP+MySQL+LayUI分页查询显示》|《PHP语言实现网站登录功能》|《PHP实现退出登录功能》


作者:戴翔
电子邮箱:daixiangcn@outlook.com
微信开发者主页:Null
简介:中国公民,CSDN博客专家,秦淮区疾控中心托管社会公益组织指南针工作室志愿者,创业公司研发中心负责人,在校大学生。第二届大学生微信小程序应用开发大赛全国三等奖项目第一作者,微信小程序《约车吗》、《庆云慈善会》、《锋云速检》项目总工程师。


  • 2
    点赞
  • 28
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

戴翔的技术博客

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值