https://www.kiesjedocent.nl/assets/js/interaction.js?burst=1791515712

1/* 
2 * Interaction layer
3 */
4
5$(function() {
6    if (_KD.Is.func($.fn.select2)) {
7        // load select2 on search combo's
8        $("select[name='customer_segments']").select2();
9        $("select[name='disciplines']").select2();
10        $("select[name='municipality']").select2();
11    }
12    // enable some bootstrap func.
13    $("[data-init='popover']").popover();
14    
15    // add event for search terms.
16    $("form.searchFrm").on('submit', _KD.App.trackSearch);
17    
18    // load more results.
19    $("div.loadmore button").on('click', _KD.App.searchLoadMore);
20    
21    // set some listeners on report collapse
22    $(".report-collapse").on('shown.bs.collapse', function(e) {
23        e.preventDefault();
24        // set focus on firstname
25        $(this).find("input[name=firstname]").focus();
26    });
27    $(".report-collapse").on('hide.bs.collapse', function(e) {
28        // clear form data.
29        var _scope = $(this);
30        _scope.find("form")[0].reset();
31        
32        // make sure submit is enabled (again)
33        _scope.find("button").removeAttr('disabled').removeClass('disabled');
34        
35        // restore form state.
36        _scope.find("div.tnxx").hide(function() {
37            _scope.find("button").show();
38            _scope.find("div.form").show();
39        });
40        
41        return true;
42    });
43    
44    // set some listeners on report modal
45    $('.report-teacher-modal').on('shown.bs.modal', function (e) {
46        e.preventDefault();
47        // set focus on firstname
48        $("form.reportFrm input[name=firstname]").focus();
49    });
50    // hide 
51    $('.report-teacher-modal').on('hide.bs.modal', function (e) {
52        // clear form data.
53        $("form.reportFrm")[0].reset();
54        // make sure submit is enabled (again)
55        $("form.reportFrm button").removeAttr('disabled');
56        $('form.reportFrm button').removeClass('disabled');
57        // restore form state.
58        $(".report-teacher-modal div.tnxx").hide(function() {
59            $(".report-teacher-modal button").show();
60            $(".report-teacher-modal div.form").show();
61        });
62        
63        return true;
64    });
65    
66    
67    // on form submit.. set loader for page.
68//    $("form:not(.contactFrm)").on('submit', function() {
69//        _KD.App.setLoader();
70//    });
71    // test in-/external links
72    $("a").on('click', function(e) {
73        if (this.host !== location.host) {
74            // track on google.
75            _KD.App.googleLinkTrack(this.href);
76        }
77        if ($(this).hasClass('search-read-more')) {
78            // track event.
79            _KD.App.googleEvent('bekijk_profiel', 'klik', 'ID:' + $(this).data('teacher_id'));
80            var scrollId = "#result-details-contact-" + $(this).data('teacher_id');
81            // and not contracting.
82            if (!$("#result-details-" + $(this).data('teacher_id')).hasClass('in')) {
83                _KD.Util.scrollToElement($(scrollId), 'div.content div.panel-group');
84            }
85        }
86        if ($(this).hasClass('contact-teacher')) {
87            // track event.
88            _KD.App.googleEvent('contactgegevens', 'klik', 'ID:' + $(this).data('teacher_id'));
89            var scrollId = "#result-details-contact-" + $(this).data('teacher_id') + ' div.contactFrmContainer';
90            if (!$("#result-details-contact-" + $(this).data('teacher_id')).hasClass('in')) {
91                _KD.Util.scrollToElement($(scrollId), 'div.content div.panel-group');
92            }
93        }
94        if ($(this).hasClass('search')) {
95            e.preventDefault();
96            // build search.
97            var segment = $(this).data('segment');
98            var value = $(this).data('value');
99            if (segment && value) {
100                // reset form
101                $("form.searchFrm")[0].reset();
102                // set back value.
103                $("select[name='" + segment + "'] option[value='" + value + "']").attr('selected', 'selected');
104                $("form.searchFrm")[0].submit();
105            }
106        }
107
108        if ($(this).hasClass('report-teacher')) {
109            e.preventDefault();
110            // get type of action clicked.
111            var modal = ($(this).hasClass('modalLink')) ? true : false;

112            var teacher_id = $(this).data('teacher_id');
113            if (parseInt(teacher_id) > 0) {
114                if (modal) {
115                    // set teacher id to report form.
116                    $(".reportFrm input[name=id]").val(teacher_id);
117                    $('.report-teacher-modal').modal('show');
118                } else {
119                    console.log('hier?');
120                    var el = $("#report-" + teacher_id);
121                    console.log('el');
122                    console.log(el);
123                    el.find("input[name=id]").val(teacher_id);
124                    el.collapse();
125                }
126            }
127        }
128    });
129    // scroll to 'read more' part in search results.
130    // submit contact form.
131    console.log('Set listener for contact submit');
132	$(document).on('submit', "form.contactFrm:visible", function(e) { 
133		console.log('Submit contact form');
134        e.preventDefault();
135        // copy scope.
136        var _scope = $(this);
137        
138        // disable the submit button.
139        _scope.find('button[type="submit"]').addClass('disabled');
140        
141        // remove possible current errors.
142        $(this).find("p.help-block.required").remove();
143        // obtain teacher id
144        var teacher_id = $(this).data('id');
145        // error helper block
146        var error_tpl = '<p class="help-block required">{{msg}}</p>';
147        
148        // get some form data.
149        // name
150        var name = $(this).find("input[name='name']");
151        // email
152        var email = $(this).find("input[name='email']");
153        // phonenumber
154        var phonenumber = $(this).find("input[name='phonenumber']");
155        // city
156        var city = $(this).find("input[name='city']");
157        // question
158        var question = $(this).find("textarea[name='question']");
159        
160        if (name.hasClass('required') && name.val() == '') {
161            var name_error = error_tpl.replace("{{msg}}", "Naam is verplicht");
162            name.parent().append(name_error);
163            name.focus();
164            _scope.find('button[type="submit"]').removeClass('disabled');
165            return false;
166        }
167        if (email.hasClass('required') && email.val() == '') {
168            var email_error = error_tpl.replace("{{msg}}", "E-mailadres is verplicht");
169            email.parent().append(email_error);
170            email.focus();
171            _scope.find('button[type="submit"]').removeClass('disabled');
172            return false;
173        }
174        if (phonenumber.hasClass('required') && phonenumber.val() == '') {
175            var phonenumber_error = error_tpl.replace("{{msg}}", "Telefoonnummer is verplicht");
176            phonenumber.parent().append(phonenumber_error);
177            phonenumber.focus();
178            _scope.find('button[type="submit"]').removeClass('disabled');
179            return false;
180        }
181        if (city.hasClass('required') && city.val() == '') {
182            var city_error = error_tpl.replace("{{msg}}", "Woonplaats is verplicht");
183            city.parent().append(city_error);
184            city.focus();
185            _scope.find('button[type="submit"]').removeClass('disabled');
186            return false;
187        }
188        if (question.hasClass('required') && question.val() == '') {
189            var question_error = error_tpl.replace("{{msg}}", "Vraag/opmerking is verplicht");
190            question.parent().append(question_error);
191            question.focus();
192            _scope.find('button[type="submit"]').removeClass('disabled');
193            return false;
194        }
195        // all fine.. proceed.
196        $.ajax({
197            url:$(this).attr('action'),
198            type:'POST',
199            data: {
200                id:teacher_id,
201                name:name.val(),
202                email:email.val(),
203                phonenumber:phonenumber.val(),
204                city:city.val(),
205                question:question.val()
206            },
207            success:function (_data) { // handle response
208                var data = _data || {};
209                if (data.success == true) {
210                    // track event
211                    _KD.App.googleEvent('contactformulier_verzonden', 'verzonden', 'ID:' + teacher_id);
212                    _scope.fadeOut(function() {
213                        _scope.parent().html(
214                            "<h4>Aanvraag verzonden</h4>" + 
215                            "<p class='lead'>Dank voor uw interesse, normaliter neemt een docent binnen 2 werkdagen contact met u op</p>"
216                        );
217                    });
218                } else {
219                    _scope.find('button[type="submit"]').removeClass('disabled');
220                    var errors = data.errors || {};
221                    if (errors.length) {
222                        // set above form.
223                    }
224                }
225            },
226            error:function(err) {
227                _scope.find('button[type="submit"]').removeClass('disabled');
228                // set error above form.
229            }
230        });
231	// return false to overwrite default brower behaviour
232	return false;

233    });
234    $(document).on('submit', 'form.reportFrm', function(e) {
235        e.preventDefault();
236        // copy scope.
237        var _scope = $(this);
238        
239        // disable the submit button.
240        _scope.find('button[type="submit"]').addClass('disabled');
241        
242        // remove possible current errors.
243        $(this).find("p.help-block.required").remove();
244        // error helper block
245        var error_tpl = '<p class="help-block required">{{msg}}</p>';
246        
247        // get some form data.
248        // teacher id
249        var teacher_id = $(this).find("input[name='id']").val();
250        // name
251        var firstname = $(this).find("input[name='firstname']");
252        // surname
253        var surname = $(this).find("input[name='surname']");
254        // email
255        var email = $(this).find("input[name='email']");
256        // reason
257        var reason= $(this).find("select[name='reason']");
258        
259        if (firstname.hasClass('required') && firstname.val() == '') {
260            var name_error = error_tpl.replace("{{msg}}", "Voornaam is verplicht");
261            firstname.parent().append(name_error);
262            firstname.focus();
263            _scope.find('button[type="submit"]').removeClass('disabled');
264            return false;
265        }
266        if (surname.hasClass('required') && surname.val() == '') {
267            var surname_error = error_tpl.replace("{{msg}}", "Achternaam is verplicht");
268            surname.parent().append(surname_error);
269            surname.focus();
270            _scope.find('button[type="submit"]').removeClass('disabled');
271            return false;
272        }
273        if (email.hasClass('required') && email.val() == '') {
274            var email_error = error_tpl.replace("{{msg}}", "E-mailadres is verplicht");
275            email.parent().append(email_error);
276            email.focus();
277            _scope.find('button[type="submit"]').removeClass('disabled');
278            return false;
279        }
280        if (reason.hasClass('required') && reason.val() == '') {
281            var reason_error = error_tpl.replace("{{msg}}", "Reden is verplicht");
282            reason.parent().append(reason_error);
283            reason.focus();
284            _scope.find('button[type="submit"]').removeClass('disabled');
285            return false;
286        }
287        
288        // all fine.. proceed.
289        $.ajax({
290            url:$(this).attr('action'),
291            type:'POST',
292            data: {
293                id:teacher_id,
294                firstname:firstname.val(),
295                surname:surname.val(),
296                email:email.val(),
297                reason:reason.val(),
298                notes: $(this).find("textarea[name='notes']").val()
299            },
300            success:function (_data) { // handle response
301                var data = _data || {};
302                if (data.success == true) {
303                    _scope.find('button[type="submit"]').removeClass('disabled');
304                    _scope.find("div.form").hide(function(){
305                        _scope.find('button[type="submit"]').hide();
306                        // remove report button.. just to be sure :)
307                        _scope.find("div.tnxx").show();
308                    });
309                } else {
310                    _scope.find('button[type="submit"]').removeClass('disabled');
311                    var errors = data.errors || {};
312                    if (errors.length) {
313                        // set above form.
314                    }
315                }
316            },
317            error:function(err) {
318                _scope.find('button[type="submit"]').removeClass('disabled');
319                // set error above form.
320            }
321        });        
322    });
323    $("form.reportInlineFrm").on('submit', function(e) {
324        e.preventDefault();
325        // copy scope.
326        var _scope = $(this);
327        
328        // disable the submit button.
329        _scope.find('button[type="submit"]').addClass('disabled');
330        
331        // remove possible current errors.
332        $(this).find("p.help-block.required").remove();
333        // error helper block
334        var error_tpl = '<p class="help-block required">{{msg}}</p>';
335        
336        // get some form data.
337        // teacher id
338        var teacher_id = $(this).find("input[name='id']").val();
339        // name
340        var firstname = $(this).find("input[name='firstname']");
341        // surname
342        var surname = $(this).find("input[name='surname']");
343        // email
344        var email = $(this).find("input[name='email']");
345        // reason
346        var reason= $(this).find("select[name='reason']");
347        
348        if (firstname.hasClass('required') && firstname.val() == '') {
349            var name_error = error_tpl.replace("{{msg}}", "Voornaam is verplicht");
350            firstname.parent().append(name_error);
351            firstname.focus();
352            _scope.find('button[type="submit"]').removeClass('disabled');
353            return false;

354        }
355        if (surname.hasClass('required') && surname.val() == '') {
356            var surname_error = error_tpl.replace("{{msg}}", "Achternaam is verplicht");
357            surname.parent().append(surname_error);
358            surname.focus();
359            _scope.find('button[type="submit"]').removeClass('disabled');
360            return false;
361        }
362        if (email.hasClass('required') && email.val() == '') {
363            var email_error = error_tpl.replace("{{msg}}", "E-mailadres is verplicht");
364            email.parent().append(email_error);
365            email.focus();
366            _scope.find('button[type="submit"]').removeClass('disabled');
367            return false;
368        }
369        if (reason.hasClass('required') && reason.val() == '') {
370            var reason_error = error_tpl.replace("{{msg}}", "Reden is verplicht");
371            reason.parent().append(reason_error);
372            reason.focus();
373            _scope.find('button[type="submit"]').removeClass('disabled');
374            return false;
375        }
376        
377        // all fine.. proceed.
378        $.ajax({
379            url:$(this).attr('action'),
380            type:'POST',
381            data: {
382                id:teacher_id,
383                firstname:firstname.val(),
384                surname:surname.val(),
385                email:email.val(),
386                reason:reason.val(),
387                notes: $(this).find("textarea[name='notes']").val()
388            },
389            success:function (_data) { // handle response
390                var data = _data || {};
391                if (data.success == true) {
392                    _scope.find('button[type="submit"]').removeClass('disabled');
393                    _scope.find("div.form").hide(function(){
394                        _scope.find('button[type="submit"]').hide();
395                        // remove report button.. just to be sure :)
396                        _scope.find("div.tnxx").show();
397                    });
398                } else {
399                    _scope.find('button[type="submit"]').removeClass('disabled');
400                    var errors = data.errors || {};
401                    if (errors.length) {
402                        // set above form.
403                    }
404                }
405            },
406            error:function(err) {
407                _scope.find('button[type="submit"]').removeClass('disabled');
408                // set error above form.
409            }
410        });        
411    });
412    
413    // maakposter
414    $(document).on('click', "#posters a.createPoster", function(e) {
415        e.preventDefault();
416        var poster = $(this).data('poster');
417        var location = window.location;
418        var $this = $(this);
419        $this.button('loading');
420        $.ajax({
421            url:location,
422            type:'POST',
423            data: {
424                poster:poster
425            },
426            success:function (_data) { // handle response
427                $this.button('reset');
428                var data = _data || {};
429                if (data.success == true) {
430                    $this.addClass('hidden');
431                    $this.parent().find('.download').removeClass('hidden');
432                    $this.parent().find('.download a').attr('href', _KD.app.uri + '/' + data.filename);
433                } else {
434                    alert('Fout bij genereren poster probeer nogmaals');
435                }
436            },
437            error:function(err) {
438                $this.button('reset');
439                alert('Fout bij genereren poster probeer nogmaals');
440            }
441        });        
442    });
443});