Your module works fine except if we have terms with more than one word or special characters like accentuation.

For example, i have a term : "Prêt à porter". I use Isotope Filters with Dynamic display.
So my filter is : 

<a data-option-value=".Prêt à porter" href="#filter">Prêt à porter</a>

and my Isotope Content view :

<div data-category="porter" class="views-row views-row-1 views-row-odd views-row-first Prêt à porter element isotope-item" style="position: absolute; left: 0px; top: 0px; -moz-transform: translate(0px, 0px);"></div>

I make some modifications in isotope.module so this works in my case, but this won't work if we use multiple classes :

function template_preprocess_views_view_isotope(&$vars) {
  // inherit the normal unformatted classes.
  template_preprocess_views_view_unformatted($vars);
  // add the css.
  drupal_add_css(drupal_get_path('module', 'isotope') . '/css/isotope.css');

  // Clean classes
  ctools_include('cleanstring');
  foreach ($vars['classes'] as $key=>$rows_class)  {
    foreach ($rows_class as $key_row=>$row_class ) {
      $vars['classes'][$key][$key_row] = ctools_cleanstring($row_class, array('transliterate' => TRUE, 'lower case' => TRUE));
    }
  }

  // rebuild generated classes with cleaned classes
  foreach ($vars['classes'] as $key=>$row_class) {
    $vars['classes_array'][$key] = implode(' ', $vars['classes'][$key]);
  }
}
function template_preprocess_views_view_isotope_filter(&$vars) {
  // inherit the normal unformatted classes.
  template_preprocess_views_view_list($vars);

  ctools_include('cleanstring');
  // Rewrite each row with clean classes
  foreach ($vars['rows'] as $key=>$row) {
    $vars['rows'][$key] = preg_replace_callback(
      '|(data-option-value="[.#])([^"]*)"|',
      '_isotope_filter_cleanstring',
      $row
    );
  }

}

So i have now :
my filter : 

<a data-option-value=".pret-a-porter" href="#filter">Prêt à porter</a>

Isotope Content view :

<div data-category="pret-a-porter" class="views-row views-row-1 views-row-odd views-row-first pret-a-porter element isotope-item" style="position: absolute; left: 0px; top: 0px; -moz-transform: translate(0px, 0px);"></div>

Perhaps have you any ideas to make this works with more than one class ?

Comments

Greg Adams’s picture

Greg Adams commented

I haven't been working on this project lately but might start again within the next few weeks. It depends on a website I am currently making. I still don't know if I will use it for the page. Keep me updated if you find more issues or a fix for this.

kiwad’s picture

kiwad commented
Category: bug » support

You can make it work by using de tid in the data-category when you rewrite the field in the isotope-filters and rewrite the output of the field to also use the tid (display excluded) in the isotope-view

adam-delaney’s picture

adam-delaney commented

I have been experiencing this issue also. @kiwad Are hard-coding the filter values by tid when rewriting the output for the isotope filter.
i.e. data-option-value=".[tid]" Does this even work?

A better explanation of your filter would be helpful.

kiwad’s picture

kiwad commented

Hello Adam,

I have two views, 1st view has the format "isotope filter" :

in "fields", i'm using Content : Course type ; which is a field in my content type to choose the taxonomy (term reference, widget radio button). the output is rewritten like this :

<a href="#filter" data-option-value=".[field_course_type-tid]">[field_course_type]</a>

My 2nd view has the format "isotope view"

In my fields, I have once again Content : Course type which is excluded from display and rewritten like this :

[field_course_type-tid]

kiwad’s picture

kiwad commented
Issue summary: View changes

Forgot delete comment

jeckman’s picture

jeckman commented

The view described by kiwad in #4 works well for a single class, but doesn't enable filtering where each element is in more than one category.

The "data-category" in the Isotope content view seems to only pick up the first item, not a list of potential items

jeckman’s picture

jeckman commented

By changing the views-views-isotope-tpl.php you can make it output the multiple data-category items,

		<div class="<?php print $classes_array[$id]; ?> element" data-category="<?php 
/*					$txt=$classes_array[$id]; 
$out=preg_split('/\s+/',trim($txt)); 
echo $out[count($out)-1]; */
			print $classes_array[$id]; 
			?>">
<?php print $row;?></div>

Commenting out the code that seems to grab only one item from the classes array and outputting them all results in data-category="25 26" for example (where those are tids).

But the jquery still seems to find only the first one. Maybe isotope itself doesn't support filtering on multiple categories?

jeckman’s picture

jeckman commented

Actually (responding to myself) it wasn't an Isotope issue but a data issue - if you get the right data categories in the view's fields, the jquery filtering stuff does work, FWIW