JQuery Validate Uncaught TypeError: Не удается прочитать настройки свойств undefined

Я использую JQuery Validate в форме JQuery Mobile, которая имеет listview с параметром Auto Complete, который создается динамически.

Я получаю эту ошибку, если вы попытаетесь ввести текст в поле автозаполнения, как только проверка будет активна.

Я вижу, что проблема связана с формой, которую jQuery Mobile создает для хранения ввода фильтра, но я не могу понять, как остановить jQuery Validate от проверки поля.

Я могу воспроизвести его, используя JS Fiddle

(Нажмите "Подтвердить", а затем введите поле фильтра)

Любые предложения, оцененные

Спасибо

<body>
<script>
    jQuery.validator.setDefaults({
        ignore: '[data-type="search"]'

    });
</script>
<form>
    <input required>
    <ul id="ac" data-inset="true" data-filter="true" data-filter-reveal="true" data-filter-placeholder="Search cars...">
        <li><a href="#">Acura</a>

        </li>
        <li><a href="#">Audi</a>

        </li>
    </ul>
    <button onclick="$('#ac').attr('data-role','listview');$('#ac').listview();$('form').validate();">Validate</button>
</form>

Ответ 1

Вся ваша проблема возникает из-за динамического HTML, созданного функцией listview(). Проверка DOM показывает, что это динамически создает новый контейнер <form>. Поскольку вы разместили listview в своем контейнере <form>, теперь у вас есть <form></form>, вложенный в <form></form>, что является очень недействительным HTML, и вся причина, по которой плагин jQuery Validate работает настолько неожиданно.

Решение состоит в том, чтобы разместить элемент listview вне вашего контейнера <form>.