Question

我有这个大表格，必须立即提交。一个长页面不是一个选项，所以我决定将嵌套列表中的部分分开。这是标记的样子：

<form action="/home/index" data-ajax="false" data-transition="pop" id="xmlForm" method="post">

    <ul data-role="listview" data-inset="true">

       <li>
           Section 1
            <ul data-inset="true">
                <li data-role="fieldcontain">
                    <label for="field1">Field1</label>
                    <input type="text" id="field1" />
                </li>
                <li data-role="fieldcontain">
                    <label for="field2">Field2</label>
                    <input type="text" id="field2" />
                </li>
            </ul>
       </li>

       <li>
           Section 2
            <ul data-inset="true">
                <li data-role="fieldcontain">
                    <label for="field4">Field4</label>
                    <input type="text" id="field4" />
                </li>
                <li data-role="fieldcontain">
                    <label for="field5">Field5</label>
                    <input type="text" id="field5" />
                </li>
            </ul>
       </li>

    </ul>

    <div class="ui-body ui-body-b">
        <fieldset>
            <button type="submit" data-theme="a" name="submit" value="submit-value">Process Script</button>
        </fieldset>
    </div>

</form>

但是，一旦我点击“提交”按钮，提交的唯一值就是：

submit:submit-value

表单忽略了所有其他字段。是设计还是我遗失了什么？

Answer 1

您的输入元素应具有name属性（即<input type="text" id="field1" name="field1" />）。

Answer 2

我遇到了同样的问题。如果你看看DOM JQuery将每个子列表重新排列到它自己的页面中。这会导致所有表单字段移出<form></form>标记之外。这就是为什么它们不包括在提交中。

我在所有表单字段中添加了'form'属性：<input type="text" id="field2" form="xmlForm"/>。现在当我提交子列表中的所有字段时都包括在内。

jQuery Mobile - 未提交嵌套列表中的字段

2 个答案: