1. wilbert
  2. General
  3. Friday, September 15 2017, 10:56 AM
I like to show the selections of a filed on my search page as seperate options. then the options are visable directly.

How to ?
admin Accepted Answer
Admin
Sorry can you please explain me better? some screenshot can help me
  1. more than a month ago
  2. General
  3. # 1
wilbert Accepted Answer
Pro
See attachments.

The field is a selection field, on the search page you have to select the options by clicking the field,

I like to show all the optiosn directly for the visitors.
  1. more than a month ago
  2. General
  3. # 2
admin Accepted Answer
Admin
Hi,
I can see attachment (probably this forum have blocked it because too big).

Anyway now I have understand, unfortunately this is not possible natively.

To do this you need to add some javascript code that create this, but this require a bit of time and javascript knowledges.
  1. more than a month ago
  2. General
  3. # 3
wilbert Accepted Answer
Pro
Oke please send me an example of javascript..
I need this..
  1. more than a month ago
  2. General
  3. # 4
wilbert Accepted Answer
Pro
The radio list is not an option, as you cannot select more then one selection?
  1. more than a month ago
  2. General
  3. # 5
admin Accepted Answer
Admin
Oke please send me an example of javascript..
In the next week we will try to provide you some example :)

The radio list is not an option, as you cannot select more then one selection?
It works like "OR" operator.
  1. more than a month ago
  2. General
  3. # 6
wilbert Accepted Answer
Pro
Oke I will wait the examples..
  1. more than a month ago
  2. General
  3. # 7
wilbert Accepted Answer
Pro
And can you send me some examples.
  1. more than a month ago
  2. General
  3. # 8
wilbert Accepted Answer
Pro
Please send me a solutions.
I need to complete this website
  1. more than a month ago
  2. General
  3. # 9
admin Accepted Answer
Admin
Hi,
sorry for this late, keep in mind that we does not support custom code, and this is a courtesy.

Unfortunately we are very busy in these days and as I said this require a bit of time. Please wait, late today or tomorrow we will do this for you :)
  1. more than a month ago
  2. General
  3. # 10
admin Accepted Answer
Admin
Hi,
here an example of javascript code that create a button for each option for a each select:


jQuery(document).ready(function(){
var check_button_class = 'btn btn-default btn-xs'; // you can customize here
var check_button_class_active = 'btn-success'; // you can customize here
jQuery('.jsn_search_module select:not(.gmap_radius_select) + div.chzn-container,.jsn_search select:not(.gmap_radius_select) + div.chzn-container').hide();

jQuery('.jsn_search_module select:not(.gmap_radius_select) option,.jsn_search select:not(.gmap_radius_select) option').each(function(){
var self = jQuery(this);
var active = self.prop('selected');
self.hide();
if(self.val().length)
{
if(active) self.parent().before('<span class="'+check_button_class+' '+check_button_class_active+'" data-select="'+self.parent().attr('id')+'" data-value="'+self.attr('value')+'">'+self.text()+'</span> ');
else self.parent().before('<span class="'+check_button_class+'" data-select="'+self.parent().attr('id')+'" data-value="'+self.attr('value')+'">'+self.text()+'</span> ');
}
});
jQuery('.btn[data-select]').each(function(){
var self = jQuery(this);
self.click(function(){
jQuery('[data-select="'+self.attr('data-select')+'"]').removeClass(check_button_class_active);
console.log(self.attr('data-select'));
self.toggleClass(check_button_class_active);
var select = jQuery('#'+self.attr('data-select'));
select.val(self.attr('data-value')).change();
});
});
});
  1. more than a month ago
  2. General
  3. # 11
wilbert Accepted Answer
Pro
Where to add this javascript?
  1. more than a month ago
  2. General
  3. # 12
admin Accepted Answer
Admin
normally all templates allow you to add Javascript/CSS code in template parameters or in a custom file. But this depends from your template.

For example for Joomla default template "Protostar" you can create file into /templates/protostar/js/user.js and put this code into this file.
  1. more than a month ago
  2. General
  3. # 13
  • Page :
  • 1


There are no replies made for this post yet.
However, you are not allowed to reply to this post.