如何从数据库基于级联下拉列表中选择值的属性值？ [英] How to get a property value from database based on cascaded drop down list selected values??
本文介绍了如何从数据库基于级联下拉列表中选择值的属性值？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我想获得基于通过级联从下拉列表中选择项的ID ......在每一个变化在1级或级联2级实体的属性下拉列表中，价格必须更新。
我已经实现级联下拉列表。在页面加载的 Leaguedropdown（1级）填充和第二的 LeagueDivisiondropdown（2级）当我选择从1级。我要实现的价格计算器任何项目填充应根据级联从下拉列表中选择的项目价格计算的价值，所有的价格都存储在数据库中，我使用实体框架。
我使用.change（）方法，并发送了2级这是工作的罚款的getJSON请求。我也想在1级相同的功能，但我已经用.change（）方法来填充LeagueDivision所以我不知道如何实现这个水平上也1。
我将不胜感激，如果有人将引导我，会心存感激。
这里查看和脚本
<身体GT;
< p n =消息>< / P>
@using（Html.BeginForm（PriceCalculatorIndex，PriceCalculator，FormMethod.Post，
新的{ENCTYPE =的multipart / form-data的}））
{
< DIV>
@ Html.LabelFor（M = GT; m.SelectedLeague，新{@class =控制勒贝尔}）
@ Html.DropDownListFor（M = GT; m.SelectedLeague，Model.LeagueList，新{@class =表格控}）
@ Html.ValidationMessageFor（M = GT; m.SelectedLeague）
< / DIV>
< DIV>
@ Html.LabelFor（M = GT; m.SelectedLeagueDivision，新{@class =控制勒贝尔}）
@ Html.DropDownListFor（M = GT; m.SelectedLeagueDivision，Model.LeagueDivisionList，新{@class =表格控}）
@ Html.ValidationMessageFor（M = GT; m.SelectedLeagueDivision）
< / DIV>
< DIV>
@ Html.LabelFor（M = GT; m.Price）
@ Html.DisplayFor（M = GT; m.Price）
< / DIV>
}
<！ - JS包括 - >
<脚本的src =// ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js\"></script>
<脚本的src =// netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js\"></script>
<脚本的src =// ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js\"></script>
<脚本的src =// ajax.aspnetcdn.com/ajax/mvc/4.0/jquery.validate.unobtrusive.min.js\"></script>
<脚本类型=文/ JavaScript的>
变种leaguedivisionUrl ='@ Url.Action（Fetchleaguedivision）'; @ Url.Action（updatePrice）'
VAR updatePrice =;
变种师= $（'＃SelectedLeagueDivision'）;
$（'＃SelectedLeague'）改变（函数（）{
divisions.empty（）;
$ .getJSON（leaguedivisionUrl，{ID：$（本）.VAL（）} ，功能（数据）{
如果{
回报率（数据！）;
}
divisions.append（$（'<选项>< /选项>'）。 VAL（））;
$。每次（数据，功能（索引，项目）{
divisions.append（$（'<选项>< /选项>'）。VAL（item.Value ）的.text（item.Text））;
}）;
}）;
}）;
$（'＃SelectedLeagueDivision'）改变（函数（）{
$ .getJSON（updatePrice，{LeagueDivisionId：$（本）.VAL（），LeagueId： $（'＃SelectedLeague）VAL（）}，功能（数据）{
如果{
回报率（数据！）;
}
警报（数据）;
//document.getElementById('#message').innerHTML =数据;
}）;
}）;
< / SCRIPT>
JSON结果从数据库
公共JsonResult updatePrice（INT LeagueId，诠释LeagueDivisionId）
{$ b $取价b
HostBoostersDBEntities2 DB =新HostBoostersDBEntities2（）;
CalculatorPrice updatedPrice = db.CalculatorPrices
。凡（X => x.LeagueId == LeagueId
和;&安培;
x.LeagueDivisionId == LeagueDivisionId）
.FirstOrDefault（）;
十进制updatedPriceToView =（十进制）updatedPrice.Price;
返回JSON（updatedPriceToView.ToString（），JsonRequestBehavior.AllowGet）;
}
解决方案
我用这种方式成功实施。
@using（Html.BeginForm（PriceCalculatorIndex，PriceCalculator，FormMethod.Post，
新的{ENCTYPE =的multipart / form-data的}））
{
< DIV>
@ Html.LabelFor（M = GT; m.SelectedLeague，新{@class =控制勒贝尔}）
@ Html.DropDownListFor（M = GT; m.SelectedLeague，Model.LeagueList，新{@class =表格控}）
@ Html.ValidationMessageFor（M = GT; m.SelectedLeague）
< / DIV>
< DIV>
@ Html.LabelFor（M = GT; m.SelectedLeagueDivision，新{@class =控制勒贝尔}）
@ Html.DropDownListFor（M = GT; m.SelectedLeagueDivision，Model.LeagueDivisionList，新{@class =表格控}）
@ Html.ValidationMessageFor（M = GT; m.SelectedLeagueDivision）
< / DIV>
< DIV>
<标签>
价格：
< /标签>
<跨度ID =spPrice>< / SPAN>
< / DIV>
}
<！ - JS包括 - >
<脚本的src =// ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js\"></script>
<脚本的src =// netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js\"></script>
<脚本的src =// ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js\"></script>
<脚本的src =// ajax.aspnetcdn.com/ajax/mvc/4.0/jquery.validate.unobtrusive.min.js\"></script>
<脚本类型=文/ JavaScript的>
$（函数（）{
LoadDivisionsAndPrice（）
}）;
变种leaguedivisionUrl ='@ Url.Action（Fetchleaguedivision）'; @ Url.Action（updatePrice）'
VAR updatePrice =;
变种师= $（'＃SelectedLeagueDivision'）;
$（'＃SelectedLeague'）改变（函数（）{
LoadDivisionsAndPrice（）;
}）。
$（'＃SelectedLeagueDivision'）改变（函数（）{
LoadPrice（）;
}）。
功能LoadPrice（）{
$ .getJSON（updatePrice，{LeagueId：$（'＃SelectedLeague）VAL（），LeagueDivisionId：$（'＃SelectedLeagueDivision）VAL（）}，函数（数据）{
如果（数据！）{
的回报;
}
的document.getElementById（'spPrice'）的innerText = data.Price;
}） ;
}
功能LoadDivisionsAndPrice（）
{
divisions.empty（）;
$ .getJSON（leaguedivisionUrl，{ID：$（'＃SelectedLeague）VAL（）}！，功能（数据）{
如果（数据）{
的回报;
}
divisions.append（$（'<选项>< /选项>'）。VAL（））;
$。每次（数据，功能（索引，项目）{
divisions.append（$（'<选项>< /选项>'）。VAL（item.Value）的.text（item.Text））;
}）;
LoadPrice（）;
}）;
}
< / SCRIPT>
I want to get a property of an entity based on passing id's of selected items from cascaded dropdown list...On every change in level 1 or in level 2 of cascaded drop down list, price must be updated.
I have implemented cascaded drop down list. On page load Leaguedropdown (Level 1) populates and second LeagueDivisiondropdown (Level 2) populates when I select any item from Level 1. I have to implement Price Calculator which should calculate price value depending upon selected items from cascaded drop down list, all prices are stored in database and I am using Entity Framework. I am using .change() method and sending getJson request for Level 2 which is working fine. I also want same functionality on Level 1 but I already used .change() method to populate LeagueDivision so I don't have idea how to implement this on Level 1 too.
I will appreciate if some one will guide me and will be thankful.
Here is View and Script
<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 Result to fetch price from database
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); }
解决方案I have implemented successfully in this way.
@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> <label> price : </label> <span id="spPrice"></span> </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"> $(function () { LoadDivisionsAndPrice() }); var leaguedivisionUrl = '@Url.Action("Fetchleaguedivision")'; var updatePrice = '@Url.Action("updatePrice")'; var divisions = $('#SelectedLeagueDivision'); $('#SelectedLeague').change(function () { LoadDivisionsAndPrice(); }); $('#SelectedLeagueDivision').change(function () { LoadPrice(); }); function LoadPrice() { $.getJSON(updatePrice, { LeagueId: $('#SelectedLeague').val(), LeagueDivisionId: $('#SelectedLeagueDivision').val() }, function (data) { if (!data) { return; } document.getElementById('spPrice').innerText = data.Price; }); } function LoadDivisionsAndPrice() { divisions.empty(); $.getJSON(leaguedivisionUrl, { ID: $('#SelectedLeague').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)); }); LoadPrice(); }); } </script>这篇关于如何从数据库基于级联下拉列表中选择值的属性值？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
