check this (sorry, some parts are in russian)
http://yoga.u4388.citrine.vps-private.net/blogs

the first exposed select is Filter, the second one is Sort.

using exposed Filter, the ajax is working. Using exposed Sort, it doesn't.

I'm doing something bad?

thank u and sorry for my english.

CommentFileSizeAuthor
#140 ajax_doesnt_work_with-1268150-140-missing.patch1.04 KBjoelpittet
#132 ajax_doesnt_work_with-1268150-132.patch11.37 KBjoelpittet
#124 better_exposed_filters-links-ajax-1268150-124.patch8.88 KBtostinni
#121 better_exposed_filters-links-ajax-1268150-121.patch8.88 KBmarkabur
#114 better_exposed_filters-links-ajax-1268150-114.patch8.88 KBquotesBro
#102 better_exposed_filters-links-ajax-1268150-102.patch8.86 KBdrupal_was_my_past
#101 better_exposed_filters-links-ajax-1268150-101.patch8 KBdrupal_was_my_past
#99 better_exposed_filters-links-ajax-1268150-99.patch8.69 KBalcroito
#92 better_exposed_filters-links_AJAX-1268150-92.patch7.99 KBberliner
#82 filter_links_ajax.patch4.69 KBalcroito
#81 better_exposed_filters-links_AJAX-1268150-81.patch3.23 KBberliner
#80 better_exposed_filters-links_AJAX-1268150-80.patch3.2 KBberliner
#77 better_exposed_filters-links_AJAX-1268150-77.patch3.92 KBjeffschuler
#77 interdiff.txt1.11 KBjeffschuler
#76 better_exposed_filters-links_AJAX-1268150-76.patch2.96 KBjeffschuler
#59 better_exposed_filters-1268150-59-ajax-select-as-links.patch13.58 KBtostinni
#55 better_exposed_filters-1268150-55-ajax-select-as-links.patch13.53 KBgapple
#54 better_exposed_filters-1268150-54-ajax-select-as-links.patch13.45 KBgapple
#53 better_exposed_filters-1268150-53-ajax-select-as-links.patch13.68 KBgapple
#46 bef_select_as_links-1268150-46.patch2.91 KBLiam McDermott
#41 bef_select_as_links-1268150-41.patch3 KBPapaGrande
#37 1268150_ajax_bef_links_36.patch3.44 KBleschekfm
#35 1268150_ajax_bef_links_35.patch2.69 KBHydra
#34 1268150_ajax_bef_links_34.patch2.53 KBdawehner
#33 1268150_ajax_bef_links_32.patch2.52 KBHydra
#26 1268150_ajax_bef_links_26.patch2.46 KBslashrsm
#24 bef_select_as_links-1268150-24.patch2.36 KBtrogels
#20 bef_select_as_links-1268150-20.patch2.4 KBAnonymous (not verified)
#19 bef_exposed_filters_links-1268150-19.png110.38 KBAnonymous (not verified)
#10 select-as-links-ajax-enabled-1268150.patch2.38 KBleschekfm
#8 select-as-links-ajax-enabled-1268150.patch2.27 KBleschekfm
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

jonathanmd’s picture

I'm also having this problem. When filters are set as links and ajax is enabled clicking a link fires off a new page reload instead of an ajax update of my view.

mikeker’s picture

Assigned: Unassigned » mikeker
Status: Active » Postponed

The Links option is not going to be compatible with AJAX refreshes as this is the difference between a GET and a POST. (See #1137720, as well). In short, we can't easily stack up all the clicks and wait until the user hits the Apply button before sending them off to Views.

It may be possible to wire the links to work with the Autosubmit option, but that's going to require a patch for CTools. In that case, since we'd be reacting on a single filter change, it could work with AJAX updating of the results.

I can look into that once we've sorted out the GET vs. POST issue.

doom_fist’s picture

Very interested in this possibility - subscribing.

rickmanelius’s picture

I'm also interested because when you use link formatting within a quicktabs block, it breaks. Kindof a bummer.

rickmanelius’s picture

Question: could we simply convert these from anchor 'a' links to 'button' html tags? They can still be themed to look like normal anchor tags, but be a form submit versus a link and thus getting around the post/get issue.

Regardless, I'm going to have to come up with a work around as I'm not sure I'll have enough client time to tackle this one. But if there is an easy fix, I'm all ears.

leex’s picture

Rick I think some mobile browsers might treat the button element in a different way causing annoying styling issues, but I like your thinking.

rickmanelius’s picture

Hey Leex. I know there are some CSS libraries that strip all browser specific styling and then allow for a uniform look and feel across all browsers. Sexybuttons comes to mind as one of them.

I already found a different solution around this. But I think this could still be a great solution if it could be implemented!

leschekfm’s picture

Status: Postponed » Needs review
FileSize
2.27 KB

Hi,
I made a temporary solution for the ajax problem.
In the theming function I not only print out the links but also the normal select list. When a link is hit the same value is set inside the select list. The page load is prevented but the ajax request is triggered.
At this point of development it is mandatory to uncheck the autosubmit option.

This is a very ugly hack but it works. Nonetheless not that bad for just an hour of work.

Please test the patch.

Status: Needs review » Needs work

The last submitted patch, select-as-links-ajax-enabled-1268150.patch, failed testing.

leschekfm’s picture

Hm, the netbeans git integration seems to use an old patch style. So I made a new patch manually.

leschekfm’s picture

Status: Needs work » Needs review

Status: Needs review » Needs work

The last submitted patch, select-as-links-ajax-enabled-1268150.patch, failed testing.

leschekfm’s picture

Can anybody point me in the right direction, where to find information on how to change the patch format or at least to verify which patch format I'm using? The only info I could find on this is that the -p0 format isn't supported any more.

joachim desarmenien’s picture

Hello,

did you get this working
i'm trying to get it working, but i can't
the patch does not work
could you send / host the patched module , so i can test it

thank you very much

leschekfm’s picture

Version: 7.x-3.0-beta1 » 7.x-3.x-dev

Sorry i forgot to mention that the patch is against dev...

joachim desarmenien’s picture

Thanks, it works

Danny Englander’s picture

#12 says the patch failed testing. How do I know I can use it then? Thanks.

leschekfm’s picture

As the error message states the patch probably failed testing because of the patch format used. I would change it but don't know how to do it. Nonetheless this shouldn't be a problem.

How do I know I can use it then?

A hint could be that joachim desarmenien said that it solved the problem for him.
Furthermore you could for example try to apply it and see if it works ;)

