动态添加未构成正确查询字符串的元素后提交表单答案

【问题标题】：Form Submission after dynamic addition of elements not framing the proper query-string动态添加未构成正确查询字符串的元素后提交表单
【发布时间】：2013-03-07 08:06:52
【问题描述】：

我在 jQuerymobile 页面中创建了一个带有 2 个输入文本字段的表单。但是在单击此表单之外的某个按钮时，我会在 div“ratingInfo”内向该表单动态添加 2 个输入字段。

<form id="rate" method="GET" action="Ratings" data-ajax="false"  onsubmit="return getRating();">
                    <label for="regid">Enter Registration ID : </label>
                    <input type="text" placeholder="regid" id="regid" name="regid" data-mini="true" data-ajax="false" style="width:240px;"/>
                    <fieldset style="margin-top:30px;" data-role="controlgroup" data-type="horizontal" >
                        <legend>Rate the session our of 5 :</legend>
                        <input type="radio" name="radio" id="rating1" value="1" checked="checked">
                        <label for="rating1">1</label>
                        <input type="radio" name="radio" id="rating2" value="2">
                        <label for="rating2">2</label>
                        <input type="radio" name="radio" id="rating3" value="3">
                        <label for="rating3">3</label>
                        <input type="radio" name="radio" id="rating4" value="4">
                        <label for="rating4">4</label>
                        <input type="radio" name="radio" id="rating5" value="5">
                        <label for="rating5">5</label>
                    </fieldset>
                    <div id="ratingInfo" style="margin-top:20px; margin-bottom:20px; color:rgb(177, 175, 175);"></div>                  
                    <button data-inline="true" data-rel="back" data-theme="c" type="reset" >Reset</button>
                    <button data-inline="true" data-transition="flow" type="submit" name="submit" id="submit" data-ajax="false" data-theme="b">Submit</button>
            </form>

我在 getRating() 方法中用于添加动态元素的 jQuery 是：

$( "#ratingInfo" ).empty();
$( "#ratingInfo" ).append( "<span >Session ID - </span><input type='text' style='width:240px; color:rgb(177, 175, 175);' name='eventId' id='eventId' disabled='true'>" );
$("#eventId").val(eventId);
$( "#ratingInfo" ).append( "<br/><span>Session Description - </span><input type='text' style='width:240px; color:rgb(177, 175, 175);' name='eventDesc' disabled='true' id='eventDesc'>" );
$("#eventDesc").val(eventDesc);

当我提交表单时，查询字符串（在 URL 中）只有 2 个参数，即“regId”和“radio”。其余 2 个输入字段“eventId”和“eventDesc”也未添加到 URL 中。但是点击重置按钮，包括动态添加的字段在内的所有字段也会被重置。

什么可能导致这个问题？

【问题讨论】：

标签： html forms query-string form-submit

【解决方案1】：

到目前为止，我已经解决了这个问题。

在“ratingInfo”div 中，我创建了输入元素。对于他们，我已经通过 jquery 给出了值。

我已将样式添加到“ratingInfo”div 为：

display:none;

让它不可见。

谢谢。

【讨论】：