将产品存储在MYSQL数据库中，然后搜索并过滤它们？

debugcn 发表于 Dev

敲松

我的任务是为我的一个朋友建立一个可搜索的列表，我主要是一名前端设计师，所以我只知道极端的基础知识以及从书本和教程中可以找到的所有内容。

至于这个问题，有没有一种方法可以在MySQL数据库中创建可以容纳一些标签的项目，例如高度，宽度，厚度，颜色，公司，类型，类别和配置文件图像？从理论上讲，我想建立一个我已经拥有的注册页面，我的朋友可以用来自己添加产品。将项目创建为“ products”中的“项目”是否是解决此问题的有效方法？

CREATE TABLE `admin`.`productss` (
    `id` INT NOT NULL AUTO_INCREMENT PRIMARY KEY,
    `type` VARCHAR(30) NOT NULL,
    `category` VARCHAR(50) NOT NULL,
    `thickness` CHAR(128) NOT NULL,
    `height` CHAR(128) NOT NULL,
    `color` CHAR(128) NOT NULL,
    `material` CHAR(128) NOT NULL,
) ENGINE = InnoDB;

还是语法不允许我这样做？

我目前有一个使用“假”数据库的解决方案，或者像一长串直到被搜索到为止一直隐藏的解决方案，但这只能使用HTML，CSS，JS来完成，而我正在寻找一种更优雅的解决方案。

==========================

带有HTML / CSS / JS的工作过滤小提琴：http : //fiddle.jshell.net/j1by6xn1/10/

“假”数据库列表的小提琴：http : //jsfiddle.net/5ky8gx4L/

==========================

+----+-----+----+
|NAME|GREEN|15in|
+----+-----+----+
|NAME| RED |10in|
+----+-----+----+

在按“ 15英寸”尺寸进行过滤时，它只会显示尺寸为15英寸的产品。

+----+-----+----+
|NAME|GREEN|15in|
+----+-----+----+

埃里克·特万（Erik Terwan）

您可以将行插入productss显示的表中，然后可以使用该WHERE子句对其进行过滤。这将涉及以下方面：

//This shows all the products with type 'My Type' :
SELECT * FROM `productss` WHERE `type` = 'My Type' 

//This shows all the products where the category has the text 'abc' in it (so also 12abc34 or 12abc :
SELECT * FROM `productss` WHERE `category` LIKE '%abc%'

//This shows all the products where the color is 255:
SELECT * FROM `productss` WHERE `color` = 255

这是用于后端过滤的，整齐的前端方法是使用AJAX从JavaScript调用带有需要过滤的变量的PHP脚本。

另一种方法是使用jQuery，打印列表中的所有行并添加data-something属性。那么您的li标签将如下所示：

<li data-color='255' data-category='Something' data-type='My Type'>Hello</li>

值data-color，category等将直接来自您的数据库。然后，您可以像这样过滤它们：

$(function(){
  $(".sortButton").click(function(){
    var filterByColor = $(this).attr('colorfilter'); //say this value is the color you want to filter by
    $("li").hide(); //hide all options
    $("li[data-color="+filterByColor+"]").show(); //show the options that match the filter
  });
});

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。