我的HTML中有一个对话框。通过向序列号附加序列号,生成一些具有唯一ID的输入元素。当用户单击“Book it!”按钮时,按钮功能使用each()迭代具有相同类的所有输入。这样我就可以获得每个输入的id并使用ajax进行GET调用。该按钮第一次正常工作,但每次之后,带有序列号的输入相乘。非动态生成的输入不会相乘。似乎通过使用each()导致再次创建新的唯一元素。
首次点击“预订!”按钮时,网址的构造正确如下:AddParty?pMemberId=0&pReservationType_0=34&pReservationType_1=63
但是,后续点击会增加这样的长度:AddParty?pMemberId=0&pReservationType_0=34&pReservationType_1=63&pReservationType_0=34&pReservationType_1=63
这是我从servlet返回的HTML文件中的对话框代码。
<div class="reservation">
<div id="dialog-reservation-form" title="Reservation Form">
<input id="pMemberId" name="pMemberId" type="hidden" value="0"/>
<input id="pReservationType_0" class="PartyType" type="hidden" value="0"/>
<input id="pReservationType_1" class="PartyType" type="hidden" value="1"/>
</div>
<input id="plan-party" type="submit" value="Plan Party"/>
</div>
这是我的javascript文件。
$(document).ready(function () {
$("#plan-party").button().click(function (e) {
e.preventDefault();
$("#dialog-party-form").dialog("open");
});
$("#dialog-party-form").dialog( {
autoOpen : false, height : 600, width : 700, modal : true, buttons : {
"Book it!" : function () {
try {
var memberIdValue = document.getElementById("pMemberId").value;
var url = "AddParty?pMemberId=" + memberIdValue;
$(".PartyType").each(function () {
var reservationTypeIdName = $(this).attr('id');
var reservationTypeIdValue = $(this).attr('value');
url = url + "&" + reservationTypeIdName + "=" + reservationTypeIdValue;
});
var ajax = new AJAXInteraction(url, addHuntCallback);
ajax.doGet();
}
catch (e) {
alert(e.description);
}
$(this).dialog("close");
},
Cancel : function () {
$(this).dialog("close");
}
}
});
});