Ajax paging in PHP7 message board development
php7 tutorial Column introduces Ajax paging in message board development
Recommended (free): php7 tutorial
With the support of the basic page, if you want to improve the user experience of the page, asynchronous data loading is currently the best solution. way. Ajax paging is the best application scenario for practicing. The knowledge points used have been introduced to a certain extent in the previous class of Friends - PHP7 message board development (Ajax asynchronous submission). I will not describe it here. If you understand it, please read Contents of the previous section.
Tutorial Breakdown
-
1. Definition
JavaScript has function-based scope, as long as it is defined, The current page is globally available, and the identifier isgotopage(){}Functiongotopage. -
2. Ajax asynchronous operation
The content of the previous lesson, the most important thing here is to pay attention to theGETmethod when making asynchronous requests,ajax.phpIt is a logical file that needs to be processed by the asynchronous request server. It only needs to receive the user's page turning request and return the data of the number of response pages (of course, content in other formats, such as JSON, will not be explained here). 3. JS printing data
innerHTML
Print page turning data in the specified page area<ul id= "list_box"><u/>, the style structure here is to output the content within the ul tag, so use the JS selector document.getElementById("list_box") to get the ul The object of the tag, and then use the innerHTML attribute to assign the content to achieve the results we want document.getElementById("list_box").innerHTML = 'Data returned by the server';
4. Use of JS loop
for, traverse all page numbers and identify the current page number
Use a selector to get all Page object var pageno = document.getElementsByClassName('pageno');
Calculate the total number of page numberspageno.lengthforLoop through until matching The page page number requested by the current user is the current page. If the match is successful, a style will be added to the current page number (identifying the page number for which the current request is successful).
This tutorial is based on the PHP7 message board development (pagination) content of Friends.
HTML codelist.php
<?php
include 'config.php';
$page = !empty($_GET['page'])?intval($_GET['page']):1;
$keyword = !empty($_GET['keyword'])?strip_tags($_GET['keyword']):'';
$pagesize = 6;
// 统计总记录数，便于计算出总页数
if(!empty($keyword)){
$sql = "SELECT * FROM feedback WHERE name LIKE '%{$keyword}%'";
}else{
$sql = "SELECT * FROM feedback";
}
$result = mysqli_query($mysqli, $sql);
$total = mysqli_affected_rows($mysqli);
$total_page = ceil($total/$pagesize); // 进一法取整获取总页数
// 开始分页查询，根据page计算偏移量
$offset = ($page - 1) * $pagesize;
if(!empty($keyword)){
$sql = "SELECT * FROM feedback WHERE name LIKE '%{$keyword}%' LIMIT {$offset}, {$pagesize}";
}else{
$sql = "SELECT * FROM feedback LIMIT {$offset}, {$pagesize}";
}
$result = mysqli_query($mysqli, $sql);
$lists = array();
while($rows = mysqli_fetch_array($result)){
$lists[] = $rows;
}
?>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>异步翻页+列表带搜索功能_留言板_科科分享</title>
<!-- 2.新建css样式文件并根据效果图编写css代码 -->
<link rel="stylesheet" href="feedback.css">
<script>
function gotopage(page, keyword){
if(page<0){
page = 1;
}
// 创建 XMLHttpRequest 对象
var ajax, url;
if(window.XMLHttpRequest){
ajax = new XMLHttpRequest();
}else{
// 兼容Internet Explorer（IE5 和 IE6）使用 ActiveX 对象
ajax = new ActiveXObject("Microsoft.XMLHTTP");
}
url = 'page.php?page=' + page + '&keyword=' + keyword;
ajax.open('GET', url, true);
ajax.send();
ajax.onreadystatechange = function(){
// 获取服务器响应状态码
if(ajax.readyState == 4 && ajax.status==200){
// 获取服务器返回的响应返回的数据
var retdata = ajax.responseText;
// 如果返回的时候不为空的时候，就输出
if(retdata){
// 这里是将异步请求的数据 在指定区域（list_box）展示给用户看
document.getElementById("list_box").innerHTML = retdata;
// 最后将页面中的定位当前分页数，告诉用户当前在哪个分页
// 这里相对逻辑会复杂点，慢慢领会
// 第一步获取所有分页数的集合
var pageno = document.getElementsByClassName('pageno');
// 这里用到for循环遍历 从多个分页的集合获取当前用户点击的那个分页链接并添加样式active
for(var i=0; i<pageno.length; i++){
pageno[i].className = 'pageno';
// parseInt(i)+1意思是当前分页,
if(parseInt(i)+1 == page){
pageno[i].className = 'pageno active';
}
}
}
}
}
}
</script>
</head>
<body>
<!-- 工作区，呈现给用户看的 -->
<!-- 1.开始搭建脚手架 -->
<p class="container_box">
<p class="up">
<h3 class="title">留言板</h3>
<h5 class="subtitle">LIST</h5>
</p>
<p class="down list">
<p class="search">
<form action="list.php">
关键词：<input type='text' name="keyword" value="<?php echo $keyword?>" />
<input type="submit" value="去搜索">
</form>
</p>
<ul id="list_box">
<?php
foreach($lists as $item){
?>
<li>姓名：<?php echo $item['name']?> 联系方式：<?php echo $item['contact']?> 内容：<?php echo $item['content']?></li>
<?php
}
?>
</ul>
<p class="pages">
<ul>
<?php
for($p = 1; $p<=$total_page; $p++){
?>
<li class="pageno"><a href="javascript:gotopage(<?php echo $p?>, '<?php echo $keyword?>');"><?php echo $p?></a></li>
<?php
}
?>
</ul>
</p>
</p>
</p>
</body>
</htmlAsynchronous paging codepage.php
<?php
include 'config.php';
$page = !empty($_GET['page'])? intval($_GET['page']):1;
$keyword = !empty($_GET['keyword'])?addslashes(strip_tags($_GET['keyword'])):'';
$pagesize = 6;
// 开始分页查询，根据page计算偏移量
$offset = ($page - 1) * $pagesize;
if(!empty($keyword)){
$sql = "SELECT * FROM feedback WHERE name LIKE '%{$keyword}%' LIMIT {$offset}, {$pagesize}";
}else{
$sql = "SELECT * FROM feedback WHERE 1 LIMIT {$offset}, {$pagesize}";
}
$result = mysqli_query($mysqli, $sql);
$lists = array();
$list = '';
while($rows = mysqli_fetch_array($result)){
$list .= "<li>姓名：". $rows['name']." 联系方式：". $rows['contact']." 内容：".$rows['content']."</li>";
}
echo $list;
exit;Summary
This section is relatively difficult for novices. The knowledge points involved are a summary of what has been learned before. Before you start, you need to clarify your ideas and implement them step by step.
Remember that ideas are very important. Simply learning is not enough. You must be able to master it when you get other similar needs.
Finally, it’s time to start coding! ~
The above is the detailed content of Ajax paging in PHP7 message board development. For more information, please follow other related articles on the PHP Chinese website!
Hot AI Tools
Undresser.AI Undress
AI-powered app for creating realistic nude photos
AI Clothes Remover
Online AI tool for removing clothes from photos.
Undress AI Tool
Undress images for free
Clothoff.io
AI clothes remover
AI Hentai Generator
Generate AI Hentai for free.
Hot Article
Hot Tools
Notepad++7.3.1
Easy-to-use and free code editor
SublimeText3 Chinese version
Chinese version, very easy to use
Zend Studio 13.0.1
Powerful PHP integrated development environment
Dreamweaver CS6
Visual web development tools
SublimeText3 Mac version
God-level code editing software (SublimeText3)
Hot Topics
1371
52
How to solve the problem when php7 detects that the tcp port is not working
Mar 22, 2023 am 09:30 AM
In php5, we can use the fsockopen() function to detect the TCP port. This function can be used to open a network connection and perform some network communication. But in php7, the fsockopen() function may encounter some problems, such as being unable to open the port, unable to connect to the server, etc. In order to solve this problem, we can use the socket_create() function and socket_connect() function to detect the TCP port.
What should I do if the plug-in is installed in php7.0 but it still shows that it is not installed?
Apr 02, 2024 pm 07:39 PM
To resolve the plugin not showing installed issue in PHP 7.0: Check the plugin configuration and enable the plugin. Restart PHP to apply configuration changes. Check the plugin file permissions to make sure they are correct. Install missing dependencies to ensure the plugin functions properly. If all other steps fail, rebuild PHP. Other possible causes include incompatible plugin versions, loading the wrong version, or PHP configuration issues.
How to install mongo extension in php7.0
Nov 21, 2022 am 10:25 AM
How to install the mongo extension in php7.0: 1. Create the mongodb user group and user; 2. Download the mongodb source code package and place the source code package in the "/usr/local/src/" directory; 3. Enter "src/" directory; 4. Unzip the source code package; 5. Create the mongodb file directory; 6. Copy the files to the "mongodb/" directory; 7. Create the mongodb configuration file and modify the configuration.
How to install and deploy php7.0
Nov 30, 2022 am 09:56 AM
How to install and deploy php7.0: 1. Go to the PHP official website to download the installation version corresponding to the local system; 2. Extract the downloaded zip file to the specified directory; 3. Open the command line window and go to the "E:\php7" directory Just run the "php -v" command.
PHP Server Environment FAQ Guide: Quickly Solve Common Problems
Apr 09, 2024 pm 01:33 PM
Common solutions for PHP server environments include ensuring that the correct PHP version is installed and that relevant files have been copied to the module directory. Disable SELinux temporarily or permanently. Check and configure PHP.ini to ensure that necessary extensions have been added and set up correctly. Start or restart the PHP-FPM service. Check the DNS settings for resolution issues.
Which one is better, php8 or php7?
Nov 16, 2023 pm 03:09 PM
Compared with PHP7, PHP8 has some advantages and improvements in terms of performance, new features and syntax improvements, type system, error handling and extensions. However, choosing which version to use depends on your specific needs and project circumstances. Detailed introduction: 1. Performance improvement, PHP8 introduces the Just-in-Time (JIT) compiler, which can improve the execution speed of the code; 2. New features and syntax improvements, PHP8 supports the declaration of named parameters and optional parameters, making functions Calling is more flexible; anonymous classes, type declarations of properties, etc. are introduced.
How to automatically set permissions of unixsocket after system restart?
Mar 31, 2025 pm 11:54 PM
How to automatically set the permissions of unixsocket after the system restarts. Every time the system restarts, we need to execute the following command to modify the permissions of unixsocket: sudo...
Record once and use strace to diagnose the problem of PHP occupying too much system resources.
May 03, 2024 pm 04:31 PM
Local environment: redhat6.7 system. nginx1.12.1, php7.1.0, the code uses the yii2 framework problem: the local web site needs to use the elasticsearch service. When PHP uses elasticsearch built on a local server, the local load is normal. When I use AWS's elasticsearch service, the load on the local server is often too high. Check the nginx and php logs and find no exceptions. The number of concurrent connections in the system is also not high. At this time, I thought of a strace diagnostic tool that our boss told me. Debugging process: Find a php sub-process idstrace-
