Формы Jquery Mobile не отправляются, если поля ввода находятся внутри представления списка

Question

У меня есть базовая форма входа в систему в моем приложении Jquery Mobile, и, поскольку мне нравится, как выглядят списки, особенно с data-inset = true, я решил поместить свои поля и кнопку отправки в тег <li>. Однако, когда я сделаю это, моя форма не будет отправлена. Если я удаляю код списка (теги <ul> и <li>), он работает.

Вот мой код со списком:

<form action="index.php" name="frmLogin" method="post">
        <ul data-role="listview" data-inset="true">
            <li data-role="list-divider" role="heading" tabindex="0">Member login</li>
            <li><input type="text" name="login-email" id="login-email" value="Email" /></li>
            <li><input type="password" name="login-password" id="login-password" value="Password" /></li>
            <li><button type="submit" name="login-submit" id="login-submit" data-icon="arrow-r" data-iconpos="right">LOG ON</button></li>
        </ul>
    </form>

Итак, что происходит, так это то, что форма вообще не реагирует на приведенный выше код. Он даже не показывает стандартное наложение «Загрузка», которое обычно отображается при отправке формы.

Есть идеи?

Спасибо большое!

Answer 1

Вам нужно , чтобы использовать <ul>?Вы можете получить похожий макет, заключив свои входные данные в <div data-role="fieldcontain">.

Взгляните на макет и разметку здесь, например

Answer 2

Я использовал атрибут data-ajax="false", у меня отлично работает. Мои поля ввода также находятся в элементе списка.

(попробуйте добавить Jquery-Mobile в теги вашего сообщения, чтобы получить больше откликов :))

Answer 3

Я никогда не использовал jQuery Mobile, но вы могли бы клонировать форму (убрав ul & li), когда нажали #login-submit, и отправить ее.