簡體   English   中英

將產品存儲在MYSQL數據庫中,然后搜索並過濾它們?

[英]Storing products in a MYSQL database and then search and filter them?

我的任務是為我的一個朋友建立一個可搜索的列表,我主要是一名前端設計師,所以我只知道極端的基礎知識以及我在書本和教程中可以找到的所有內容。

至於這個問題,有沒有一種方法可以在MySQL數據庫中創建可以包含一些標簽的項目,例如高度,寬度,厚度,顏色,公司,類型,類別和配置文件圖像? 從理論上講,我想建立一個我已經擁有的注冊頁面,我的朋友可以用來自己添加產品。 將產品創建為“ product s”中的“項目”是否是解決此問題的有效方法?

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|
+----+-----+----+

您可以將行插入顯示的表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,打印列表中的所有行並添加數據屬性。 那么您的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
  });
});

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM