Bootstrap Modal pops up with no reason

Using Django Mystery Errors
1

Hi there,

today I discovered a strange thing. I am almost done with my project and doing last improvements…or at least i try to :stuck_out_tongue:

Today, i wanted to implement some html-patterns for input validation within my django-filters filter-definitions.Like so (for example):

    employments__percent = django_filters.NumberFilter(
                                    field_name='employments__percent',
                                    lookup_expr='icontains',
                                    widget=forms.TextInput(attrs={
                                        'pattern': '^((100)|(\d{0,2}))$',
                                    }))

If i do so and insert not-RegEx-matching text in the field on the rendered page, than - together with the RegEx warning, which is popping up under the input field, a bootstrap-modal shows up when i click the submit-button! The Modal is also part of the page, but has nothing to do with the input field i am coding on…and no, there are no identical HTML id’s and if i remove the pattern part from the attrs brackets, the mystery is gone…

Someone any ideas what’s going on here ?

2

It seems to me that there would have to be some kind of “css selector” overlap or conflict between the two.

You may need to examine the rendered html in the browser to follow the chain of events, along with (possibly) single-stepping the JavaScript in the browser.

3

It gets me crazy, I don’t get it why this is happening and I still haven’t found any cross-linking between the events. I dond’t think that i have to single-step javascript, because the javascript is really simple:

<script>
    const btn = document.getElementById('customQueryButton');
    if(btn) {
        document.getElementById("customQueryButton").addEventListener("click", function () {
            let openModalCheckbox = document.getElementById("export_toggle2");
            if (openModalCheckbox.checked) {
                $('#QueryModal').modal('show');
            }
        });
    }
</script>

But i don’t get why the openModalCheckbox var is considered checked only because a regex error is triggered…