Hi
I have 3 dropdowns on the following page,
http://gilt.martinduys.com/index.php/places
I managed to get the region dropdown to get filtered based on the country selected in the first, the problem is when a user selects a region, all the regions disappears.
So to see what the problem is first select a country, then click the region dropdon, you'll see the regions within the country you selected, then again select a specific region then youll see that it clears all the values, any help would be appreciated as I have to get this done.
here is the code:
function DOMHotelFilter () {
var currentSelection = Array();
$$('.filterBox select').each(function (element) {
element.addEvent('change',function(){
// hide intro text if there is any
// if ($('introText')) {
// $('introText').setStyle('display', 'none');
// };
$$('.filterBox select option[selected]').each(function (element, index) {
currentSelection[index] = element.get('value');
})
// $$('#relatedTours li').each(function (element) {
// element.setStyle('display', 'block');
// if ((!element.hasClass(currentSelection[0]))||(!element.hasClass(currentSelection[1]))||(!element.hasClass(currentSelection[2]))) {
// element.setStyle('display', 'none');
// };
// })
var filterSpinner = new Spinner($$('.filterBox')[0]);
var request = new Request.JSON({
onRequest: function () {
filterSpinner.toggle();
},
onComplete: function () {
filterSpinner.toggle();
// if (numberOfElementAfterFilter == 0) {
loadPages();
// };
},
onSuccess: function(jsonResponse) {
// console.log($$('#hotelFilterBox select'));
var regions = $$('#hotelFilterBox select')[1];
var selector = regions.getFirst().clone();
regions.empty();
selector.inject(regions);
jsonResponse.regionFilter.each(function (region, index) {
if ($chk(region)) {
var existingValues = regions.getChildren().get('value');
if (existingValues.indexOf(region.url_title) == -1) {
var optionField = new Element('option',{
'value':region.url_title,
'text':region.title
});
if (currentSelection[1]==region.url_title) {
optionField.setProperty('selected', 'selected');
};
optionField.inject(regions);
};
};
})
// removing any existing elements because they get loaded va ajax now anyway
$('relatedTours').empty();
$('relatedTours').empty();
}
});
// @info This gets called when a country is selected in the drop down on the places overview template
var selected = element.getSelected();
if ($$(selected).getProperty('class') == 'country')
{
request.send({url:'index.php/modules/getSelectorHotelAndLodges/country/'+currentSelection[0]+'/region/all/rating/all'});
}
else
{
var parentCountry = $$(selected).getProperty('class').toString().replace('region parent_', '');
var region = $$(selected).getProperty('value');
$$(selected).getProperty('value', parentCountry);
$$('#destinationFilter').getProperty('value', region);
$$(selected).getProperty('value', region);
$$('#destinationFilter').getProperty('text', region);
request.send({url:'index.php/modules/getSelectorHotelAndLodges/country/' + parentCountry + '/region/'+region+'/rating/all'});
}
/*if ($$($$(this).getSelected()).hasClass('region'))
{
// var classes = $$($$(this).getSelected()).hasClass('region');
// var pieces = classes.toString().split(' ');
// alert(pieces);
//request.send({url:'index.php/modules/getSelectorHotelAndLodges/country/'+currentSelection[0]+'/region/'+currentSelection[0]+'/rating/all'});
}
// find a country
else if ($$($$(this).getSelected()).hasClass('country'))
{
/// alert('country');
request.send({url:'index.php/modules/getSelectorHotelAndLodges/country/'+currentSelection[0]+'/region/all/rating/all'});
}
//request.send({url:'index.php/modules/getSelectorHotelAndLodges/country/'+currentSelection[0]+"/region/"+currentSelection[1]+"/rating/"+currentSelection[2]});
*/
})
})
}
Thanks.