If you want to know if you should use this on a production site have a look at #8

Please give feedback if it works for you.

Anonymous’s picture

It works for filters that have been set as links, but stops exposed sorts from working.

See attached screenshot.

Anonymous’s picture

This patch modifies the patch in #10 to only hide the SELECT tags that are inside .bef-select-as-links.

Anonymous’s picture

Status: Needs work » Needs review

/me forgot to change issue status

lsolesen’s picture

I tried your patch both to 3.x-dev and directly on the git repository, but could not apply it. Could you reroll it?

wzoom’s picture

@Brian Altenhofel Your patch works like a charm (3.x-dev)! Thank you.

trogels’s picture

Version: 7.x-3.x-dev » 7.x-3.0-beta1
Assigned: mikeker » Unassigned
FileSize
2.36 KB

rerolling patch to 7.x-3.0-beta1

slashrsm’s picture

Status: Needs review » Reviewed & tested by the community

Confirming that it works. I think we can call this RTBC.

slashrsm’s picture

Status: Reviewed & tested by the community » Needs review
FileSize
2.46 KB

Hm... lets rather hide submit button in a way that leaves throbber visible. It is much better from UX aspect.

slashrsm’s picture

Version: 7.x-3.0-beta1 » 7.x-3.x-dev
aquariumtap’s picture

I applied the patch in #26. The submit button is hidden, but I'm redirected to my homepage when I click any of the links.

I'm running b.e.f. 7.x-3.x-dev, views 7.x-3.3. Does this ring a bell?

aquariumtap’s picture

Ajax filters are working for me with the patch from #26!

Please disregard my previous post -- my issue was not related to better exposed filters. My view was loaded as a content pane. Once I set "Use panel path" to yes, the form was properly configured and I was no longer redirected. For anyone else reading this with the same issue, see #215927: A view with exposed filters inside a panel for more info.

JonMcL’s picture

It looks like the current DEV, 7.x-3.0-beta1+33-dev, breaks this patch. I'm successfully using it with 7.x-3.0-beta1+29-dev.

mikeker’s picture

Title: Ajax doesnt work with BEF Sort Links » Ajax doesnt work with BEF Links
Status: Needs review » Needs work

Thanks to everyone working on this issue! (Adjusting the title as this impacts all select-as-link options).

I like the idea of using a sidecar element, but I'm concerned about using a select element for cases where Javascript is not enabled. In those cases, the user will get both a select element and a list of links. Can we do this with a hidden element instead?

I haven't had much time to give to the BEF issue queue recently -- and I apologize for that -- if anyone is able to reroll this patch using a hidden form element, it would be much appreciated. Otherwise, I'll get to it as soon as I can...

Hydra’s picture

Status: Needs work » Needs review

Well here is a reroll of the patch in #26. As far as I can tell, it Doe's not fix the problem. I'm using a BEF with links to filter trough taxonomy terms on nodes. Select works just fine, but links don't even use ajax. This patch adds something ajaxlike to the links, but this is not working yet.

Hydra’s picture

Yeah, forgot the patch :P

dawehner’s picture

So the actual problem seems to be that the ajax submit has the following post data:

tid 4
tid All
view_...

so at the end views only sees $_POST['tid'] == 'All' even the tid = 4 link got clicked.

I'm not really sure what causes this behavior but it might be related to the way links in a 'get' form acts.

This patch just did some general cleanup of the patch.

Hydra’s picture

Okay, this was a good clue, thanks dawehner! The tid value in $_POST came from a hidden input field. Of course when we use ajax, we have to adjust the value onclick. This patch should do the job.

mikeker’s picture

Status: Needs review » Needs work

One problem: this patch hides the submit button on non-AJAX-enabled views.

leschekfm’s picture

I rerolled the patch against the latest dev and removed the obsolete hiding of the submit button.

Please review :)

leschekfm’s picture

Status: Needs work » Needs review
drewish’s picture

Shouldn't better_exposed_filters_exposed_form_plugin be using #attached to put the JS on the form?

Ludo.R’s picture

#37 patch works fine!

Indeed, I think it is better to use #attached than drupal_add_js() :

$form['#attached']['js'][] = drupal_get_path('module', 'better_exposed_filters') . '/better_exposed_filters.js';
PapaGrande’s picture

#37 worked for me so I rerolled it with @dolu's and @drewish's suggestions about using #attached.

klucid’s picture

Patch in #41 worked for me! Thank you!

carwin’s picture

Works here as well, thank you for the re-roll @PapaGrande

leschekfm’s picture

Status: Needs review » Reviewed & tested by the community

I think this is patch is finally ready.

ticaasd’s picture

First i need to say that im new to drupal world but i it was love at first sight!(i may no't know the best way to use to use things)

i think my solution is better the #41 will give bugs if u use more then one filter of this type and it dosen;t include support for multiple options
my version adds a class "selected" to the links that are selected so you can css them like you should

as i mentioned im new in drupal and i don't know how to upload pach files and things i will recreate it manualy so some1 please appaly this pach and share it with others


+++ b/better_exposed_filters.js

 
     }                   // attach: function() {
   };                    // Drupal.behaviors.better_exposed_filters = {
+  

