Как использовать http.post в angular js для получения проверенных строк моей таблицы данных?
Привет, у меня есть данные с идентификатором, именем и т.д., и в угловой js добавлены флажки
например
vm.dtColumns = [
DTColumnBuilder.newColumn(null).withTitle(titleHtml).notSortable()
.renderWith(function(data, type, full, meta) {
vm.selected[full.ID] = false;
return '<input type = "checkbox" class = "checkedtestids" ng-model = "showCase.selected[' + data.ID + ']" ng-click = "showCase.toggleOne(showCase.selected)">';
}),
У меня есть флажки, с помощью которых можно выбрать все строки из заголовка или по отдельности.
У меня также есть var, который сохраняет идентификатор и меняет логическое состояние с true на false в зависимости от установленного флажка или нет.
var vm = this;
vm.message = '';
vm.someClickHandler = someClickHandler;
vm.selected = {};
vm.selectAll = false;
vm.toggleAll = toggleAll;
vm.toggleOne = toggleOne;
Мой html-код для отображения этого vm.selected = {}; выглядит следующим образом:
<div ng-controller = "WithAjaxCtrl as showCase">
<blockquote>Please click on a row</blockquote>
<p class = "text-danger">
You clicked on: <strong>{{ showCase.message }}</strong>
</p>
<table datatable = "" dt-options = "showCase.dtOptions"
dt-columns = "showCase.dtColumns" class = "row-border hover"></table>
<p class = "text-danger">You selected the following rows:</p>
<p>**<pre ng-model = "showCase.selected">{{ showCase.selected |json }}</pre**>
Если я нажму на эти идентификаторы: введите описание изображения здесь
Тогда ниже отражено следующее: введите описание изображения здесь
{
"2457937718692": true,
"2457985718634": false,
"2454757950532": true,
Как мне отправить этот массив vm.selected, который указывает проверено или нет, на мой контроллер java spring, который затем будет использовать их для другой цели?
Я безуспешно пытался использовать $ http.post () и $ http.get ().
Ответы 1
Вам не нужно передавать идентификатор в ng-model для идентификации выбранных флажков, потому что массив объектов привязан к представлению, вместо этого вы можете передать логическую переменную и использовать директиву фильтра https://docs.angularjs.org/guide/filter.
Например.:
JAVASCRIPT
vm.data = ['a','b','c'];
var selected = [];
var vm.filterSelectedData = function(){
selected = $filter('filter')(data, {checked: true});
}
HTML
<div ng-repeat = "element in showCase.data">
<input type = "checkbox" class = "checkedtestids" ng-model = "element.selected" ng-change = "showCase.filterSelectedData()" />
</div>
чтобы отправить выбранные элементы на сервер, вам просто нужно создать объект json с массивом этих выбранных элементов.
http.post('url', {selectedItems:selected})
.success(function(){ // calback function })
.error(function(){ // error function })
см. плункер