title: Jquery Isotope filtering with database
body: <p>I am trying to get Metafizzy's Isotope plugin working. This is the set up I have, except I am pulling in the container items from a sql database - <a href="http://jsfiddle.net/trewknowledge/jJZEN/" rel="nofollow">http://jsfiddle.net/trewknowledge/jJZEN/</a></p>
  
  <p>Can anyone help me figure out why its not working?</p>
  
  <p>This is the code I am using </p>
  
  <p><strong>JavaScript</strong></p>
  
  <pre><code>    //Load all items straight away
      $(document).ready(function(){  
          showEntries('*');
      });  
  
      //Isotope filter
      function filterEntries() {
          var $container = $('#entries');
             $select = $('#filters select');
  
          $container.isotope({
              itemSelector: '.item'
          });
  
          $select.change(function() {
              var filters = $(this).val();
              $('.active').removeClass('active');
              if (filters != '.item') {
                  $( filters).addClass('active');
              }
              $container.isotope({
                  filter: filters
              });
          });
  
      };
  
  
      //Pull in data from database
      function showEntries(str) {
  
          if (str=="") {
              document.getElementById("entries").innerHTML="";
              return;
          }
          if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
              xmlhttp=new XMLHttpRequest(); 
          }
          else {// code for IE6, IE5
              xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
          }
              xmlhttp.onreadystatechange=function() {
                  if (xmlhttp.readyState==4 &amp;&amp; xmlhttp.status==200) {
  
                      document.getElementById("entries").innerHTML=xmlhttp.responseText;
  
                  }
          }
              xmlhttp.open("POST","&lt;?php bloginfo('template_url'); ?&gt;/getentries.php?q="+str,true);
              xmlhttp.send();
  
              //Fire filter function
              filterEntries();
          }
  &lt;/script&gt;
  </code></pre>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;section id="filters"&gt;
        &lt;select name="entries" onchange="showEntries(this.value)"&gt;
          &lt;option value="*"&gt;show all&lt;/option&gt;
          &lt;option value=".item323" &gt;323&lt;/option&gt;
          &lt;option value=".item266" &gt;266&lt;/option&gt;
          &lt;option value=".item277" &gt;277&lt;/option&gt;
          &lt;option value=".item289" &gt;289&lt;/option&gt;
        &lt;/select&gt;
  &lt;/section&gt; &lt;!-- #filters --&gt;
  
  &lt;div id="entries" class="clearfix"&gt;
  
  &lt;/div&gt;&lt;!--entries--&gt;
  </code></pre>
  
  <p><strong>PHP</strong></p>
  
  <pre><code>    $q=$_GET["q"];
  
      //Remove the '.item' before the cat id
      $q= ltrim ($q,'.item');
  
      $con = mysql_connect("localhost", "root", "root");
      if (!$con) {
          die('Could not connect: ' . mysql_error());
      }
  
      mysql_select_db("awards", $con);
  
      if ($q === "all" || $q === "*" ) {
          //Show all entries that have status registered if all is selected
          $sql="SELECT * FROM entry WHERE  status = 'registered'";
      } else {    
          //Else just show category entries of people who are registered
          $sql="SELECT * FROM entry WHERE awards_subcategory_id = '".$q."' &amp;&amp; status = 'registered'";
      }
      $result = mysql_query($sql);
  
  
      while($row = mysql_fetch_array($result)) {
  
          print "&lt;div class='item item$q'&gt;";
          print '&lt;img class="image" src="http://localhost:8888/awardsite/wp-content/themes/award/placeholder.jpg" /&gt;';
          print "&lt;p class='studio'&gt; Studio: " . $row['studio'] . "&lt;/p&gt;";
          print "&lt;p class='client'&gt; Client: " . $row['client'] . "&lt;/p&gt;";
          print "&lt;p class='description'&gt; Description: " . $row['description'] . "&lt;/p&gt;";
          print "&lt;p class='solutionprocess'&gt; Solution Process: " . $row['solution_process'] . "&lt;/p&gt;";
          print "&lt;/div&gt;";
  
      }
  
  
      mysql_close($con);
  </code></pre>