+  Drupal.behaviors.better_exposed_filters_select_as_links = {
+    attach: function(context,settings) {   
+      console.log($(settings));
+      $.each(Drupal.settings.better_exposed_filters.bef_links, function(i, sliderDefaults) {
+    if(!$("#" + sliderDefaults.viewId + " #edit-"+i+"-wrapper").length){
+           i=i.replace(/_/g,"-");
+        }     
+       $("#" + sliderDefaults.viewId + " #edit-"+i+"-wrapper").once(function() {  
+          sliderDefaults.options = $(this).find('select option'); 
+          
+          $(this).find('.form-type-bef-link a').each(function(key,link){           
+            $(sliderDefaults.options).each(function(key,option ){           
+              if($(option).text()==$(link).text()&&$(option).attr('selected')){
+                $(link).addClass('selected');
+              }
+            });
+            
+            $(link).click(function(event) {
+              console.log(sliderDefaults.options);
+              event.preventDefault();
+              text = $(link).text();
+              if(!sliderDefaults.multiple){
+                $(sliderDefaults.options).removeAttr('selected');
+                console.log( $(sliderDefaults.options));
+              }
+                console.log('filter');
+              sliderDefaults.options.filter(function() { 
+                if(!sliderDefaults.multiple){
+                 if($(this).text() == text)
+                   {console.log($(this));
+                  return true;  
+                 }return false;
+                }
+                  
+                if( $(this).text() == text){
+                  if(!$(this).attr('selected')){
+                    return true;
+                  }
+                  $(this).removeAttr('selected');
+                }
+                return false;
+           
+              }).attr('selected', 'true');
+               
+            // submit the form
+              $('.views-exposed-widgets .views-submit-button input').click();
+            });
+          })
+          
+        });
+      })
+    }
+   
+  };
 
   /*
    * Helper functions

+++ b/better_exposed_filters.theme

   );
 
   return '<div class="bef-select-as-links">'
+    . theme('select', array('element' => $vars['element']))
     . theme('form_element', array('element' => $properties))
     . '</div>';
 }

+++ b/better_exposed_filters_exposed_form_plugin.inc

         case 'bef_links':
           $show_apply = TRUE;
-
+        $data = array(
+              'bef_links' => array(
+                  $field_id => array(
+                      'multiple' =>!empty($form[$field_id]['#multiple']),
+                      'id' => $field_id,
+                      'viewId' => $form['#id'],
+                  ),
+              ),
+          );
+          $form[$field_id]['#attached']['js'][] = array('data' => array('better_exposed_filters' =>$data), 'type' => 'setting');
+          drupal_add_js(drupal_get_path('module', 'better_exposed_filters') . '/better_exposed_filters.js');
           $form[$field_id]['#theme'] = 'select_as_links';
           break;

this was inspired from the bef slider plugin, as far i have tested it, it works fine with no bugs or error
but id didn't test it on your project and i only tryed with multiple fields and allow multiple values

Liam McDermott’s picture

Status: Reviewed & tested by the community » Needs review
FileSize
2.91 KB

Attached is a re-roll of #41, I also took the liberty of changing the Javascript function name to camel case, so it matches the other function names.

Completely untested, so changing the status back to needs review.

Also, sorry #45, I'm not sure what your requirements are and am in a bit of hurry to get a working patch, so I just grabbed #41. :)

fizk’s picture

Status: Needs review » Needs work

Liam, #46 didn't seem to work for me (ajax still doesn't occur).

shawngo’s picture

#41 worked on my machine ;)

ChrisSnyder’s picture

I have the same issue. I tried patch #41 without luck. I'm wondering if it didn't work because I am using links for the sorts.

jiakomo’s picture

Using patch #41, I encountered this problem: when there are two BEF with links on the same page, the filtering in the second view does not work correctly. When there is only one of them, it works as expected.
Can anyone else confirm that #41 with two BEF links creates a problem?

deanflory’s picture

I found that updating to the latest dev either created a javascript error or maybe it's the mentioned Better Exposed Filters incompatibility, but once updated it caused all AJAX toggle-downs/collapsible/collapsed containers to stop working, thus making it unusable. I did not test it with any filters so there's a problem without any filter in place.

AaronBauman’s picture

latest patch causes BEF links to not work at all.

i have a single view with page display, and exposed filters on content type, node ref, and a boolean field.

clicking the BEF links for node ref and content type does nothing. the filter is not applied.
clicking the BEF link for the boolean field causes the view results to disappear, and on reloading the page a "illegal choice" error message appears.

opening the BEF links in a new browser tab correctly applies the filters, so it's definitely an issue with the patch and not my config.

gapple’s picture

Status: Needs work » Needs review
FileSize
13.68 KB

Here's a patch that utilizes hidden elements to store the state of the links, based on 7.x-3.0-beta3. Hopefully it's not too difficult to port the patch to the latest dev release.

This improves the behaviour of the links even without AJAX (but with Javascript still enabled), as it allows a user toggle several items without a new page loading, and then submit the resulting state only once.
Auto-submit is also supported, with the view being updated via AJAX after each click on a link.

I required #1240238: Let use toggle links on the exposed form sorts for my project, so this patch also includes changes for that issue, with a couple additional fixes.

gapple’s picture

A small update to the patch in #53 with some refactoring of the Javascript.

gapple’s picture

Oops. Made one bad change in #54, so ignore that patch and use this one.

AaronBauman’s picture

Status: Needs review » Needs work

#46 doesn't work.
Since the select input elements are still rendered with conflicting name attributes, they're probably interfering.
Not sure if this is the only issue, but it's definitely one of them.

Gapple: please do not derail this issue by combining it with #1240238

csuggs4’s picture

I got this working with without BEF in Drupal 7.22 with Views 3.7. I described it here: https://drupal.org/node/1111712#comment-7370826

I noticed this issue thread afterwards, thought it might be helpful. I have autosubmit turned on and am using CSS:

.views-widget-filter-type_1 {
  display: none;
}
doliveros’s picture

#55 worked for me, after fixing a JS bit.

You shouldn't be using .prop, as it is unsupported on the default jQuery library packed with Drupal. After changing all the .prop to .attr's, it worked quite well.

Edit: I also had to replace line 129: $hiddenElement = $('#' + ($setWrapper.parent().attr('id')) + '-hidden');to $hiddenElement = $('#' + ($setWrapper.closest('.views-exposed-widget').attr('id').replace('-wrapper', '')) + '-hidden');

tostinni’s picture

Here is the patch from #55 including the changes from #58.
It works nicely for me, thanks a lot everyone.

deanflory’s picture

What version is that patch for? I tried applying the #59 on the latest 7.x-3.x-dev (2013-Feb-25) and 3 out of 7 hunks failed as shown below:

Hunk #1 FAILED at 83.
Hunk #2 succeeded at 246 with fuzz 2 (offset 148 lines).
1 out of 2 hunks FAILED -- saving rejects to file better_exposed_filters.js.rej
patching file better_exposed_filters.theme
Hunk #1 FAILED at 445.
Hunk #2 FAILED at 473.
Hunk #3 succeeded at 605 (offset 61 lines).
2 out of 3 hunks FAILED -- saving rejects to file better_exposed_filters.theme.rej
patching file better_exposed_filters_exposed_form_plugin.inc
Hunk #1 succeeded at 72 (offset 1 line).
Hunk #2 succeeded at 567 with fuzz 2 (offset 170 lines).
Hunk #3 FAILED at 581.
Hunk #4 FAILED at 597.
Hunk #5 succeeded at 649 with fuzz 2 (offset 177 lines).
Hunk #6 succeeded at 666 with fuzz 2 (offset 178 lines).
Hunk #7 FAILED at 929.
3 out of 7 hunks FAILED -- saving rejects to file better_exposed_filters_exposed_form_plugin.inc.rej

tostinni’s picture

Version: 7.x-3.x-dev » 7.x-3.0-beta3

Ups, sorry I forgot the version, I made it against 7.x-3.0-beta3.

FNGR’s picture

#59 works for me! big thanks

elopez2389’s picture

Status: Needs work » Needs review

#26: 1268150_ajax_bef_links_26.patch queued for re-testing.

elopez2389’s picture

Status: Needs review » Needs work

#59 worked.

For those who are unsure how to patch a module here is a good video that shows you how to do it on a mac http://www.youtube.com/watch?v=J-Db5DbCI80. Make sure you install git from https://code.google.com/p/git-osx-installer/.

alaa abbad’s picture

Status: Needs work » Needs review
hawasha’s picture

Worked for me - thanks a lot.

Renee S’s picture

This patch (#59) worked for me. Thanks, Liam McDermott, gapple, tostinin, et al!

regan.dawson@gmail.com’s picture

Status: Needs review » Reviewed & tested by the community

New to Drupal so not sure about patching etc, when would you expect this patch to make it into the main code?

voj’s picture

Hi, #59 worked for me :)

But I do have a suggestion before porting it onto the code, I suggest adding jQuery(trigger) events before and after loading the content of the ajax, so that anyone who uses javascript effects for the view, they can 'refresh' the effects codes for the new ajax elements.

markconroy’s picture

Hi Guys,

Looking forward to this patch making it to the main views module. In the mean time, I have solved this issue today by doing the following:

1) Select Better Exposed Filters
2) Under BEF Settings, select checkboxes/radio buttons
3) Add some CSS to hide the radio button circles and style your filters

Now, it's not "links" but it functions the same.

Sample CSS:

.bef-select-as-radios .form-radio {
    display: none;
}

.bef-select-as-radios .form-item {
    display: inline-block;
    color: #ff0000;
    margin-right: 10px;
}


.bef-select-as-radios .form-item:hover, .bef-select-as-radios .form-item:focus {
    	color: #ffff00;
    	cursor: pointer;
    }

For posterity, I have also posted this as a blog post here.

alanpeart’s picture

Beautiful workaround! I really love "simple" tricks like this. Thanks man.

tropicfruit’s picture

Nice Solution. Thought of that too in the first place. But then got "distracted" by the links/buttons route :)

Thanks for sharing.

tropicfruit’s picture

Just played with this a little.

The CSS regarding the cursor didn't work in my case when setting it on the parent DIV. When setting it directly on the label it works.

.bef-select-as-radios .form-item label{
	cursor: pointer;
}

Now I only need a solution to set an active state on the links. Tried it with this jQuery snippet:

$('.bef-select-as-radios .form-item').click(function(){
	// remove class 'active' on current active item
	$('.bef-select-as-radios .form-item.active').removeClass('active');
	// add class 'active' on clicked item
	$(this).addClass('active');
});

But as Views rerenders the block, the "clicked item" and the added class get exchanged.

Any suggestions on how to set/preserve an active state?

UPDATE:
This snippet should do the trick:

$(document).ajaxComplete(function(){
	$('.bef-select-as-radios label.active').removeClass('active');
	$('.bef-select-as-radios.form-radio').each(function(){
		if( $(this).attr( "checked" ) ){
			$(this).next('label').addClass('active');
		}
	});
});
bsarchive’s picture

Have a look at http://viralpatel.net/blogs/css-radio-button-checkbox-background/ for an alternative CSS-based approach that works really well, including styling for the selected radio button.

tropicfruit’s picture

@bsarchive Nice approach.

jeffschuler’s picture

Version: 7.x-3.0-beta3 » 7.x-3.x-dev
Status: Reviewed & tested by the community » Needs review
FileSize
2.96 KB

It looks like this issue has gotten a bit derailed.

The patch in #59 is based on #53-#55, which unnecessarily included a patch from another issue that is not applicable here, (as @aaronbauman noted in #56.)

Before that, #41 appeared to be working, then #46 was an untested change only to the JS theme function name, which broke things.

This patch is therefore a re-roll of #41 -- against 7.x-3.x-dev, (where patches should always be applied.)

It's working for me, though I'm not sure about the point behind re-displaying the filter also as a select list. Setting back to Needs Review.

jeffschuler’s picture

Ah.

Uncaught TypeError: Cannot read property 'datepicker' of undefined

Was stopping JS execution and not running the new script.

I added a couple tests to see if Drupal.settings.better_exposed_filters exists before checking a property inside it. (Maybe since we're attaching the JS out-of-order of where it used to be, Drupal.settings.better_exposed_filters doesn't yet exist?)

skyredwang’s picture

Status: Needs review » Needs work

#77 patch doesn't apply

jeffschuler’s picture

Maybe better put, the patch no longer applies.

Looks like commit 821fea3 (#1841452: Javascript error: Uncaught TypeError: Object #<Object> has no method 'datepicker') may have fixed the datepicker check I added in #77. That piece of the patch no longer applies. Maybe we should follow the same format for the slider check. Still needs a reroll and retest.

berliner’s picture

Status: Needs work » Needs review
FileSize
3.2 KB

Patch #76 still applies. The javascript error Uncaught TypeError: Cannot read property 'datepicker' of undefined is indeed caused by a missing Drupal.settings.better_exposed_filters. The fix is easer then proposed in #77. It is sufficient to add

  case 'bef_links':
+   $bef_add_js = TRUE;
    $form['sort_bef_combine']['#theme'] = 'select_as_links';

in better_exposed_filters_exposed_form_plugin.inc

I have updated the patch #76 accordingly.

berliner’s picture

Small update that is not necessarily related to this issue but still useful in some tweaking contexts. E.g. I'm currently working on MEFIBS - More exposed forms in blocks and I noticed the following:

+  // This is only needed to provide ajax functionality
+  Drupal.behaviors.better_exposed_filters_select_as_links = {
+    attach: function(context) {
+
+      $('.bef-select-as-links', context).once(function() {
+        var $widgets = $('.views-exposed-widgets');     <-- get all exposed forms on the page
+        // Hide the actual form elements from the user.
+        $widgets.find('.bef-select-as-links select').hide();
+        var $options = $('.bef-select-as-links select option');
+        $(this).find('a').click(function(event) {
+          // We have to prevent the page load triggered by the links.
+          event.preventDefault();
+          event.stopPropagation();
+          var text = $(this).text();
+          // Set the corresponding option inside the select element
+          $options.filter(function() {
+            return $(this).text() == text;
+          }).attr('selected', true);
+          $('.bef-new-value').val($options.filter(':selected').val());
+
+          // Submit the form.
+          $widgets.find('.views-submit-button input').click();   <-- submit each forms, though only one link has been clicked
+        });
+      });
+    }
+  };

The code actually grabs all exposed forms on the page, and once a select link has been clicked it submits each one of them. This is a problem for multiple BEF exposed forms, but also for my custom one. In general it should only submit the form that is currently clicked in.

alcroito’s picture

Issue summary: View changes
FileSize
4.69 KB

Inspired by berliner's #81 patch, I've rewritten a patch against the stable version of the module 7.x-3.0-beta3, which might be of use to someone.

Two more notes:
1) The javascript is rewritten a bit to reuse jQuery selectors, and make multiple exposed link groups to work correctly.
2) A rather un-clean way of always adding the javascript wherever the BEF filter is used. This was done because the stable version didn't have the $bef_add_js variable.

vibrasphere’s picture

I'm new to this. But none of these work. After applying last 3 patches the BEF links don't work at all now. Simply clicking on them nothing happens.

Also I was looking for solution to make Views Quicksand work with BEF Links, but looks like not possible.

Argus’s picture

Tested #82 and it works fine.

AaronBauman’s picture

None of these patches address *exposed sort* with ajax.

jlenni’s picture

Tested #82 and it works. Thanks Placinta!

Cyberschorsch’s picture

Also confirming that #82 is working

berliner’s picture

#82 is for the 7.x-3.0-beta3.
We should focus on 7.x-3.0-dev and get the patches from #77, #80 or #81 ready and committed.
If anyone could test those and give feedback that would probably be more helpful than testing against the current beta.

Daniel Wentsch’s picture

#82 almost brought the needed functionality, thanks for that.

One issue remains, though: the currently active bef link (or its parent) doesn't get a selected class assigned, which makes theming impossible. Without AJAX there's a selected class for the currently active parent div, with AJAX the active class is always on the first option ("-All-" in my case).

Any ideas?

Update:
putting this inside $this.find('a').click(function (event) { brought the selected classes.

// Remove all selected classes
$('.bef-select-as-links').find('.selected').removeClass('selected');
// Add selected classes to active element
$(this).parent().addClass('selected');

Not a very elegant solution. If there are multiple select-as-links filters on a page it will probably remove the selected classes from all of them. To avoid this we could also use $(this).parent().parent().find('.selected').removeClass('selected');, which looks even uglier.

sahaj’s picture

I have applied patch #82 and added code from #89 (thanks to both Placinta and Daniel), but I'm facing a new issue when clicking on a sequence of links as it don't work properly without clicking on the '- Any -' option between 2 other links.

Not sure if my explanation is clear enough, but here is an example: http://chaikhana.bodhi3.com/en/destinations. Try to click on any link (Define by Type block in the right sidebar) as 'Peaks' and then 'Glaciers' and you should be able to understand what I mean.

Any idea how to solve this?

tomdisher’s picture

I can confirm that #82 worked for me. Thanks!

berliner’s picture

I have taken the time to rework the last patches (basically #81 with additions from #82 and #89), adding support for active classes and making sure, that javascript handling of clicked links are only attached to the links, when ajax is actually enabled for the given view.

This patch is against the dev branch (as all patches in this issue should be.

Please stop reviewing the patch from #82, as this is no code that can be easily merged into the dev branch. So if you need working ajax with bef links, you should take the time to review the patches against dev, so that we can at some point mark this issue RTBC.

I'm not sure what the following code is used for:

  if (!empty($element['#value'])) {
    if (is_array($element['#value'])) {
      foreach ($element['#value'] as $value) {
        $output .= '<input type="hidden" class="bef-new-value" name="' . $name . '[]" value="' . $value . '" />';
      }
    }
    else {
      $output .= '<input type="hidden" class="bef-new-value" name="' . $name . '" value="' . $element['#value'] . '" />';
    }
  }
nnevill’s picture

Patch above doesn't work with the latest 7.x-3.0-beta4 release (I know it should work with dev branch) but patch from 82nd comment works ok with 3.0-beta4. But it should be applied manually. If you don't want to hack module you can easily redefine theme_select_as_links() fucntion in your template.php and and "better_exposed_filters_select_as_links" behaviour in theme based js file and it works like a charm :)

alcroito’s picture

Tested patch #92 against beta4, seemed to work fine. Tested only select links for taxonomies via ajax, which worked.

akkonrad’s picture

I've tried #92 and it was seems to work; then after some work with project it stopped to work - nothing happens now at all, except the links gets active class correctly after click. I don't have any errors thrown to firebug console. I regret that didn't exported view and module at the point when it was working well...

rei’s picture

tested patch #92 against 7.x-3.0-beta4+6-dev, views_quicksand with ajax links = Working

bumpshoveit’s picture

Best solution ever for me. I explain myself :

My entire Drupal web site navigation is ajax based. So like you could say to yourself about me : this guy is gonna be in deep sh** if he attempt to use ajax navigation with BEF...

So this is my problem : when ajax navigate while page i get à JS error from fireBug like this :

TypeError: Drupal.settings.better_exposed_filters is undefined
      if (Drupal.settings.better_exposed_filters.datepicker &&

this error append when i left a page with BEF in it (in fact when my new page is appended/inserted in my global contener).

So found this vars are here from a kind of render module and found is inserted from better_exposed_filters_exposed_form_plugin.inc. In this file, at line 1391 & 1992 you'll found this two lines :

      drupal_add_js(array('better_exposed_filters' => $bef_js), 'setting');
      drupal_add_js(drupal_get_path('module', 'better_exposed_filters') . '/better_exposed_filters.js');

Comment them. And save. This work for me only because i have A ENTIRE AJAX NAVIGATION from ajax pages module(i know it's a stupid and painful idea).

NB : I never found a simple and easy to use way to applying .patch and is much simple to insert a cactus in is own bottom than to apply patch on french windows 8...

thank all.

Roman_L’s picture

Hi all,

- patch #92 against 7.x-3.0-beta4 worked

- as i needed a link title attribute for the bef rendered links, i just added a line at 555 in better_exposed_filter.theme file :

      $url = bef_replace_query_string_arg($name, $key, $multiple, FALSE, $path);
+ 	  $link_options['attributes']['title'] = $value;
      $elem['#children'] = l($value, $url, $link_options);

So now the value is populated to link title, and pop-up on hover, usefull when using images as clickable filters

alcroito’s picture

Adding new patch based on #92, that replaces all occurrences of "_" in views name and display name, instead of just the first one.
This fixed ajax sorting to work for me.

rei’s picture

@placinta, I have error patching #99 with 7.x-3.0-beta4+6-dev

drupal_was_my_past’s picture

Here is a reroll of #99 against the latest 7.x-3.x-dev.

drupal_was_my_past’s picture

As @aaronbauman said in #85, the solution so far does not handle exposed sort. This patch is everything in #99 plus the ability to handle exposed sort by without an exposed sort order. This patch again is against the latest 7.x-3.x-dev.

atolborg’s picture

I installed the dev version and applied the patch. I still get an error:

Uncaught TypeError: Cannot read property 'dateformat' of undefined
better_exposed_filters.js?n3fbaw:94
belvedere’s picture

Also getting the exact same issue as #103 atolborg

subscribing

PlayfulWolf’s picture

Stumbled on this issue while searching why does not work sorting options - patch #102 solves this (sorting by pressing "a" links) for me only partially. Tested this on 2 views: on first simple test view all with default settings and filter form not in block it worked. On second production-like view with 2 filter blocks made with MEFIBS the links were present, but nothing happened after pressing them. The error may be in the link variable structure:

viewname?sort_by=nid
vs.
viewname?mefibs-form-formname-sort_by=nid

If I copy-paste link of the second view into the browser by removing "mefibs-form-formname-" part it works well.

p.s. Applied patch manually, so it may be my mistake somewhere...

berliner’s picture

@PlayfulWolf: MEFIBS integration with BEF is a separate issue, that should be addressed once this patch is finally working and committed. The main goal now should be to get this issue here fixed without regarding any additional functionality that comes from my module. I have created a follow-up issue here: #2241133: Integration with BEF Ajax links

PlayfulWolf’s picture

Then this patch produces a href's for sorting which works, I could RTBC it as working, at least partially

henk’s picture

I was try #102 for latest 7.x-3.x-dev and doesn't work with sorting in view and exposed block.

dark_underground’s picture

Priority: Normal » Critical
Status: Needs review » Needs work

I try #102, too with the latest dev. On page load it works once but every changed choose on the filter block after the first doesn't work.

I need this functionality so much ...
A very perfect idea...

Is it fixable? Does you need help?

maximpodorov’s picture

#102 creates this notice:
Notice: Array to string conversion in theme_select_as_links() (line 464 of better_exposed_filters/better_exposed_filters.theme).

maximpodorov’s picture

#102 creates this notice:
Notice: Array to string conversion in theme_select_as_links() (line 464 of better_exposed_filters/better_exposed_filters.theme).

This happens when initial selector allows multiple selection (so #value and #default_values are arrays).

JuliaKoelsch’s picture

I tested this patch, and it wasn't working for me. The reason is because my filter submit button is a <button>, not an input type=button:

<button class="ctools-use-ajax ctools-auto-submit-click js-hide form-submit" id="edit-submit-event-calendars" name="" value="Apply" type="submit">Apply</button>

So, I changed the last line of the js that submits as links to

$wrapper.parents('form').find('.views-submit-button button').click();

I don't yet know why my generated code is different than everyone else's. I'll dig around a little to see how the filter form button is generated, just to see if its something unique to the website I'm working on.

If it applies to others besides myself, I can provide a patch. I was just curious first if anyone had a similar exerience.

JuliaKoelsch’s picture

Never mind, my theme framework (Zurb Foundation) was changing the element from an input to a button.

Patch works well for me. I am only using this for exposed filtering (single value only), so have not run into any of the issues mentioned above.

Thanks!

quotesBro’s picture

I couldn't apply #102 with git due to error:
fatal: git diff header lacks filename information when removing 1 leading pathname components (line 5)
Applied with patch < better_exposed_filters-links-ajax-1268150-102.patchand created proper patch for git.

Anyway, this patch works for me.

quotesBro’s picture

Argus’s picture

Status: Needs work » Needs review

#114 So let's update the status... ;)

gkucsko’s picture

great job guys, #114 works for me. however there is a problem for sorting. changing the sorting criterium works as intended via ajax, however changing the sort order (asc|desc) will only work once (after every new pageload). any subsequent calls will give the same result, independent of whether 'asc' or 'desc' was chosen. is this still a bug or am i doing something wrong?

MustangGB’s picture

Status: Needs review » Needs work

On a required filter with ajax disabled if all options are unchecked it will default to "any" and automatically check them all again for you and show the results with them all checked.

The same thing with ajax enabled will show the results as if they were all checked, but won't automatically check all the options again, which gives a confusing experience to the user of the results not matching the filter options.

MustangGB’s picture

Regarding #118 this is what I have so far:

Drupal.behaviors.betterExposedFiltersRequiredFilter = {
  attach: function(context, settings) {
    // Required checkboxes should re-check all inputs if a user un-checks them all
    $('.bef-select-as-checkboxes', context).once('bef-required-filter').ajaxComplete(function (e, xhr, s) {
      // TODO: Check this is a required filter; I'd have thought that this information would be in 'Drupal.views.instances.X.$exposed_form', but it looks like BEF sets each input individually, and of course each individual one isn't required
      if ($('input:checked', this).length == 0) {
        $('input', this).prop('checked', true);
      }
    });
  }
}
rei’s picture

#114 error patching with the latest dev (7.x-3.0+2-dev)

markabur’s picture

Reroll of #114. Leaving at "Needs work" due to #117 and #118.

Dubs’s picture

Some themes change the input element to button (e.g. Bootstrap) so I changed the JS to this:-

$wrapper.parents('form').find('.views-submit-button *[type=submit]').click();

This is a more generic method to identify the element by just using the submit attribute.

HakS’s picture

#121 works for me, thanks!

tostinni’s picture

#121 and #123 (important for bootstrap theme) worked for me so here is a patch against dev.

Thanks all.

Argus’s picture

Status: Needs work » Needs review

That would make it needs review. Right?

MustangGB’s picture

Status: Needs review » Needs work

#117 and #118 haven't been addressed so I think still NW.

Argus’s picture

Ah yes you are right.

MustangGB’s picture

Sorry I'm not able to roll a patch, but here is my update for #118 which now includes the 'required' check.

better_exposed_filters.module

/**
 * Implements hook_preprocess_views_view().
 */
