如果在Bootstrap Modal上选择"否",如何从DropDownList中删除项目



场景:用户将从下拉列表中进行选择。这是下拉代码:

@Html.DropDownList("ddlRequestMade", new List<SelectListItem>
{
new SelectListItem{ Text="Please Select", Value = "Please Select" },
new SelectListItem{ Text="Stuff", Value = "Stuff" },
new SelectListItem{ Text="Card", Value = "Card" },
}, new { @class = "form-control" })

如果用户在下拉菜单中选择"卡"选项,则出现引导模式:

基本模态代码:

<!-- Modal -->
<div class="modal" id="myModal">
<div class="modal-dialog">
<div class="modal-content">
<!-- Modal header -->
<div class="modal-header">
<h4 class="modal-title">Card?</h4>
</div>
<!-- Modal body -->
<div class="modal-body">
Confirm ?
</div>
<!-- Modal footer -->
<div class="modal-footer">
<button type="button" class="btn btn-success" data-dismiss="modal">Yes</button>
<button type="button" class="btn btn-success" data-dismiss="modal">No</button>
</div>
</div>
</div>
</div>

当用户单击"否"时,Modal应关闭,最好从下拉列表中删除"卡"选项。如何使用javascript实现这一点?

下面是我的js代码来显示模式:

$(function () {
$("#ddlRequestMade").change(function () {
if ($(this).val() == "Card") {
$("#dvToShowOrHide").show();
$("#dvToShowOrHideP2").show();
$("#myModal").modal('show');
} else {
$("#dvToShowOrHide").hide();
$("#dvToShowOrHideP2").hide();
}
});
});
$("button[data-dismiss=modal]").click(function () {
$(".modal").modal('hide');
});

从选择中删除选项

$("button[data-dismiss=modal]").click(function () {
$(".modal").modal('hide');
$("#ddlRequestMade option[value='Card']").remove();
$("#ddlRequestMade").val('Please Select');
});

最新更新