jquery - 表单序列化不起作用

Question

我有以下 ICanHaz 表单模板:

<script id="outcomeFormTemplate" type="text/html">
    <form id="xyz" class="form-horizontal well" data-async data-target="#outcomeFormDialog" method="POST">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal">×</button>
            <h3 id="myModalLabel">Add outcome</h3>
        </div>
        <div class="modal-body">
            <fieldset>
                <label>Amount</label>
                <div class="input-append">
                    <input type="text" placeholder="00.01" />
                    <span class="add-on">{{ currency }}</span>
                </div>
                {{>UserSelectTemplate}}
                {{>CategorySelectTemplate}}
                <label>Comment</label>
                <input type="text" placeholder="Comment here..." />
            </fieldset>
        </div>
        <div class="modal-footer">
            <button class="btn" data-dismiss="modal">Close</button>
            <button type="submit" class="btn btn-primary">Save outcome</button>
        </div>
    </form>
</script>

渲染如下:

<form id="xyz" class="form-horizontal well" data-async="" data-target="#outcomeFormDialog" method="POST">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal">×</button>
            <h3 id="myModalLabel">Add outcome</h3>
        </div>
        <div class="modal-body">
            <fieldset>
                <label>Amount</label>
                <div class="input-append">
                    <input type="text" placeholder="00.01">
                    <span class="add-on">zł</span>
                </div>
                <label>User</label>
    <select>
        <option>choose user</option>
                <option value="pmc">Paul McCartney</option>
                <option value="jl">John Lennon</option>
                <option value="gh">George Harrison</option>
                <option value="rs">Ringo Starr</option>
        </select>
                <label>Category</label>
    <select>
        <option>choose category</option>
                <option value="1">food</option>
                <option value="2">bills</option>
                <option value="3">electronics</option>
                <option value="4">entertainment</option>
                <option value="5">travels</option>
                <option value="6">bread</option>
                <option value="7">bar</option>
                <option value="8">fruits &amp; vegs</option>
                <option value="9">press</option>
                <option value="10">transport</option>
                <option value="11">lunch</option>
                <option value="12">books</option>
                <option value="13">chemistry</option>
                <option value="14">hygiene</option>
                <option value="15">household goods</option>
                <option value="16">house</option>
                <option value="17">rent</option>
                <option value="18">internet</option>
                <option value="19">repairs</option>
                <option value="20">presents</option>
                <option value="21">tools</option>
                <option value="22">cinema</option>
                <option value="23">footwear</option>
                <option value="24">clothing</option>
                <option value="25">| Chmielewskiego</option>
                <option value="26">flowers</option>
                <option value="27">gas</option>
                <option value="28">electricity</option>
                <option value="29">phones</option>
                <option value="30">meds</option>
                <option value="31">meat</option>
                <option value="32">takeaway</option>
                <option value="33">cosmetics</option>
                <option value="34">education</option>
                <option value="45">theatre</option>
                <option value="47">alcohol</option>
                <option value="48">barber</option>
                <option value="49">health</option>
                <option value="50">doctor</option>
                <option value="51">collectibles</option>
                <option value="52">fish</option>
                <option value="53">handout</option>
                <option value="55">souvenirs</option>
        </select>
                <label>Comment</label>
                <input type="text" placeholder="Comment here...">
            </fieldset>
        </div>
        <div class="modal-footer">
            <button class="btn" data-dismiss="modal">Close</button>
            <button type="submit" class="btn btn-primary">Save outcome</button>
        </div>
    </form>

问题是 .serialize() 返回空字符串。这是为什么？我的 html 结构有问题吗？

$("#xyz").serialize()
""

Answer 1

您需要设置表单字段的名称。否则它不知道如何命名字段。我从来没有尝试过，所以我不知道通常会发生什么，但这是有道理的。

例如:

<select name="user">