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

Question

I am tasked with building a searchable list for a friend of mine, I am mostly a front-end designer, so I only know extreme basics and whatever I can find through books and tutorials.

As for the question, is there a way to create items in MySQL database that could hold a few tags such as height, width, thickness, color, company, type, category and a profile image of it? In theory, I would like to set up a registration page, which I already have, that my friend could use to add products himself. Would creating the items as "items" in a "products" be an effective way of going about this?

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;

Or does the syntax not allow me to do that?

I currently have a solution using a 'fake' database, or like a long list that is hidden until searched, but this is done only using HTML, CSS, JS and I am looking for a more elegant solution to go about this.

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

Fiddle of the working filtering w/ HTML/CSS/JS: http://fiddle.jshell.net/j1by6xn1/10/

Fiddle of the 'fake' database list: http://jsfiddle.net/5ky8gx4L/

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

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

And upon filtering by size '15in' it will only show the products with 15in as a size tag.

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

Answer 1

You can insert rows into the table productss you showed, then you can filter them with the WHERE clause. This would go something among the lines of:

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

This is for back-end filtering, the neat way to do it front-end is to use AJAX to call a PHP script from JavaScript with the variables it needs to filter.

Another way to do this is to use jQuery, print all the rows in a list and add data-something attributes; then your li tag will look something like:

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

the values data-color, category etc. will come directly from your database. Then you can filter them like so:

$(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
  });
});