function better_exposed_filters_preprocess_views_view(&$vars) {
  $filters = array();
  foreach ($vars['view']->filter as $filter) {
    if ($filter->options['exposed']) {
      $identifier = $filter->options['is_grouped'] ? $filter->options['group_info']['identifier'] : $filter->options['expose']['identifier'];
      $filters[$identifier] = array(
        'required' => $filter->options['expose']['required'] ? true : false,
      );
    }
  }

  $bef_js = array(
    'views' => array(
      $vars['view']->name => array(
        'displays' => array(
          $vars['view']->current_display => array(
            'filters' => $filters,
          ),
        ),
      ),
    ),
  );

  drupal_add_js(array('better_exposed_filters' => $bef_js), 'setting');
}

better_exposed_filters.js

Drupal.behaviors.betterExposedFiltersRequiredFilter = {
  attach: function(context, settings) {
    // Required checkboxes should re-check all inputs if a user un-checks them all
    $('.bef-select-as-checkboxes', context).once('bef-required-filter').ajaxComplete(function (e, xhr, s) {
      var $element = $(this);

      if (typeof settings.views == 'undefined' || typeof settings.views.ajaxViews == 'undefined') {
        return;
      }

      // Now check that the view for which the current filter block is used,
      // is part of the configured ajax views.
      var $view_name
      var $view_display_id
      var $uses_ajax = false;
      $.each(settings.views.ajaxViews, function(i, item) {
        $view_name = item.view_name;
        $view_display_id = item.view_display_id;
        var $id = 'views-exposed-form-' + $view_name.replace(/_/g, '-') + '-' + $view_display_id.replace(/_/g, '-');
        var $form_id = $element.parents('form').attr('id');
        if ($form_id == $id) {
          $uses_ajax = true;
          return;
        }
      });

      var $filter_name = $('input', this).attr('name').slice(0, -2);
      if (Drupal.settings.better_exposed_filters.views[$view_name].displays[$view_display_id].filters[$filter_name].required && $('input:checked', this).length == 0) {
        $('input', this).prop('checked', true);
      }
    });
  }
}
Argus’s picture

