В таблице получить выбранный идентификатор строки в массиве

В таблице каждая строка связана с флажком и имеет возможность проверить всю строку. Я хочу получить идентификатор выбранных строк таблицы в массиве.

Вот код плунжера.

HTML:

 <table id="datatable-buttons" class="table table-striped table-bordered">
                                    <thead>
                                        <th>
                                              <input type="checkbox" ng-model="selectRowId" ng-click="selectedAll()">
                                        </th>
                                    </thead>
                                    <tbody ng-init="get_product()">
                                        <!--step 6-->
                                        <tr ng-repeat="product in filtered = (pagedItems| filter:search | orderBy : predicate :reverse) | startFrom:currentPage * entryLimit | limitTo:entryLimit | findobj:multipleVlaue | searchFor:searchString"> <!-- searchFor:searchString --> 
                                            <td> 
                                                <input type="checkbox" ng-model="selctedIds[product.id]" ng-checked="product.deleted">
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>

Контроллер:

    $scope.selectedAll = function () {
    $scope.pagedItems.forEach(function (product) {
        if ($scope.selectRowId) {
            product.deleted = true;
        } else {
            product.deleted = false;
        }
    });
}

angularjs angular-datatables
person Community    schedule 13.06.2016    source источник
comment
попробуйте использовать $index, чтобы получить индекс элемента внутри ng-repeat. $index на самом деле является смещением итератора повторяющегося элемента (0..length-1)   -  person Avantika Saini    schedule 13.06.2016
comment
Я пытался, но не получил выбранные идентификаторы @avantika-saini   -  person    schedule 13.06.2016
comment
не могли бы вы отредактировать в плункере   -  person    schedule 13.06.2016

Ответы (2)


arrow_upward
3
arrow_downward

Если вам нужно что-то масштабируемое, поддерживающее такие вещи, как сложная фильтрация, разбиение на страницы и т. д., я предлагаю вам написать свойство angular для каждого объекта. Итак, для флажка мы хотели бы переключить это логическое значение следующим образом:

<input type="checkbox" ng-model="item.$selected"/>

Чтобы переключить все/ничего, вам нужно нажать на функцию контроллера:

$scope.toggleAll = function(bSelect){
    itemArray.forEach( function(item){ item.$selected = bSelect; })
}

Причина, по которой я предлагаю добавить к выбранному значению $, например $selected, заключается в том, что любые HTTP-вызовы, которые вы делаете с объектами, Angular удалит любые $property перед преобразованием в JSON, на случай, если у вашего бэкэнда возникнут проблемы.

Я бы рекомендовал использовать фильтр для извлечения идентификаторов:

<div>{{ itemArray | getSelIds }}</div>

и фильтр

.filter( 'geSeltIds', function(){
    return function(items){
        //if you happen to use lodash
        return _.chain(items).filter({$selected:true}).map('id').value()

        //manual
        ids = []
        items.forEach(function(item){
            if(item.$selected)
                ids.push(item.id)
        })
        return ids
    }
})
person jusopi    schedule 13.06.2016
comment
Я ценю ваше предложение. что это делает: return _.chain(items).filter({$selected:true}).map('id') - person ; 13.06.2016
comment
Если вы используете библиотеку lodash, вы можете объединить несколько функций. Это просто нацеливается на массив элементов, фильтрует и передает массив, где $selected имеет значение true, а затем отображает идентификаторы отфильтрованных элементов. - person jusopi; 13.06.2016
comment
Вместо того, чтобы проигнорировать вашу просьбу, я объясню, почему я должен почтительно отказаться. а) сейчас я начинаю свой рабочий день и не могу посвятить достаточно времени работе с вашим примером и б) я бы предпочел, чтобы вы наслаждались вознаграждением за его самостоятельное решение с помощью инструментов, представленных в моем ответе и других на этом Веб-сайт. Вы запомните и поймете намного лучше, когда соберете все воедино. - person jusopi; 13.06.2016
comment
Не могли бы вы проверить эту ссылку stackoverflow.com/questions/47568013/ - person Varun Sharma; 19.01.2018

arrow_upward
0
arrow_downward

Этот фильтр чище:

 .filter( function (item) {
            return item.$selected;
     }).map(function (item) { return item.id });
person Alarcon    schedule 19.01.2018