我想根据传递的级联下拉列表中所选项目的ID获取实体的属性...在级联下拉列表的第1层或第2层的每次更改中，必须更新价格。
我已经实现了级联下拉列表。在页面加载时，当我从级别1中选择任何项目时，将填充Leaguedropdown（第1级），并填充第二个LeagueDivisiondropdown（第2级）。我必须实现价格计算器，该价格计算器应根据从级联下拉列表中选择的项目来计算价格值，所有价格均为存储在数据库中，我正在使用实体框架。
我正在使用.change（）方法并发送对Level 2的getJson请求，该请求工作正常。我也希望在Level 1上具有相同的功能，但是我已经使用.change（）方法填充LeagueDivision，所以我也不知道如何在Level 1上实现此功能。
如果有人会引导我，我将不胜感激。
这是视图和脚本
<body>
<p id="message"></p>
@using (Html.BeginForm("PriceCalculatorIndex", "PriceCalculator", FormMethod.Post,
new { enctype = "multipart/form-data" }))
{
<div>
@Html.LabelFor(m => m.SelectedLeague, new { @class = "control-lebel" })
@Html.DropDownListFor(m => m.SelectedLeague, Model.LeagueList, new { @class = "form-control" })
@Html.ValidationMessageFor(m => m.SelectedLeague)
</div>
<div>
@Html.LabelFor(m => m.SelectedLeagueDivision, new { @class = "control-lebel" })
@Html.DropDownListFor(m => m.SelectedLeagueDivision, Model.LeagueDivisionList, new { @class = "form-control" })
@Html.ValidationMessageFor(m => m.SelectedLeagueDivision)
</div>
<div>
@Html.LabelFor(m => m.Price)
@Html.DisplayFor(m => m.Price)
</div>
}
<!-- JS includes -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<script src="//ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
<script src="//ajax.aspnetcdn.com/ajax/mvc/4.0/jquery.validate.unobtrusive.min.js"></script>
<script type="text/javascript">
var leaguedivisionUrl = '@Url.Action("Fetchleaguedivision")';
var updatePrice = '@Url.Action("updatePrice")';
var divisions = $('#SelectedLeagueDivision');
$('#SelectedLeague').change(function () {
divisions.empty();
$.getJSON(leaguedivisionUrl, { ID: $(this).val() }, function (data) {
if (!data) {
return;
}
divisions.append($('<option></option>').val());
$.each(data, function (index, item) {
divisions.append($('<option></option>').val(item.Value).text(item.Text));
});
});
});
$('#SelectedLeagueDivision').change(function () {
$.getJSON(updatePrice, { LeagueDivisionId: $(this).val(), LeagueId: $('#SelectedLeague').val() }, function (data) {
if (!data) {
return;
}
alert(data);
//document.getElementById('#message').innerHTML = data;
});
});
</script>
JSON结果从数据库中获取价格
public JsonResult updatePrice(int LeagueId, int LeagueDivisionId)
{
HostBoostersDBEntities2 db = new HostBoostersDBEntities2();
CalculatorPrice updatedPrice = db.CalculatorPrices
.Where(x => x.LeagueId == LeagueId
&&
x.LeagueDivisionId == LeagueDivisionId)
.FirstOrDefault();
decimal updatedPriceToView = (decimal)updatedPrice.Price;
return Json(updatedPriceToView.ToString(), JsonRequestBehavior.AllowGet);
}
javascript大神给出的解决方案
请尝试此代码。在您认为我仍然误解了该问题的地方提供我的JavaScript注释的引用。
<script type="text/javascript">
var leaguedivisionUrl = '@Url.Action("Fetchleaguedivision")';
var updatePrice = '@Url.Action("updatePrice")';
var divisions = $('#SelectedLeagueDivision');
function bindLeagueDivisionData(data) {
divisions.empty();
$.each(data, function(index, item) {
divisions.append($('<option></option>').val(item.Value).text(item.Text));
});
}
function getUpdatedPrice(leagueId, divisionId) {
$.getJSON(updatePrice, {
LeagueDivisionId: divisionId,
LeagueId: leagueId
}, function(data) {
if (!data) {
return;
}
alert(data);
//document.getElementById('#message').innerHTML = data;
});
}
$('#SelectedLeague').change(function() {
if (divisions.find("option").length == 0) {
/*The division list is empty, fetch the divisions*/
$.getJSON(leaguedivisionUrl, {
ID: $(this).val()
}, function(data) {
if (!data) {
return;
}
/*Once division data is bound, get the price for the league and first selected division. If you choose to leave first division as empty, your wish; just remove the contents of done in that case*/
$.when(bindLeagueDivisionData(data)).done(function() {
getUpdatedPrice($(this).val(), $('#SelectedLeagueDivision'));
});
});
} else {
/*Divisions are already present just get the price for the combination*/
getUpdatedPrice($(this).val(), $('#SelectedLeagueDivision'));
}
});
$('#SelectedLeagueDivision').change(function() {
/*Get the price for the combination*/
getUpdatedPrice($('#SelectedLeague').val(), $(this).val());
});
</script>
我使用脚本用JavaScript切换了一些div。如果要选中复选框以显示toogle div，我想在toogle div中设置一些“必填”输入字段。有人能弄清楚吗？那是工作吗？function show(id) { if(document.getElementById) { var mydiv = document.getElementById(id); m…
PHP stringID无法从回显中读入onclick - javascript我有一个音频播放器，可以在HTML中正常工作，但是当我从PHP回显调用时，似乎没有得到div ID的名称，因此它无法播放我的音频。这是我的代码：// Show audio if ($sObj->get('audio') != null) { $sAudio = $sObj->get('audio'); $a…
在php中单击按钮添加表行并设置字段值 - javascript我有一个表单，必须在单击按钮时添加表行。这是我必须动态添加的表行：（addProdToGroup.php）<tr style="text-align: center;" id="products"> <td><?php $j ?></td> <td><s…
淘汰赛在金字塔中的行为不正确 - javascript我正在使用Pyramid构建一个Webapp，但是Knockout的行为有所不同。我有一个表格： <div data-bind="with: $root.itemToAdd" style="display: none;"> <form data-bind="submit: $root.add…
粗糙的Unicode->没有CLDR的语言代码？ - javascript我在写字典应用。如果用户键入Unicode字符，我想检查该字符是哪种语言。例如字 - returns ['zh', 'ja', 'ko'] العربية - returns ['ar'] a - returns ['en', 'fr', …