我在我的表中添加了一个空行,它是通过使用angular-JS传递json对象而动态创建的。
我无法在表格中添加空白行。空白json行未与现有json对象/数组正确连接。
如何在动态创建表上添加新的空白行。代码如下。
这是我的代码:
//--CRUD.cshtml--//
<div ng-controller="crudController">
<div class="row">
<div class="col-lg-12 col-md-12 col-xs-12">
<table class="table table-condensed">
<thead>
<tr>
<th>S.No.</th>
<th ng-repeat="key in keys" ng-if="key!='UID'">{{key}}</th>
<th>Edit</th>
<th>Delete</th>
</tr>
</thead>
<tbody ng-init="GetDataForCrud()">
<tr ng-repeat="data in datas" ng-include="getTeamplate(data)">
</tr>
</tbody>
</table>
<input type="submit" class="btn btn-primary btn-xs addnew pull-right" value="Add New" ng-click="AddNewRow()">
</div>
</div>
//--CRUDDisplay.cshtml--//
<td>{{$index + 1}}</td>
<td ng-repeat="cell in data" ng-if="$index>0">{{cell}}</td>
<td><button type="button" class="btn btn-warning btn-xs" ng-click="Edit(data)">Edit</button></td>
<td><button type="button" class="btn btn-danger btn-xs" ng-click="Delete(data)">Delete</button></td>
//--CRUDEdit.cshtml--//
<td>{{$index + 1}}</td>
<td ng-repeat="cell in data" ng-if="$index>0"><input type="text" ng-model="cell" class="form-control input-sm"/></td>
<td><button type="button" class="btn btn-warning btn-xs" ng-click="Update(data)">Update</button></td>
<td><button type="button" class="btn btn-danger btn-xs" ng-click="Reset()">Reset</button></td>
//--CRUDController.js--//
app.controller('crudController', function ($scope, $http, $compile) {
$scope.selectedMediaData = {};
$scope.datas = [];
var KeyNames = [];
$scope.GetDataForCrud = function () {
$http({
method: "get",
url: "/Home/GetMediaPageDataForCrud",
datatype: "json"
}).then(function (response) {
var jData = JSON.parse(response.data);
var d = jData.ResultData;
if (d.length > 0) {
var keys = d[0];
for (var key in keys) {
KeyNames.push(key);
}
}
$scope.keys = KeyNames;
$scope.datas = jData.ResultData;
}, function () {
})
};
$scope.Edit = function (data) {
$scope.selectedMediaData = angular.copy(data);
};
$scope.getTeamplate = function (data) {
if (data.UID === $scope.selectedMediaData.UID)
{ return 'Edit'; }
else
{ return 'Display'; }
};
$scope.AddNewRow = function () {
var blankRow = '';
for (key in KeyNames) {
blankRow += KeyNames[key] + ":" + "\"\",";
}
$scope.datas.push({blankRow});
console.log($scope.datas);
}
})
答案 0 :(得分:0)
像这样添加新行:
$scope.AddNewRow = function () {
var duplicateRow = {};
duplicateRow = angular.copy($scope.datas[0]);
for(v in duplicateRow){duplicateRow[v]="";}
$scope.datas.push(duplicateRow);
};