{"id":344,"date":"2023-10-30T17:40:30","date_gmt":"2023-10-30T11:40:30","guid":{"rendered":"https:\/\/theplugindemo.com\/justtables\/?page_id=344"},"modified":"2023-11-11T11:49:51","modified_gmt":"2023-11-11T05:49:51","slug":"product-table-with-filter-search","status":"publish","type":"page","link":"https:\/\/theplugindemo.com\/justtables\/product-table-with-filter-search\/","title":{"rendered":"Product Table With Filter &amp; Search"},"content":{"rendered":"\n<div class=\"wp-block-group is-layout-flow wp-block-group-is-layout-flow\" style=\"padding-top:var(--wp--preset--spacing--60);padding-bottom:var(--wp--preset--spacing--60)\"><!-- jtpt-product-table-341 inline style start --><style class=\"jtpt-product-table-341-inline-css\">.jtpt-product-table-341-wrapper { background-color: rgba(0,0,0,0); border-top-left-radius: 3px; border-top-right-radius: 3px; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; } .jtpt-product-table-341-loading { background-color: rgba(0,0,0,0); border-top-left-radius: 3px; border-top-right-radius: 3px; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; } .jtpt-product-table-341-wrapper .jtpt-filter { border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-style: solid; border-color: #dddddd; border-top-left-radius: 3px; border-top-right-radius: 3px; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; padding-top: 20px; padding-right: 25px; padding-bottom: 20px; padding-left: 25px; } .jtpt-product-table-341-wrapper .jtpt-matc .jtpt-matc-button { background-color: #eeeffb; color: #333333; border-color: #eeeffb; border-top-left-radius: 3px; border-top-right-radius: 3px; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .jtpt-product-table-341-wrapper .jtpt-search .jtpt-search-input { border-top-left-radius: 3px; border-top-right-radius: 3px; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .jtpt-product-table-341-wrapper .jtpt-ftrigger .jtpt-ftrigger-button { border-top-left-radius: 3px; border-top-right-radius: 3px; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .jtpt-product-table-341-wrapper .jtpt-taxonomy-filter .select2-container .select2-selection--multiple, .jtpt-product-table-341-wrapper .jtpt-taxonomy-filter .select2-container.select2-container--open.select2-container--above .select2-selection--multiple, .jtpt-product-table-341-wrapper .jtpt-taxonomy-filter .select2-container.select2-container--open.select2-container--above .select2-selection--single, .jtpt-product-table-341-wrapper .jtpt-taxonomy-filter .select2-container.select2-container--open.select2-container--below .select2-selection--multiple, .jtpt-product-table-341-wrapper .jtpt-taxonomy-filter .select2-container.select2-container--open.select2-container--below .select2-selection--single { border-top-left-radius: 3px; border-top-right-radius: 3px; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .jtpt-select2-dropdown-341 .select2-results { border-top-left-radius: 3px; border-top-right-radius: 3px; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .jtpt-product-table-341-wrapper .jtpt-product-table, .jtpt-product-table-341-wrapper .jtpt-product-table.dataTable.no-footer { background-color: rgba(255,255,255,0); border-top-left-radius: 3px; border-top-right-radius: 3px; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .jtpt-product-table-341-wrapper th.jtpt-head-data { background-color: rgba(255,255,255,0.01); border-top-width: 1px; border-right-width: 1px; border-bottom-width: 0px; border-left-width: 1px; border-style: solid; border-color: #dddddd; } .jtpt-product-table-341-wrapper th.jtpt-head-data-first { border-top-left-radius: 3px; border-bottom-left-radius: 0px; } .jtpt-product-table-341-wrapper th.jtpt-head-data-last { border-top-right-radius: 3px; border-bottom-right-radius: 0px; } .jtpt-product-table-341-wrapper td.jtpt-body-data, .jtpt-product-table-341-wrapper td.dataTables_empty { border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-style: solid; border-color: #dddddd; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; padding-left: 10px; } .jtpt-product-table-341-wrapper td.child { border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-style: solid; border-color: #dddddd; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; padding-left: 10px; } .jtpt-product-table-341-wrapper .jtpt-quantity .quantity .qty, .jtpt-product-table-341-wrapper .jtpt-quantity .quantity .qty:focus { border-top-left-radius: 3px; border-top-right-radius: 3px; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .jtpt-product-table-341-wrapper .jtpt-variations .jtpt-variation-filter-select, .jtpt-product-table-341-wrapper .jtpt-action .jtpt-variations-button .jtpt-variation-filter-select { border-top-left-radius: 3px; border-top-right-radius: 3px; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .jtpt-product-table-341-wrapper .jtpt-action .jtpt-atc-button a.jtpt-add-to-cart-button-large { border-top-left-radius: 3px; border-top-right-radius: 3px; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .jtpt-product-table-341-wrapper .jtpt-paginate-numbers span .paginate_button { border-top-left-radius: 3px; border-top-right-radius: 3px; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .jtpt-product-table-341-wrapper .jtpt-export .jtpt-export-buttons .dt-buttons .dt-button { color: #222222; border-color: #eeeffb; border-top-left-radius: 3px; border-top-right-radius: 3px; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .jtpt-product-table-341-wrapper .jtpt-export .jtpt-export-buttons .dt-buttons .dt-button:hover, .jtpt-product-table-341-wrapper .jtpt-export .jtpt-export-buttons .dt-buttons .dt-button:focus { background-color: #eeeffb; color: #222222; border-color: #eeeffb; } .jtpt-product-table-341-wrapper .jtpt-head-data-1 { text-align: center !important; } .jtpt-product-table-341-wrapper .jtpt-body-data-1, .jtpt-product-table-341-wrapper .jtpt-body-data-1 .jtpt-align-wrap { text-align: center !important; } .jtpt-product-table-341-wrapper .jtpt-head-data-2, .jtpt-product-table-341-wrapper .jtpt-body-data-2 { width: 20px !important; min-width: 20px !important;  } .jtpt-product-table-341-wrapper .jtpt-head-data-2 { text-align: center !important; } .jtpt-product-table-341-wrapper .jtpt-body-data-2, .jtpt-product-table-341-wrapper .jtpt-body-data-2 .jtpt-align-wrap { text-align: center !important; } .jtpt-product-table-341-wrapper .jtpt-head-data-4 { text-align: center !important; } .jtpt-product-table-341-wrapper .jtpt-body-data-4, .jtpt-product-table-341-wrapper .jtpt-body-data-4 .jtpt-align-wrap { text-align: center !important; } .jtpt-product-table-341-wrapper .jtpt-head-data-5 { text-align: center !important; } .jtpt-product-table-341-wrapper .jtpt-body-data-5, .jtpt-product-table-341-wrapper .jtpt-body-data-5 .jtpt-align-wrap { text-align: center !important; } .jtpt-product-table-341-wrapper .jtpt-head-data-6 { text-align: center !important; } .jtpt-product-table-341-wrapper .jtpt-body-data-6, .jtpt-product-table-341-wrapper .jtpt-body-data-6 .jtpt-align-wrap { text-align: center !important; }<\/style><!-- jtpt-product-table-341 inline style end --><!-- jtpt-product-table-341 start --><div class=\"jtpt-product-table-wrapper jtpt-product-table-341-wrapper\" data-jtpt-product-table-id=\"341\" data-jtpt-query-args-json=\"{&quot;post_type&quot;:&quot;product&quot;,&quot;post_status&quot;:&quot;publish&quot;,&quot;posts_per_page&quot;:6,&quot;meta_query&quot;:[null],&quot;ignore_sticky_posts&quot;:true,&quot;orderby&quot;:&quot;date&quot;,&quot;order&quot;:&quot;DESC&quot;,&quot;tax_query&quot;:[{&quot;taxonomy&quot;:&quot;product_type&quot;,&quot;field&quot;:&quot;slug&quot;,&quot;terms&quot;:[&quot;simple&quot;],&quot;include_children&quot;:true,&quot;operator&quot;:&quot;IN&quot;}]}\" data-jtpt-taxonomy-query-include-args-json=\"{&quot;product_type&quot;:{&quot;taxonomy&quot;:&quot;product_type&quot;,&quot;field&quot;:&quot;slug&quot;,&quot;terms&quot;:[&quot;simple&quot;],&quot;include_children&quot;:true,&quot;operator&quot;:&quot;IN&quot;}}\" data-jtpt-taxonomy-query-filter-include-args-json=\"{&quot;product_type&quot;:{&quot;taxonomy&quot;:&quot;product_type&quot;,&quot;field&quot;:&quot;slug&quot;,&quot;terms&quot;:[&quot;simple&quot;],&quot;include_children&quot;:true,&quot;operator&quot;:&quot;IN&quot;}}\" data-jtpt-taxonomy-query-exclude-args-json=\"[]\" data-jtpt-taxonomy-query-filter-exclude-args-json=\"[]\" data-jtpt-columns-json=\"[{&quot;default-heading&quot;:&quot;Check Mark&quot;,&quot;fixed-heading&quot;:&quot;Check Mark&quot;,&quot;deletable&quot;:&quot;false&quot;,&quot;column-id&quot;:&quot;check&quot;,&quot;priority&quot;:&quot;1&quot;,&quot;sort&quot;:&quot;just-tables-pro-no-sort&quot;,&quot;active&quot;:&quot;1&quot;,&quot;heading&quot;:&quot;&quot;,&quot;column-width&quot;:{&quot;width&quot;:&quot;&quot;,&quot;unit&quot;:&quot;px&quot;},&quot;horizontal-align&quot;:{&quot;content&quot;:&quot;center&quot;,&quot;header&quot;:&quot;center&quot;}},{&quot;default-heading&quot;:&quot;Thumb&quot;,&quot;fixed-heading&quot;:&quot;Thumbnail&quot;,&quot;deletable&quot;:&quot;false&quot;,&quot;column-id&quot;:&quot;thumbnail&quot;,&quot;priority&quot;:&quot;2&quot;,&quot;sort&quot;:&quot;jtpt-no-sort&quot;,&quot;active&quot;:&quot;1&quot;,&quot;heading&quot;:&quot;Thumb&quot;,&quot;column-width&quot;:{&quot;width&quot;:&quot;20&quot;,&quot;unit&quot;:&quot;px&quot;},&quot;horizontal-align&quot;:{&quot;content&quot;:&quot;center&quot;,&quot;header&quot;:&quot;center&quot;}},{&quot;default-heading&quot;:&quot;Products&quot;,&quot;fixed-heading&quot;:&quot;Product Title&quot;,&quot;deletable&quot;:&quot;false&quot;,&quot;column-id&quot;:&quot;title&quot;,&quot;priority&quot;:&quot;3&quot;,&quot;sort&quot;:&quot;jtpt-sort&quot;,&quot;active&quot;:&quot;1&quot;,&quot;heading&quot;:&quot;Products&quot;,&quot;title-add-elements&quot;:[&quot;rating&quot;,&quot;short-description&quot;],&quot;column-width&quot;:{&quot;width&quot;:&quot;&quot;,&quot;unit&quot;:&quot;px&quot;},&quot;horizontal-align&quot;:{&quot;content&quot;:&quot;&quot;,&quot;header&quot;:&quot;&quot;}},{&quot;default-heading&quot;:&quot;Price&quot;,&quot;fixed-heading&quot;:&quot;Price&quot;,&quot;deletable&quot;:&quot;false&quot;,&quot;column-id&quot;:&quot;price&quot;,&quot;priority&quot;:&quot;8&quot;,&quot;sort&quot;:&quot;jtpt-sort&quot;,&quot;active&quot;:&quot;1&quot;,&quot;heading&quot;:&quot;Price&quot;,&quot;column-width&quot;:{&quot;width&quot;:&quot;&quot;,&quot;unit&quot;:&quot;px&quot;},&quot;horizontal-align&quot;:{&quot;content&quot;:&quot;center&quot;,&quot;header&quot;:&quot;center&quot;}},{&quot;default-heading&quot;:&quot;Quantity&quot;,&quot;fixed-heading&quot;:&quot;Quantity&quot;,&quot;deletable&quot;:&quot;false&quot;,&quot;column-id&quot;:&quot;quantity&quot;,&quot;priority&quot;:&quot;7&quot;,&quot;sort&quot;:&quot;jtpt-no-sort&quot;,&quot;active&quot;:&quot;1&quot;,&quot;heading&quot;:&quot;Quantity&quot;,&quot;column-width&quot;:{&quot;width&quot;:&quot;&quot;,&quot;unit&quot;:&quot;px&quot;},&quot;horizontal-align&quot;:{&quot;content&quot;:&quot;center&quot;,&quot;header&quot;:&quot;center&quot;}},{&quot;default-heading&quot;:&quot;Action &quot;,&quot;fixed-heading&quot;:&quot;Action&quot;,&quot;deletable&quot;:&quot;false&quot;,&quot;column-id&quot;:&quot;action&quot;,&quot;priority&quot;:&quot;4&quot;,&quot;sort&quot;:&quot;jtpt-no-sort&quot;,&quot;active&quot;:&quot;1&quot;,&quot;heading&quot;:&quot;Action &quot;,&quot;column-width&quot;:{&quot;width&quot;:&quot;&quot;,&quot;unit&quot;:&quot;px&quot;},&quot;horizontal-align&quot;:{&quot;content&quot;:&quot;center&quot;,&quot;header&quot;:&quot;center&quot;}}]\" data-jtpt-columns-id-json=\"[&quot;check&quot;,&quot;thumbnail&quot;,&quot;title&quot;,&quot;price&quot;,&quot;quantity&quot;,&quot;action&quot;]\" data-jtpt-element-configuration-json=\"{&quot;title_on_click&quot;:&quot;view&quot;,&quot;thumbnail_size&quot;:[100,100],&quot;thumbnail_on_click&quot;:&quot;popup&quot;,&quot;view_product_button_text&quot;:&quot;View Product&quot;,&quot;view_product_target&quot;:&quot;blank&quot;,&quot;author_name_on_click&quot;:&quot;view&quot;,&quot;view_author_target&quot;:&quot;blank&quot;,&quot;atc_button_opt&quot;:{&quot;type&quot;:&quot;large&quot;,&quot;small-icon&quot;:&quot;cart&quot;,&quot;large-icon&quot;:&quot;none&quot;,&quot;large-text&quot;:&quot;Add to cart&quot;},&quot;in_stock_status_text&quot;:&quot;In stock&quot;,&quot;in_stock_with_quantity_status_text&quot;:&quot;_QTY_ in stock&quot;,&quot;in_stock_with_quantity_and_backorder_status_text&quot;:&quot;_QTY_ in stock (can be backordered)&quot;,&quot;out_of_stock_status_text&quot;:&quot;Out of stock&quot;,&quot;available_for_backorder_status_text&quot;:&quot;Available for backorder&quot;,&quot;select_variation_text&quot;:&quot;Please select a variation!&quot;,&quot;select_variation_all_options_text&quot;:&quot;Please select all options!&quot;,&quot;variation_not_available_text&quot;:&quot;Not available!&quot;}\" data-jtpt-data-table-configuration-json=\"{&quot;products_per_page&quot;:6,&quot;responsive_layout&quot;:true,&quot;responsive_content_display_default&quot;:false,&quot;paginate&quot;:true,&quot;paginate_info&quot;:true,&quot;paginate_info_text&quot;:&quot;Showing _START_ to _END_ of _TOTAL_ entries&quot;,&quot;paginate_scroll_to_top&quot;:false,&quot;products_not_found_text&quot;:&quot;Nothing found - sorry!&quot;,&quot;export_buttons&quot;:[&quot;csv&quot;,&quot;excel&quot;,&quot;pdf&quot;,&quot;print&quot;]}\" data-jtpt-woocommerce-settings-json=\"{&quot;currency_symbol&quot;:&quot;&#036;&quot;,&quot;currency_position&quot;:&quot;right&quot;,&quot;decimal_separator&quot;:&quot;.&quot;,&quot;thousand_separator&quot;:&quot;,&quot;,&quot;number_of_decimal&quot;:2,&quot;weight_unit&quot;:&quot;kg&quot;,&quot;dimension_unit&quot;:&quot;cm&quot;}\"><div class=\"jtpt-filter\"><div class=\"jtpt-filter-header\"><div class=\"jtpt-filter-header-left\"><div class=\"jtpt-mcheck\"><label><input type=\"checkbox\" class=\"jtpt-mcheck-checkbox\" name=\"jtpt-mcheck-checkbox\"><span class=\"jtpt-icon-in-before\">Select All<\/span><\/label><\/div><div class=\"jtpt-matc\"><a class=\"jtpt-matc-button jtpt-products-selection-needed\" href=\"#\" data-jtpt-selected-products=\"\" data-jtpt-selected-products-count=\"0\" role=\"button\"><i class=\"jtpt-icon jtpt-icon-shopping-cart\"><\/i>Add products to cart<\/a><\/div><\/div><div class=\"jtpt-filter-header-right\"><div class=\"jtpt-search\"><input type=\"text\" class=\"jtpt-search-input\" name=\"jtpt-search-input\" data-inserted-keyword=\"\" placeholder=\"Search...\"><span><i class=\"jtpt-icon jtpt-icon-search\"><\/i><\/span><\/div><div class=\"jtpt-ftrigger\"><a class=\"jtpt-ftrigger-button\" href=\"#\"><i class=\"jtpt-icon jtpt-icon-filter\"><\/i><\/a><\/div><\/div><\/div><div class=\"jtpt-filter-options-wrap jtpt-filter-show-default\"><div class=\"jtpt-filter-options\"><div class=\"jtpt-flabel\">Filter<\/div><div class=\"jtpt-taxonomy-filter\"><select class=\"jtpt-filter-select jtpt-filter-product_cat\" data-jtpt-taxonomy=\"product_cat\" multiple=\"multiple\" data-placeholder=\"Category\"><option value=\"19\">Accessories<\/option><option value=\"18\">Hoodies<\/option><option value=\"37\">Sweater<\/option><option value=\"17\">Tshirts<\/option><\/select><select class=\"jtpt-filter-select jtpt-filter-pa_color\" data-jtpt-taxonomy=\"pa_color\" multiple=\"multiple\" data-placeholder=\"Color\"><option value=\"40\">Beige<\/option><option value=\"22\">Blue<\/option><option value=\"28\">Gray<\/option><option value=\"23\">Green<\/option><option value=\"24\">Red<\/option><option value=\"29\">Yellow<\/option><\/select><select class=\"jtpt-filter-select jtpt-filter-pa_size\" data-jtpt-taxonomy=\"pa_size\" multiple=\"multiple\" data-placeholder=\"Size\"><option value=\"25\">Large<\/option><option value=\"26\">Medium<\/option><option value=\"27\">Small<\/option><\/select><div class=\"jtpt-freset\"><a class=\"jtpt-freset-button\" href=\"#\"><i class=\"jtpt-icon jtpt-icon-sync\"><\/i>Reset Filter<\/a><\/div><\/div><\/div><\/div><\/div><table class=\"jtpt-product-table jtpt-product-table-341\"><thead class=\"jtpt-head\"><tr class=\"jtpt-head-row\"><th class=\"jtpt-head-data jtpt-head-data-1 jtpt-no-sort\" data-priority=\"1\"><\/th><th class=\"jtpt-head-data jtpt-head-data-2 jtpt-no-sort\" data-priority=\"2\">Thumb<\/th><th class=\"jtpt-head-data jtpt-head-data-3\" data-priority=\"3\">Products<\/th><th class=\"jtpt-head-data jtpt-head-data-4\" data-priority=\"8\">Price<\/th><th class=\"jtpt-head-data jtpt-head-data-5 jtpt-no-sort\" data-priority=\"7\">Quantity<\/th><th class=\"jtpt-head-data jtpt-head-data-6 jtpt-no-sort\" data-priority=\"4\">Action<\/th><\/tr><\/thead><tbody class=\"jtpt-body\"><\/tbody><\/table><div class=\"jtpt-paginate\"><div class=\"jtpt-paginate-info\"><\/div><div class=\"jtpt-paginate-numbers\"><\/div><\/div><div class=\"jtpt-export\"><div class=\"jtpt-export-buttons\"><\/div><\/div><div id=\"jtpt-notices-popup\"><div class=\"jtpt-notices\"><\/div><\/div><div class=\"jtpt-overlay\"><i class=\"jtpt-icon jtpt-icon-spinner-light\"><\/i><\/div><\/div><div class=\"jtpt-product-table-loading jtpt-product-table-341-loading\"><i class=\"jtpt-icon jtpt-icon-spinner-light\"><\/i><\/div><!-- jtpt-product-table-341 end -->\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Filter through different attributes and search across the product table to find your desired product.<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-344","page","type-page","status-publish","hentry"],"blocksy_meta":[],"_links":{"self":[{"href":"https:\/\/theplugindemo.com\/justtables\/wp-json\/wp\/v2\/pages\/344","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/theplugindemo.com\/justtables\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/theplugindemo.com\/justtables\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/theplugindemo.com\/justtables\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/theplugindemo.com\/justtables\/wp-json\/wp\/v2\/comments?post=344"}],"version-history":[{"count":6,"href":"https:\/\/theplugindemo.com\/justtables\/wp-json\/wp\/v2\/pages\/344\/revisions"}],"predecessor-version":[{"id":547,"href":"https:\/\/theplugindemo.com\/justtables\/wp-json\/wp\/v2\/pages\/344\/revisions\/547"}],"wp:attachment":[{"href":"https:\/\/theplugindemo.com\/justtables\/wp-json\/wp\/v2\/media?parent=344"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}