0

usando: https://code.google.com/archive/p/jquery-ui-picklist/

Não consigo carregar dados vindo da minha tabela de clientes no picklist. Já estava funcionando em outro template, mudou o template na empresa e estou adaptando pros novos componentes. Peguei este picklist de fora, porque o template não tem.

O que pode estar errado? Não faço ideia, simplesmente não carrega nada no picklist.

inserir a descrição da imagem aqui

angular.module('BoxApp').controller("CadastroCertificado", function($scope, $http) {

	$scope.clientes = {};
	$scope.listaEmpresas = [];
	
	$scope.iniciar = function() {
		$http.get(urlRestServer + '/cadastrocertificado').success(function(response) {
			$scope.clientes = response;
			
		});
	};

	$scope.iniciar();	
	
	/**
	 * Trabalhando o componente picklist
	 */
    $scope.clientes2 = [];	    
	$scope.atribuirUm = function(index, c) {
		var cliente = {};
		cliente.idCliente = c.idCliente;
		cliente.razaoSocial = c.razaoSocial;
	    $scope.clientes2.push(cliente);
	    $scope.clientes.splice(index, 1);
	};
	$scope.limparUm = function(index, c2) {
	    $scope.clientes2.splice(index, 1);
	    $scope.clientes.push(c2);	    
	};
	
	/**
	 * Trecho para validar o form ao submeter.
	 */
	$scope.submitted = false;
	$scope.submitForm = function(form, clientes2) {		
		$scope.listaEmpresas = $scope.clientes2;
		$scope.submitted = true;
		if (form.$valid) {			
			$scope.cadastraCertificado();
		}
	};	

	/**
	 * Requisição POST (ajax)
	 */
	$scope.cadastraCertificado = function() {
		
		var dados = {
				urlCertificado : $scope.certificadoIncluirAlterar.urlCertificado,
				strDataValidadeCertificado : $scope.certificadoIncluirAlterar.strDataValidadeCertificado.toString(),
				senhaCertificado : $scope.certificadoIncluirAlterar.senhaCertificado,
				listaEmpresas : $scope.listaEmpresas				
		};
		
		$http.post(urlRestServer + '/cadastrocertificado/salvarCertificado', dados).then(function(response) {
			
		}, function(response) {	
			$scope.sucesso();
		});
	};	
	
	$scope.sucesso = function() {
		$scope.closeModal();
		$scope.iniciar();		
	};
	
	$scope.closeModal = function() {
		$('#myModal').modal('hide');
	};

});
<div class="form-group">
    <label class="control-label col-md-3">Empresas:</label>
    <div class="col-md-9">
        <select id="foobar" name="foobar" multiple="multiple">                                             
              <option ng-repeat="c in clientes" value="{{c.idCliente}}" ng-click="atribuirUm($index, c)">{{c.razaoSocial}}</option>
              <option selected ng-repeat="c2 in clientes2" value="{{c2.idCliente}}" ng-click="limparUm($index, c2)">{{c2.razaoSocial}}</option>
        </select>
    </div>
</div>   

2 Respostas 2

1

Como você está fazendo uma requisição com $http, você está esperando uma resposta com este cabeçalho:

(data, status, headers, config)

Caso você obtenha um status positivo, ou seja, com um retorno válido, os dados estarão dentro do data. Deste modo você precisa acessar as informações ali, veja:

$scope.clientes = response.data;
5
  • Celsom, eu estou trabalhando com o response na tela onde preencho um grid, trabalho com ng-repeat em cima de clientes, como você disse. Já no select, também trabalho, com o ng-repeat também em cima de clientes, onde ficou minha response, criei uma função pra atribuir o q foi selecionado pra lista da direita e vice versa, mas nem carrega nela os clientes. Eu não usaria o ng-repeat aqui?Pois o componente está em jquery mas minha app toda em angular. Commented 28/01/2016 às 15:50
  • Sim, mas primeiro você precisa ter os valores, correto? Na sua função $scope.iniciar = function() provavelmente você não está captando os dados corretamente, como dito na resposta. Tente mudar o tratamento como informei na resposta. O ng-repeat só vai ser usado posteriormente, depois de atribuir os dados. Commented 28/01/2016 às 15:54
  • Celsom, o retorno que esta na response, sao 20 objetos cliente da base. Os valores estão sendo armazenados em 'clientes'. Precisa arrumar algo aqui se os valores estão vindo ok? Eu não entendi como preciso arrumar baseado na resposta. Commented 28/01/2016 às 16:02
  • Pois desta maneira já funcionou antes, eu só mudei o componente. Commented 28/01/2016 às 16:11
  • Se você colocar console.log(response) antes de $scope.clientes = response; o que aparece no console? Commented 28/01/2016 às 19:23
0

É realmente complicado misturar jquery com angular, não recomendo, só deu erro.

O componente estava em jquery e eu manipulando com angular devido a diversos motivos internos do projeto aqui na empresa.

Resumindo, fiz um picklist na mão mesmo e criei as funções javascript pra manipular de um lado para o outro.

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 .