javascript - web页面实现数据筛选、排序等功能的思路
后端从数据库读取了一个结果集,保存在数组中,然后显示在前端表格中,但是需要根据用户的筛选、排序等操作对表格进行动态展示。
我能想到的思路是:
1:在后端从数据库读取的数据传递到javascript数组中,用javascript根据用户的选择操作数组(在前端操作数据)
2:在html中嵌入php代码,用php操作数组(在后端操作数据)
3:根据用户的选择每次在数据库中操作并读取所需要的数据,返回到前端页面(在数据库中操作数据)
所操作的数据不超过1000条记录
我后端语言PHP(thinkphp框架)
问:
1:希望前辈们能分析一下各个解决方法的优缺点,给一个最合适的思路!
2:如果用js,怎么将数据传递到js中?
回复内容:
后端从数据库读取了一个结果集,保存在数组中,然后显示在前端表格中,但是需要根据用户的筛选、排序等操作对表格进行动态展示。
我能想到的思路是:
1:在后端从数据库读取的数据传递到javascript数组中,用javascript根据用户的选择操作数组(在前端操作数据)
2:在html中嵌入php代码,用php操作数组(在后端操作数据)
3:根据用户的选择每次在数据库中操作并读取所需要的数据,返回到前端页面(在数据库中操作数据)
所操作的数据不超过1000条记录
我后端语言PHP(thinkphp框架)
问:
1:希望前辈们能分析一下各个解决方法的优缺点,给一个最合适的思路!
2:如果用js,怎么将数据传递到js中?
第一种方案:
适合数据量小,页面响应快的场景
优点:
1、只需要从服务器获取一次数据,对服务器压力小
2、用户所有操作都在前端进行,无需再与服务器通讯,体验比较好
缺点:
1、js操作数据然后再拼接html,或者模板引擎,或者MVVM相对来说会比后端直接生成html要麻烦一些,不过现在这个应该不算缺点吧
第二种方案:
第二种方案也适合数据量小点的场景,它和第一种方案的区别在于:
1、用户每次都要从服务器通讯
2、生成html相对开发者来说比较方便
两种方案相比,建议采用第一种
第三种方案:
适合数据量比较大的时候,分批从数据库获取。
最终在前台展示也无非就是php生成html或者js生成html
数据传递到js,两种方式:
1、页面生成时,顺便把数据给传进去
2、通过ajax去调用
如果结果集在千行以内。推荐 https://github.com/Mottie/tablesorter
简单排序的例子:http://mottie.github.io/tablesorter/
简单筛选的例子:http://mottie.github.io/tablesorter/docs/example-child-rows-filtered.html
全部的例子:http://mottie.github.io/tablesorter/docs/index.html#Demo

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



PHP 8.4 brings several new features, security improvements, and performance improvements with healthy amounts of feature deprecations and removals. This guide explains how to install PHP 8.4 or upgrade to PHP 8.4 on Ubuntu, Debian, or their derivati

Visual Studio Code, also known as VS Code, is a free source code editor — or integrated development environment (IDE) — available for all major operating systems. With a large collection of extensions for many programming languages, VS Code can be c

This tutorial demonstrates how to efficiently process XML documents using PHP. XML (eXtensible Markup Language) is a versatile text-based markup language designed for both human readability and machine parsing. It's commonly used for data storage an

A string is a sequence of characters, including letters, numbers, and symbols. This tutorial will learn how to calculate the number of vowels in a given string in PHP using different methods. The vowels in English are a, e, i, o, u, and they can be uppercase or lowercase. What is a vowel? Vowels are alphabetic characters that represent a specific pronunciation. There are five vowels in English, including uppercase and lowercase: a, e, i, o, u Example 1 Input: String = "Tutorialspoint" Output: 6 explain The vowels in the string "Tutorialspoint" are u, o, i, a, o, i. There are 6 yuan in total

JWT is an open standard based on JSON, used to securely transmit information between parties, mainly for identity authentication and information exchange. 1. JWT consists of three parts: Header, Payload and Signature. 2. The working principle of JWT includes three steps: generating JWT, verifying JWT and parsing Payload. 3. When using JWT for authentication in PHP, JWT can be generated and verified, and user role and permission information can be included in advanced usage. 4. Common errors include signature verification failure, token expiration, and payload oversized. Debugging skills include using debugging tools and logging. 5. Performance optimization and best practices include using appropriate signature algorithms, setting validity periods reasonably,

If you are an experienced PHP developer, you might have the feeling that you’ve been there and done that already.You have developed a significant number of applications, debugged millions of lines of code, and tweaked a bunch of scripts to achieve op

Static binding (static::) implements late static binding (LSB) in PHP, allowing calling classes to be referenced in static contexts rather than defining classes. 1) The parsing process is performed at runtime, 2) Look up the call class in the inheritance relationship, 3) It may bring performance overhead.

What are the magic methods of PHP? PHP's magic methods include: 1.\_\_construct, used to initialize objects; 2.\_\_destruct, used to clean up resources; 3.\_\_call, handle non-existent method calls; 4.\_\_get, implement dynamic attribute access; 5.\_\_set, implement dynamic attribute settings. These methods are automatically called in certain situations, improving code flexibility and efficiency.