Status: Needs work » Needs review
mikeker’s picture

Status: Needs review » Needs work

First off, thank you to everyone that's worked on this issue. I would love to see this get into BEF, but I've had very little time to work on this issue queue recently. Thank you for your patience.

From the patch in #121:

  1. +++ b/better_exposed_filters.js
    @@ -245,6 +245,67 @@
    +        // links are already properly build.
    

    nitpick: "built"

  2. +++ b/better_exposed_filters.theme
    @@ -457,9 +457,9 @@ function theme_select_as_links($vars) {
    -  if (empty($element['#value'])) {
    -    if (!empty($element['#default_values'])) {
    -      $selected_options[] = $element['#default_values'];
    +  if (strlen((string) $element['#value']) == 0) {
    +    if (!empty($element['#default_value'])) {
    +      $selected_options[] = $element['#default_value'];
    

    Can someone explain the change from empty() to strlen((string) ...)?

Also, the fixes in #128 need to be rolled into this patch.

Finally, I haven't had the chance to properly read through all the comments in this issue. If someone who has been tracking this for a while can suggest a commit message in the issue summary, that would be very helpful in giving credit where credit is due. (Note: I can only list one user as "author" and, based on the number of patches submitted, that doesn't seem right. Let me know if that's incorrect).

Thanks!

mikeker’s picture

Also, the patch doesn't appear to work with filters that allow multiple selections. Eg: expose the tag taxonomy filter, tick the "Allow multiple selections" option. Click term1, then click term1. It should submit something similar to tid[0]=5&tid[1]=3 but instead replaces tid[0]=5 with tid[0]=3.

joelpittet’s picture

Status: Needs work » Needs review
FileSize
11.37 KB

Here is #121 + additions from #128 and typo and empty() check revert from strlen in #130

#131 not dealt with in this.

mikeker’s picture

Status: Needs review » Fixed

I'm going ahead and committing (a re-rolled version of) this even though we haven't dealt with the fact that it doesn't handle multi-selection filters. I've filed a followup issue for that. Why let the perfect become the enemy of the good?

Thank you to the long list of folks that have worked on this, as is evidenced by the commit message. This is a true community effort. Thank you!

Note: this did NOT make the 7.x-3.1 release intentionally. I'm hoping something will come of #2464521: BEF Links and AJAX don't work if "Allow multiple selections" is checked. in time to get both features into the next release.

  • mikeker committed 6a8fb80 on
    Issue #1268150 by leschekfm, berliner, gapple, jeffschuler, Hydra,...
MustangGB’s picture

Status: Fixed » Needs work

Did you intentionally not commit the changes to better_exposed_filters.module?

Because without it Drupal.behaviors.betterExposedFiltersRequiredFilter in better_exposed_filters.js won't work.

P.S. I only bothered to check because I wasn't on the commit log, so thought it odd you'd only use half the code.

joelpittet’s picture

Status: Needs work » Fixed

@MustangGB yes he mentioned so in #133 It's in -dev branch for the next version. There is a commit log in #134 right on the issue.

MustangGB’s picture

Perhaps you misread my reply, I was referring to the commit log containing deliberately broken code, this can't possibly be intentional.

Either include all the code, or none of it, not half of it.

joelpittet’s picture

Status: Fixed » Needs work

@MustangGB oh I see what you are saying now, thanks for clarifying.

Drupal.behaviors.betterExposedFiltersRequiredFilter is in -dev branch. I have my site in git, so when I update a module that has a patch I can review the changes to see if something is weird after the patch gets applied.

But you are right I think in some regards. better_exposed_filters_preprocess_views_view seems to be missing. Everything else seems to be there from #131.

Maybe I'm wrong, can you check?

joelpittet’s picture

Did a diff against the repo in 7.x-3.x branch vs the branch I did to create #132 and that better_exposed_filters_preprocess_views_view is the only thing missing. The coding standards on that hook implementation need a bit of work. So I can repost that if it's needed?

joelpittet’s picture

Status: Needs work » Needs review
FileSize
1.04 KB

This bit missing.

MustangGB’s picture

Maybe I'm wrong, can you check?

Nope, this is exactly what I was referring to.

joelpittet’s picture

Ah great then, was confused by the js reference. All cleared up now thanks.

Let's see what mikeker says.

  • mikeker committed f722f7e on 7.x-3.x
    Issue #1268150 by MustangGB, joelpittet: The missing part of 6a8fb80.
    
mikeker’s picture

Status: Needs review » Fixed

@MustangGB: Thank you for following up and my apologies for leaving you off the original commit credit.

And thank you @joelpittet for digging up the missing part.

I've committed this addition and will roll an updated release later this afternoon.

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.

sadashiv’s picture

Hi,

The fix works great. Again thanks for all who helped for this fix. Requesting to check https://www.drupal.org/node/2470583#comment-9846727 which should fix the toggle.

Thanks,
Sadashiv.

joelpittet’s picture

@sadashiv Could you test out the reset button ajax? I've hacked mine to work but wondering if others are having issues with that button.

Kimberley_p’s picture

I am running 7.x-3.2 and still coming across this issue. Clicking one of the links goes to

domain.com/?field_categories_tid=11&field_categories_tid=11

bserem’s picture

I just updated and I can verify that it works for me, after clearing caches of course.

mikeker’s picture

@Kimberley_p: first off, double-check that you're not seeing any Javascript errors. If there are none, it would be best to open a new issue with more details about the view in question and specifics about the scenarios that reproduce the error. Comments on closed issues don't usually get much attention. Thanks.

kareemzok’s picture

Status: Closed (fixed) » Active

Hello,
i m facing this problem even after the patch . its already applied in latest version of the module , when i installed it few days ago , i get error js "Cannot read property 'required' of undefined "

mikeker’s picture

Status: Active » Closed (fixed)

@kareemzok: You'll get more traction if you open a new issue rather than reactivating this one. Also note that AJAX doesn't work with multiple filter options (see #2464521: BEF Links and AJAX don't work if "Allow multiple selections" is checked.).

Regardless, I will need more information about your configuration (what filters, what settings, etc) and about the error (what line of what file, etc).

attheshow’s picture

Just reporting that I ran into the same issue testing using the latest version of the Views module and the latest dev version of the BEF module. I do have my BEF exposed as a block and printing in a different region of the theme. For now I'm switching to non-AJAX just so that it will work.

Leeteq’s picture

Status: Closed (fixed) » Active

So perhaps this issue is not completely solved?
May it be related to which JQuery version is being used via JQuery_update module?

michaelkoehne’s picture

Using BEF Select as Links with AJAX. Autosubmit with "Hide Submit Button" is activated.

AJAX/JS isn't triggered on click. (Site refreshing like AJAX is disabled)

mikeker’s picture

Status: Active » Closed (won't fix)

As mentioned in #152, please open a new issue if you are still having problems with this.

joelpittet’s picture

Status: Closed (won't fix) » Closed (fixed)

Fixed in #143

jwjoshuawalker’s picture

I don't think this fix made it to the D8 version.

clairedesbois@gmail.com’s picture