]> git.openstreetmap.org Git - nominatim-ui.git/blob - src/components/UrlSubmitForm.svelte
Merge remote-tracking branch 'upstream/master'
[nominatim-ui.git] / src / components / UrlSubmitForm.svelte
1 <script>
2   import { refresh_page } from '../lib/stores.js';
3
4   export let page;
5
6   function serialize_form(form) {
7     var params = new URLSearchParams();
8
9     Array.prototype.slice.call(form.elements).forEach(function (field) {
10       if (!field.name || field.disabled || ['submit', 'button'].indexOf(field.type) > -1) return;
11
12       if (['checkbox', 'radio'].indexOf(field.type) > -1 && !field.checked) return;
13       if (typeof field.value === 'undefined' || field.value === '') return;
14
15       // Default value for /search endpoint
16       if (field.name === 'dedupe' && (field.value === 1 || field.value === '1')) return;
17
18       params.set(field.name, field.value);
19     });
20
21     return params;
22   }
23
24   // https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5/Constraint_validation
25   // doesn't support hidden fields, so we check those in an extra step
26   function validate_field(field) {
27     if (field.type === 'hidden') {
28       if (field.value.length) {
29         if (field.pattern && !field.value.match(field.pattern)) return false;
30       }
31     }
32     return field.checkValidity(); // for hidden field always true
33   }
34
35   function handle_submit(event) {
36     let form = event.target;
37
38     let allow_submit = true;
39
40     Array.prototype.slice.call(form.elements).forEach(function (field) {
41       if (!validate_field(field)) {
42         alert('Invalid input in ' + field.name);
43         allow_submit = false;
44       }
45     });
46
47     if (allow_submit) refresh_page(page, serialize_form(form));
48   }
49 </script>
50
51 <form on:submit|preventDefault={handle_submit} class="form-inline" role="search" accept-charset="UTF-8" action="">
52   <div class="row g-2">
53     <slot></slot>
54   </div>
55 </form>