0

Boa noite. Estou usando a paginação do Bootstrap com Angular.js . Consigo pegar os dados do banco e listar, ficou bonito, etc... do jeito que eu precisava.

Porém, preciso abrir uma janela modal e isso funcionava quando eu estava usando as funções javascript que conheço como o OnClick.

Mas usando a paginação com angular, minha função onclick não funciona. Abaixo segue o link e documentação da paginação com Angula.js:

http://www.angularcode.com/angularjs-datagrid-paging-sorting-filter-using-php-and-mysql/

Tenho a seguinte função a ser chamada:

<script type="text/javascript">

function detalhes(id) {
    $('#myModal').modal('show');
    $("#conteudoModal").load('verProduto.php?id=' + id);
}

E na paginação, lista de produtos eu tenho o botão:

<td><button type="button" class="btn btn-primary btn-mini" data-toggle="modal" onclick="detalhes({{data.id}})">+ Detalhes</button></td>

O problema está aqui:

onclick="detalhes({{data.id}})"

O id chega nesse formato: {{data.id}} , já usei aspas, +, . e nada rsrrsrsr Teria algum jeito de trabalhar melhor isso? Não entendo muito de Angular.js , apenas peguei ele e adaptei e ficou lindo...mas preciso do botão funcionando...

Conforme solicitado, segue o controller:

var app = angular.module('produtos', ['ui.bootstrap']);
app.filter('startFrom', function() {
return function(input, start) {
    if(input) {
        start = +start; //parse to int
        return input.slice(start);
    }
    return [];
}
});
app.controller('produtosCrtl', function ($scope, $http, $timeout) {
    $http.get('../html/paginacao/ajax/getProdutos.php').success(function(data){
        $scope.list = data;
        $scope.currentPage = 1; //current page
        $scope.entryLimit = 5; //max no of items to display in a page
        $scope.filteredItems = $scope.list.length; //Initially for no filter  
        $scope.totalItems = $scope.list.length;
    });
    $scope.setPage = function(pageNo) {
        $scope.currentPage = pageNo;
    };
    $scope.filter = function() {
        $timeout(function() { 
            $scope.filteredItems = $scope.filtered.length;
        }, 10);
    };
    $scope.sort_by = function(predicate) {
        $scope.predicate = predicate;
        $scope.reverse = !$scope.reverse;
    };
});

Poderiam me ajudar nisso?

7
  • 8
    Poderia postar o código do controller que está utilizando para manipular esse data-id? 17/05/2015 às 9:05
  • Vou editar a pergunta, acrescentando o controller. 17/05/2015 às 12:18
  • 1
    Tente trocar onclick para ng-click 17/05/2015 às 12:30
  • 1
    @MarciaPereiraReis eu percebi que você está usando o módulo 'ui.bootstrap'. A sua função para abrir modal terá que ser alterada um pouco. Você pode ver esse exemplo aqui: plnkr.co/edit/qpUwt2Ozj9thNR7IubFj 17/05/2015 às 12:40
  • 5
    Me parece que a dica do Wedney Yuri lhe ajudou, mas não era bem uma resposta direta ao problema, você pode responder a sua própria pergunta, isto pode vir a ajudar outros usuários.
    – Reptile
    17/05/2015 às 22:07

1 Resposta 1

1

Solução:

$scope.detalhes = function (id) {
    $('#myModal').modal('show');
    $("#conteudoModal").load('verProduto.php?id=' + id);
}; 

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .