Databases
StackOverflow2013
Postsdbo
POcomplex filter in jquery
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POcomplex filter in jquery
    primarykey
    data
    text
    <p>I have a list of products I am displaying and I am currently working on a filtering function that does not use ajax.</p> <p>Every product has a series of classes attached to it based on a category it falls under. So like this:</p> <pre><code>&lt;li class="f_all f_cat1 f_cat2"&gt;Product 1&lt;/li&gt; &lt;li class="f_all f_cat1 f_cat3 f_cat_4"&gt;Product 2&lt;/li&gt; &lt;li class="f_all f_cat4 f_cat5 f_cat6"&gt;Product 3&lt;/li&gt; </code></pre> <p>This means that many products fall under the same category.</p> <p>These are the filter options:</p> <pre><code>&lt;table cellspacing="10"&gt; &lt;tr&gt; &lt;td class="item" id="p_1"&gt;Category 1&lt;/td&gt; &lt;td class="item" id="p_2"&gt;Category 2&lt;/td&gt; &lt;td class="item" id="p_3"&gt;Category 3&lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; </code></pre> <p>I have a basic filter working so far, that allows me to filter based on a single category, that looks like this:</p> <pre><code>function filterProd(filter){ $(".f_all").hide(); // first hide all products $(".f_"+filter).show(); // show products only for this category } </code></pre> <p>Then the click function:</p> <pre><code>$("#p_1").click(function(){filterProd("cat1");}); $("#p_2").click(function(){filterProd("cat2");}); $("#p_3").click(function(){filterProd("cat3");}); </code></pre> <p>I know that this is not the ideal way to do this but i'm just looking for a little guidance.</p> <p>I am trying to achieve 2 things after this:</p> <p><li>When the option is clicked AGAIN, remove that filter from the function</li> <li>When another option is clicked, ADD it to the filter</li></p> <p>I am assuming a function of sorts that accepts an array of values etc, but i'm fairly new to jquery and would appreciate any help i can get at this point.</p>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USdangermark
    1. USdangermark
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POcomplex filter in jquery
      1. This table or related slice is empty.
      1. VTUpMod
    2. VO
      singulars
      1. POcomplex filter in jquery
      1. This table or related slice is empty.
      1. VTUpMod
    3. VO
      singulars
      1. POcomplex filter in jquery
      1. This table or related slice is empty.
      1. VTUpMod
    1. COI have just edited this as i realised i had made a couple of mistakes which may of made the question slightly confusing.
      singulars
      1. POcomplex filter in jquery
      1. USdangermark
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload