我不知道发生了什么,但这个功能似乎根本不起作用。
以下是我的看法:
<tr>
<th>Category</th>
<td>
<select class="form-control" ng-model="masterlist.category_id" ng-options="c.category_id as c.category_name for c in category" required data-ng-change="getSubCategory(c.category_id)"></select>
</td>
</tr>
<tr>
<th>Sub Category</th>
<td>
<select class="form-control" ng-model="masterlist.sub_category_id" ng-options="c.sub_category_id as c.sub_category_name for c in subCategory" required></select>
</td>
</tr>
Angular JS
$scope.getSubCategory = function (category_id) {
$http.get('/MasterList/SubCategory' + category_id).then(function ($response) {
$scope.subCategory = $response.data;
});
}
控制器:
public ActionResult SubCategory(int id)
{
db.Configuration.ProxyCreationEnabled = false;
return Json(db.Sub_Category.Where(x => x.active_flag == true && x.category_id == id).ToList(), JsonRequestBehavior.AllowGet);
}
我在控制台上进行了检查,但没有任何错误,下面是inspect元素视图:
我的主要目标是一旦类别被选中,子类别的显示将只显示该类别下的那些。
提前感谢你的帮助。
2条答案
按热度按时间gdrx4gfi1#
select元素的ng-model被设置为
masterlist.category_id
,因此应该将其传递给getSubCategory方法。您还需要发送一个URL模式为
SubCategory/3
的请求,其中3是类别ID值。根据您当前的代码,它将向SubCategory3
发出请求,如果您检查浏览器的网络选项卡,您将看到404错误。您应该在catetory_id变量和操作方法名称之间添加一个
/
,我也建议把http调用移到一个可以注入到你的控制器的数据服务。同样,你不应该像在js文件中那样硬编码url。试着使用Url.Action helper方法来生成正确的相对url到你的action方法/api端点,就像在这篇文章和这篇文章中解释的那样。
xj3cbfub2#
仅在值更改时更改范围。