问题描述
我在asp.net核心MVC项目的一小部分中使用AngularJs，使用两个dropdownlist和一个使用textBox的文本框，我能够保存和编辑数据，但是使用dropdownlist，我无法在发布数据后重置dropdownlist我也无法通过下拉菜单编辑记录。
这是我的代码
<table ng-table="tblCustomers" class="table" cellpadding="0" cellspacing="0">
<tr>
<th>Stakes</th>
<th>supplier</th>
<th>Description</th>
<th></th>
</tr>
<tbody ng-repeat="m in ST">
<tr>
<td>
<span ng-hide="m.EditMode">{{m.stakeName}}</span>
<select ng-model="StakeId" value="{{ m.stakeId }}" ng-options="s.stakeName for s in StakeList track by s.stakeId" ng-show="m.EditMode" class="form-control">
<option value="">Select Stake</option>
</select>
</td>
<td>
<span ng-hide="m.EditMode">{{m.supplierName}}</span>
<select ng-model="supplierId" value="{{ m.supplierId }}" ng-options="a.supplierName for a in supplierList track by a.supplierId" ng-show="m.EditMode" class="form-control">
<option value="">Select supplier</option>
</select>
</td>
<td>
<span ng-hide="m.EditMode">{{m.description}}</span>
<input type="text" ng-model="m.description" ng-show="m.EditMode" />
</td>
<td>
<a class="Edit" href="javascript:;" ng-hide="m.EditMode" ng-model="m.stakeTransId" ng-click="Edit($index)">Edit</a>
<a class="Update" href="javascript:;" ng-show="m.EditMode" ng-click="Update($index)">Update</a>
<a class="Cancel" href="javascript:;" ng-show="m.EditMode" ng-click="Cancel($index)">Cancel</a>
</td>
</tr>
</tbody>
</table>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td>
<select ng-model="StakeId" value="{{ m.stakeId }}" ng-options="s.stakeName for s in StakeList track by s.stakeId" ng-show="m.EditMode" class="form-control">
<option value="">Select Share</option>
</select>
</td>
<td>
<select ng-model="supplierId" value="{{ m.supplierId }}" ng-options="a.supplierName for a in supplierList track by a.supplierId" ng-show="m.EditMode" class="form-control">
<option value="">Select Agent</option>
</select>
</td>
<td width="150px">
<input ng-model="Description" placeholder="Description" class="form-control" />
</td>
<td>
<input type="button" value="Add" id="Save" ng-click="Savedata()" />
</td>
</tr>
</table>
这是我的控制器代码
[HttpPost]
public JsonResult AddStakeTrans(int supplierId,int stakeId,string desc)
{
StakeTran stakeTrans = new StakeTran();
shareTrans.supplierId = supplierId;
shareTrans.StakeId = stakeId;
shareTrans.Description = desc;
db.Insert(stakeTrans);
//after posting data to get inserted record to display in table
StakeTransviewmodel stakeTransviewmodel = new StakeTransviewmodel();
stakeTransviewmodel.supplierName = db.ExecuteScalar<string>("Select supplierName from supplier where supplierId = @0",supplierId);
stakeTransviewmodel.StakeName = db.ExecuteScalar<string>("Select StakeName from Stake where StakeId = @0",stakeId);
stakeTransviewmodel.Description = desc;
//to get the dropdownlist
stakeTransviewmodel.StakeList = db.Fetch<Stake>("Select StakeId,StakeName from Share").ToList();
stakeTransviewmodel.supplierList = db.Fetch<supplier>("Select supplierId,supplierId from supplier").ToList();
return Json(stakeTransviewmodel);
}
这是我发布和编辑数据的角度代码
$scope.StakeList = "";
$scope.supplierList = "";
$scope.Savedata = function () {
$http({
method: "POST",url: "/StakeTrans/AddStakeTrans",data: $.param({
supplierId: $scope.supplierId.supplierId,stakeId: $scope.StakeId.stakeId,desc: $scope.Description
}),headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
}).then(function (data) {
$scope.ST.StakeName = data.data.StakeName;
$scope.ST.supplierName = data.data.supplierName;
$scope.StakeList = data.data.stakeList;
$scope.supplierList = data.data.supplierList;
$scope.StakeId = data.data.stakeList;
$scope.supplierId = data.data.supplierList;
$scope.ST.push(data.data);
$scope.btntext = "Save";
},function (error) {
});
$scope.StakeTransId = "";
$scope.StakeId = "";
$scope.StakeName = "";
$scope.supplierId = "";
$scope.supplierName = "";
$scope.Description = "";
};
//This variable is used to store the original values.
$scope.EditItem = {};
//Editing an existing record.
$scope.Edit = function (index) {
$scope.ST[index].EditMode = true;
$scope.EditItem.stakeId = $scope.ST[index].StakeId.stakeId;
$scope.EditItem.supplierId = $scope.ST[index].supplierId.supplierId;
$scope.EditItem.description = $scope.ST[index].description;
//the update code
};
在编辑模式下，我想隐藏行中的数据，除了我有编辑按钮外，还显示文本框和下拉列表，以及该ID的值，就像我们通常在编辑模式下一样，然后单击更新进行更新当我单击添加按钮时，该记录也处于添加模式，该记录已成功添加并成功显示在网格中，但我的下拉列表没有重置。
所以这是我面临的全部问题，我没有得到解决方案，有人可以建议我如何使用angular js在添加和编辑模式下成功使dropdownlist工作的解决方案。
解决方法
控制器中存在两个错误。
[HttpPost]
public JsonResult AddStakeTrans(int supplierId,int stakeId,string desc)
{
StakeTran stakeTrans = new StakeTran();
//ERROR1
//shareTrans.SupplierId = supplierId;
stakeTrans.SupplierId = supplierId;
//shareTrans.StakeId = stakeId;
stakeTrans.StakeId = stakeId;
//shareTrans.Description = desc;
stakeTrans.Description = desc;
db.Insert(stakeTrans);
//after posting data to get inserted record to display in table
StakeTransViewModel stakeTransViewModel = new StakeTransViewModel();
stakeTransViewModel.SupplierName = db.ExecuteScalar<string>("Select SupplierName from Supplier where SupplierId = @0",supplierId);
stakeTransViewModel.StakeName = db.ExecuteScalar<string>("Select StakeName from Stake where StakeId = @0",stakeId);
stakeTransViewModel.Description = desc;
//to get the dropdownlist
stakeTransViewModel.StakeList = db.Fetch<Stake>("Select StakeId,StakeName from Share").ToList();
//ERROR 2
//stakeTransViewModel.SupplierList = db.Fetch<Supplier>("Select SupplierId,SupplierId from Supplier").ToList();
stakeTransViewModel.SupplierList = db.Fetch<Supplier>("Select SupplierId,SupplierName from Supplier").ToList();
return Json(stakeTransViewModel);
}