这是我添加html控件的Html和jquery代码 动态。这是我的jquery的一部分 代码(添加儿童控制数 动态)效果很好。但第二个 添加否的部分。婴儿没有 work.What是什么问题。 为什么secong下拉列表不起作用。??????需要帮助
----------------------第一部分----------------------- ---------------------
<div class="grid_top "><b>
No. Of Children
<strong>
<% = Html.DropDownList("ddlNoOfChildren", new SelectList(new[] { "1", "2", "3", "4", "5", "6" }, ViewData["childs"]), new { id = "ddlNoOfChildren" })%>
</strong>
</b></div>
<div class="ledger_subtable create_tbl" style="margin:1px 0">
<table id="Character" width="100%">
<tr>
<th>
<label>
Mr/Mrs/Ms
</label>
</th>
<th>
<label>
Lastname
</label>
</th>
<th>
<label>
Firstname
</label>
</th>
<th>
<label>
Email Id
</label>
</th>
<th>
<label>Passport No</label>
</th>
<th>
<label>Nationality</label>
</th>
</tr>
<tr id="trow_0">
<td>
<% = Html.DropDownList("ddlSalts_0", new SelectList(new[] { "Mr", "Mrs", "Ms" }))%>
</td>
<td>
<%=Html.TextBox("LastName_0")%>
<%=Html.ValidationMessage("lastname","*")%>
</td>
<td>
<%=Html.TextBox("FirstName_0")%>
<%=Html.ValidationMessage("firstname","*")%>
</td>
<td>
<%=Html.TextBox("EmailId_0")%>
<%=Html.ValidationMessage("emailid","*")%>
</td>
<td>
<%=Html.TextBox("PassportNo_0")%>
<%=Html.ValidationMessage("passportNo","*")%>
</td>
<td>
<% = Html.DropDownList("ddlNationality_", new SelectList(new[] { "Nepali", "Foreigner" }), new { id = "ddlNationality_" })%>
</td>
</tr>
</table></div>
<%-- ----------------------- Second part ----------- --%>
<div class="grid_top "><b>
No. Of Infant
<strong>
<% = Html.DropDownList("ddlNoOfInfants", new SelectList(new[] { "1", "2", "3", "4", "5", "6" }, ViewData["Infants"]), new { id = "ddlNoOfInfants" })%>
</strong>
</b></div>
<div class="ledger_subtable create_tbl" style="margin:1px 0">
<table id="character2" width="100%">
<tr>
<th>
<label>
Mr/Mrs/Ms
</label>
</th>
<th>
<label>
Lastname
</label>
</th>
<th>
<label>
Firstname
</label>
</th>
<th>
<label>
Email Id
</label>
</th>
<th>
<label>Passport No</label>
</th>
<th>
<label>Nationality</label>
</th>
</tr>
<tr id="trow2_0">
<td>
<% = Html.DropDownList("ddlSalts2_0", new SelectList(new[] { "Mr", "Mrs", "Ms" }))%>
</td>
<td>
<%=Html.TextBox("LastName2_0")%>
<%=Html.ValidationMessage("lastname", "*")%>
</td>
<td>
<%=Html.TextBox("FirstName2_0")%>
<%=Html.ValidationMessage("firstname", "*")%>
</td>
<td>
<%=Html.TextBox("EmailId2_0")%>
<%=Html.ValidationMessage("emailid", "*")%>
</td>
<td>
<%=Html.TextBox("PassportNo2_0")%>
<%=Html.ValidationMessage("passportNo", "*")%>
</td>
<td>
<% = Html.DropDownList("ddlNationality2_", new SelectList(new[] { "Nepali", "Foreigner" }), new { id = "ddlNationality2_" })%>
</td>
</tr>
</table></div>
----------------------------- Jquery -------------------------------------
<script type="text/javascript">
$(document).ready(function () {
var flag = false;
function removeDynamicallyCreatedRows() {
var rowCount = $('#Character tr').length;
for (var x = 1; x <= rowCount; x++) {
$('#trow_' + x).remove();
}
}
function removeDynamicallyCreatedRows2() {
var rowCount = $('#Character2 tr').length;
for (var x = 1; x <= rowCount; x++) {
$('#trow2_' + x).remove();
}
}
///////////////////////////No of Infants/////////////////////////////
$("#ddlNoOfChildren").change(function () {
if (flag) {
removeDynamicallyCreatedRows();
}
flag = true;
var self = $(this).val();
//Keep the info for no of passengers that is added
$("#noOfPassengers").val(self);
var countChar = 0;
$("[name=ddlSalts_]").attr("Name", "ddlSalts_" + countChar);
$("[name=LastName_]").attr("Name", "LastName_" + countChar);
$("[name=FirstName_]").attr("Name", "FirstName_" + countChar);
$("[name=EmailId_]").attr("Name", "EmailId_" + countChar);
$("[name=PassportNo_]").attr("Name", "PassportNo_" + countChar);
$("[name=ddlNationality_]").attr("Name", "ddlNationality_" + countChar);
$("[id=ddlSalts_]").attr("Id", "ddlSalts_" + countChar);
$("[id=LastName_]").attr("Id", "LastName_" + countChar);
$("[id=FirstName_]").attr("Id", "FirstName_" + countChar);
$("[id=EmailId_]").attr("Id", "EmailId_" + countChar);
$("[id=PassportNo_]").attr("Id", "PassportNo_" + countChar);
$("[id=ddlNationality_]").attr("Id", "ddlNationality_" + countChar);
for (var i = 1; i < self; i++) {
var newCharacter = '<tr id = "trow_' + i + '">'
+ '<td><select id = "ddlSalts_' + i + '" name="ddlSalts_' + i + '"><option value = "1">Mr</option><option value = "2">Mrs</option><option value= "3">Ms</option></select></td>'
+ '<td><input type = "text" name = "LastName_' + i + '" id = "LastName_' + i + '"></td>'
+ '<td><input type = "text" name = "FirstName_' + i + '" id = "FirstName_' + i + '"></td>'
+ '<td><input type = "text" name = "EmailId_' + i + '" id = "EmailId_' + i + '"></td>'
+ '<td><input type = "text" name = "PassportNo_' + i + '" id = "PassportNo_' + i + '"></td>'
+ '<td><select id = "ddlNationality_' + i + '" name = "ddlNationality_' + i + '" ><option value = "1">Nepali</option><option value = "2">Foreigner</option></select></td>'
+
'</tr>'
$("#Character tr:last").after(newCharacter);
}
return;
});
$("#ddlNoOfInfants").change(function () {
if (flag) {
removeDynamicallyCreatedRows2();
}
flag = true;
var self = $(this).val();
//Keep the info for no of passengers that is added
//$("#noOfPassengers").val(self);
var countChar = 0;
$("[name=ddlSalts2_]").attr("Name", "ddlSalts2_" + countChar);
$("[name=LastName2_]").attr("Name", "LastName2_" + countChar);
$("[name=FirstName2_]").attr("Name", "FirstName2_" + countChar);
$("[name=EmailId2_]").attr("Name", "EmailId2_" + countChar);
$("[name=PassportNo2_]").attr("Name", "PassportNo2_" + countChar);
$("[name=ddlNationality2_]").attr("Name", "ddlNationality2_" + countChar);
$("[id=ddlSalts2_]").attr("Id", "ddlSalts2_" + countChar);
$("[id=LastName2_]").attr("Id", "LastName2_" + countChar);
$("[id=FirstName2_]").attr("Id", "FirstName2_" + countChar);
$("[id=EmailId2_]").attr("Id", "EmailId2_" + countChar);
$("[id=PassportNo2_]").attr("Id", "PassportNo2_" + countChar);
$("[id=ddlNationality2_]").attr("Id", "ddlNationality2_" + countChar);
for (var i = 1; i < self; i++) {
var newCharacter = '<tr id = "trow2_' + i + '">'
+ '<td><select id = "ddlSalts2_' + i + '" name="ddlSalts2_' + i + '"><option value = "1">Mr</option><option value = "2">Mrs</option><option value= "3">Ms</option></select></td>'
+ '<td><input type = "text" name = "LastName2_' + i + '" id = "LastName2_' + i + '"></td>'
+ '<td><input type = "text" name = "FirstName2_' + i + '" id = "FirstName2_' + i + '"></td>'
+ '<td><input type = "text" name = "EmailId2_' + i + '" id = "EmailId2_' + i + '"></td>'
+ '<td><input type = "text" nam e = "PassportNo2_' + i + '" id = "PassportNo2_' + i + '"></td>'
+ '<td><select id = "ddlNationality2_' + i + '" name = "ddlNationality2_' + i + '" ><option value = "1">Nepali</option><option value = "2">Foreigner</option></select></td>'
+
'</tr>'
$("#Character2 tr:last").after(newCharacter);
}
return;
});
});
</script>
答案 0 :(得分:0)
你的选择器(“#Character”)是一个ID,当你的选择器是一个ID时,jQuery只返回一个元素。你应该使用标签名称或类。