-
Notifications
You must be signed in to change notification settings - Fork 0
/
ajax_filter.js
64 lines (50 loc) · 2.06 KB
/
ajax_filter.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
import Rails from '@rails/ujs'
const ajaxBannerFilter = () => {
const filterForm = document.querySelector('#filter-form');
if(!filterForm) return;
// Ajax Dropdown
const dropdown = filterForm.querySelector('#plant_type');
dropdown.addEventListener('change', event => {
event.preventDefault();
//Put dropdown value into hidden field of calendar
const hiddenPlantType = document.querySelector('#hidden-plant-type');
hiddenPlantType.value = event.currentTarget.value;
//submit a form ajax way thanks to Rails.fire
Rails.fire(filterForm, 'submit');
});
// Ajax search
const search = filterForm.querySelector('#plant_query');
search.addEventListener('keyup', event => {
event.preventDefault();
//Put search value into hidden field of calendar
const hiddenPlantQuery = document.querySelector('#hidden-plant-query');
hiddenPlantQuery.value = event.currentTarget.value;
//submit a form ajax way thanks to Rails.fire
Rails.fire(filterForm, 'submit');
});
}
const ajaxCalendarFilter = () => {
const monthFilterForm = document.querySelector('#month-filter-form');
if(!monthFilterForm) return;
const calendarMonthInputs = monthFilterForm.querySelectorAll('input[type=checkbox]');
calendarMonthInputs.forEach(calendarMonthInput => {
calendarMonthInput.addEventListener('change', event =>{
event.preventDefault();
//select hidden month in header filter form
const headerFilterForm = document.querySelector('#filter-form');
const filterMonthInput = headerFilterForm.querySelector(`input[value=${event.currentTarget.value}]`);
filterMonthInput.click();
Rails.fire(monthFilterForm, 'submit');
});
});
}
const ajaxSeasonFilter = () => {
const seasonFilterForm = document.querySelector('#season-filter-form');
if(!seasonFilterForm) return;
const season = seasonFilterForm.querySelector('#season');
season.addEventListener('change', event => {
event.preventDefault();
Rails.fire(seasonFilterForm, 'submit');
});
}
export { ajaxBannerFilter, ajaxCalendarFilter, ajaxSeasonFilter }