在我的在線註冊應用程序中,我創建了兩個模型,如下所示。 TeamModel用於存儲關於團隊和項目的信息,而MemberModel將包含關於團隊成員的信息。在回發中保留動態生成的複選框的值
public class MemberModel
{
[Display(Name = "Member Name")]
public string MemberName { get; set; }
[Display(Name = "Speciality")]
public string Speciality { get; set; }
public bool IsLeader { get; set; }
}
public class TeamModel
{
[Display(Name = "Team Name")]
public string TeamName { get; set; }
[Display(Name = "Project Name")]
public string ProjectName { get; set; }
[Display(Name = "Project Details")]
public string ProjectDetails { get; set; }
public List<MemberModel> MemberModel { get; set; }
}
一個團隊可以包含任何數量的成員,所以我採取了TeamModel中的MemberModel列表。在渲染模型時,我用5個空白元素實例化了MemberModel。所以在我看來,會有5位會員的表格加入「添加更多會員」鏈接。
現在,當用戶點擊「添加更多會員」鏈接時,我會檢查是否所有5行已填充?如果是這樣,我會使用jQuery添加一個新行。這兩個功能都可以實現如下。
$("#AddMoreMember").click(function() {
var rowCount = $("#tblOptions tr:gt(0)").length;
var MemberName = "MemberModel[" + rowCount + "].MemberName";
var MemberId = "Member" + rowCount;
var Speciality = "MemberModel[" + rowCount + "].Speciality";
var SpecialityId = "Speciality" + rowCount;
var IsLeader = "MemberModel[" + rowCount + "].IsLeader";
var LeaderId = "Leader" + rowCount;
var flag = false;
for (var i = 0; i < rowCount; i++) {
var UserDetail = "MemberModel_" + i + "__MemberName";
var value = $("#" + UserDetail).val();
if (value == null || value == "") {
flag = true;
}
}
if (flag == false) {
var NameTag = '<input type="text" value="" style="width:200px" maxlength="1000" name="' + MemberName + '" id = "' + MemberId + '" data-val-regex-pattern="^[^<>~%^;/|]+" data-val-regex="^&lt;&gt;~%;/| characters are not allowed in option" data-val="true" class="input-validation-error">';
var SpecialityTag = '<input type="text" value="" style="width:200px" maxlength="1000" name="' + Speciality + '" id = "' + SpecialityId + '" data-val-regex-pattern="^[^<>~%^;/|]+" data-val-regex="^&lt;&gt;~%;/| characters are not allowed in option" data-val="true" class="input-validation-error">';
var LeaderTag = '<input type="checkbox" value="false" onclick="CheckDefault(this);" name="' + IsLeader + '" id="' + LeaderId + '">';
var html = '<tr><td align="left" style="width: 30%">' + NameTag + '</td><td align="left" style="width: 30%">' + SpecialityTag + '</td><td align="left" style="width: 30%">' + LeaderTag + '</td></tr>';
$("#tblOptions tr:last").after(html);
}
});
function CheckDefault(obj)
{
var id = $(obj).attr("id");
$("input:checkbox[id*=MemberModel]").each(
function(){
var radioID = $(this).attr("id");
if (radioID != id)
{
$("#" + radioID).prop("checked",false);
}
}
);
}
現在,當我添加更多行並選擇IsLeader複選框時,它不會保留它的值,而它將返回到post方法。
我該怎麼做才能使動態生成的複選框的值相關?
無論何時發生回發,您都將獲得一組全新的數據。它會擦除並呈現新的請求。另外你可以在Session或Hidden控件中存儲值,或者將它發送到斷開並保存在ViewBag或ViewData中。 –
@Ravi:我得到所有其他數據,只是複選框值不可用。 –