[Resolved] I need to change the radio filtering into buttons or text

[Author]

Posts

[vincew]

I am trying to make the filtering which currently displays as radio buttons, be standard buttons or text links.

For example in the Types Custom Fields I have set up the field as "checkboxes", but in the front end filtering I need for it to display buttons rather than radio buttons. How do I go about doing this?

Regards,

Vince

[Waqas Supporter Languages: English (English ) Timezone: Asia/Karachi (GMT+05:00)]

Apparently, Views only offers variant selection of filter controls, based on the field type. But that doesn't include Button or Text Links.

However, you can visually render the conversion using 3rd party jQuery plugin. Please visit this link, it may interest you hidden link. You can find a demo link also. This plugin converts radio buttons into Buttons.

[vincew]

Hi Waqas,

I have used the jquery plugin suggested, and initially this works and displays them as buttons... However as soon as a button is clicked/selected it reverts back to looking like radio buttons.

I've tries declaring the jquery and css in both the theme, as well as within the view CSS/JS boxes incase that made any difference, but it didn't.
my code is:

<div class="filtergroup">
[wpv-control field="area-of-interest" url_param="area-of-interest" type="radios" auto_fill="wpcf-area-of-interest" auto_fill_sort="asc"]
</div>

I have also tried manually adding in the options as so:

<div class="filtergroup">
[wpv-control field="area-of-interest" url_param="area-of-interest" type="radios" values="arts-creative,small-business,social-good" display_values="Arts Creative,Small Business,Social Good"]
</div>

Can you let me know what I am doing wrong.

[Waqas Supporter Languages: English (English ) Timezone: Asia/Karachi (GMT+05:00)]

Alright, can you please send me a temporary access to your site? So I can try to make it work for you.

I have enabled private details area for your next reply, please input all details in that area. Also remember to take backup of your site before providing the access.

[Waqas Supporter Languages: English (English ) Timezone: Asia/Karachi (GMT+05:00)]

Thank you for providing the access. Please allow me some time to work on this. I will get back to you as soon as I find a solution.

[vincew]

Hi Waqas..

Can you let me know when you expect to get around to this.

My client is pressing me...

Regards,

Vince

[Waqas Supporter Languages: English (English ) Timezone: Asia/Karachi (GMT+05:00)]

Please see, it has been fixed. I have bind the change with document's AJAX complete event as below:

$( document ).ajaxComplete(function() {
  	$('.filtergroup').radiosforbuttons({
      group: false, 
      margin: 10,
    });
  });