0

¡Hola! Estoy creando combos dependientes a partir de JSON; este arreglo lo genero desde JPA a su vez desde ORACLE que me devuelte un arreglo en formato JSON. Les explico brevemente: tengo dos tablas en BDD (cEntidad 1:N cUnidadAdministrativa). Ahora lo que quiero es que cada vez que seleccione el combo de cEntidad obtenga las ENTIDADES (Entidad 1, Entidad 2 etc) y de acuerdo a sus Foreign Key me devuelva las UNIDADES ADMINISTRATIVAS, ejemplo:

ENTIDAD 1 > (UNIADM 1 UNIADM 2 UNIADM 3)

ENTIDAD 2 > (UNIADM 4 UNIADM 5 UNIADM 6)

Lo que llevo programado lee el primer array y compara con los coincidentes en el segundo, pero me cicle y creo solo falta guardarlo en un array y ese meterlo en el segundo combo, para que que recupere el modelo, saludos y espero me puedan ayudar, gracias

// Code goes here


var app = angular.module("app", []);
 
app.controller("PruebaController", function($scope) {
  $scope.modelo;
  $scope.selects;
  
  $scope.cEntidad=[
    {"cscEntidad":1,"chrDescripcion":"ENTIDAD 1","snActivo":1},{"cscEntidad":2,"chrDescripcion":"ENTIDAD 2","snActivo":1},{"cscEntidad":3,"chrDescripcion":"ENTIDAD 3","snActivo":1},{"cscEntidad":4,"chrDescripcion":"ENTIDAD 4","snActivo":1},{"cscEntidad":5,"chrDescripcion":"ENTIDAD 5","snActivo":1},{"cscEntidad":6,"chrDescripcion":"ENTIDAD 6","snActivo":1},{"cscEntidad":7,"chrDescripcion":"ENTIDAD 7","snActivo":1},{"cscEntidad":8,"chrDescripcion":"ENTIDAD 8","snActivo":1},{"cscEntidad":9,"chrDescripcion":"ENTIDAD 9","snActivo":1},{"cscEntidad":10,"chrDescripcion":"ENTIDAD 10","snActivo":1}
  ];
  
  $scope.cUnidadAdministrativa=[
    {"cscUnidadAdm":1,"chrDescripcion":"UA 1","snActivo":1,"centidad":{"cscEntidad":1,"chrDescripcion":"ENTIDAD 1","snActivo":1}},{"cscUnidadAdm":2,"chrDescripcion":"UA 2","snActivo":1,"centidad":{"cscEntidad":1,"chrDescripcion":"ENTIDAD 1","snActivo":1}},{"cscUnidadAdm":3,"chrDescripcion":"UA 3","snActivo":1,"centidad":{"cscEntidad":2,"chrDescripcion":"ENTIDAD 2","snActivo":1}},{"cscUnidadAdm":4,"chrDescripcion":"UA 4","snActivo":1,"centidad":{"cscEntidad":2,"chrDescripcion":"ENTIDAD 2","snActivo":1}},{"cscUnidadAdm":5,"chrDescripcion":"UA 5","snActivo":1,"centidad":{"cscEntidad":3,"chrDescripcion":"ENTIDAD 3","snActivo":1}},{"cscUnidadAdm":6,"chrDescripcion":"UA 6","snActivo":1,"centidad":{"cscEntidad":3,"chrDescripcion":"ENTIDAD 3","snActivo":1}},{"cscUnidadAdm":7,"chrDescripcion":"UA 7","snActivo":1,"centidad":{"cscEntidad":4,"chrDescripcion":"ENTIDAD 4","snActivo":1}},{"cscUnidadAdm":8,"chrDescripcion":"UA 8","snActivo":1,"centidad":{"cscEntidad":4,"chrDescripcion":"ENTIDAD 4","snActivo":1}},{"cscUnidadAdm":9,"chrDescripcion":"UA 9","snActivo":1,"centidad":{"cscEntidad":5,"chrDescripcion":"ENTIDAD 5","snActivo":1}},{"cscUnidadAdm":10,"chrDescripcion":"UA 10","snActivo":1,"centidad":{"cscEntidad":5,"chrDescripcion":"ENTIDAD 5","snActivo":1}}
  ];
  
      $scope.getUA = function () {
        //console.log("Entidad o Dependencia:" + $scope.cEntidad);
        //alert("Entidad o Dependencia:"+ $scope.modelo.CEntidad);

        for (var i in $scope.cUnidadAdministrativa) {
          
            if ($scope.modelo.CEntidad === $scope.cUnidadAdministrativa[i].centidad.cscEntidad) {
                //alert($scope.modelo.CEntidad);
                
                var array = $scope.cUnidadAdministrativa[i];
                console.log("Descripcion  :"+ array.chrDescripcion);// Unidades Administrativas a las que le pertenecen a Entidad
                //alert("selects: "+ array.chrDescripcion);
                
            }
            
        }
          //$scope.newSelects = $scope.selects;
        //alert("newSelects; "+$scope.newSelects.cscUnidadAdm);
        $scope.selects = array;
       return $scope.selects; 
     }

});
<!DOCTYPE html>
<html ng-app="app">

<head>
  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.js"></script>
  <script src="script.js"></script>
</head>

<body ng-controller="PruebaController">

      <select ng-model="modelo.CEntidad" id="cscEntidad" ng-change="getUA()" ng-options="option.cscEntidad as option.chrDescripcion for  option in cEntidad" >
        <option value="">--Elige opcion--</option>
      </select>
      <select ng-model="modelo.CUnidadAdministrativa" ng-options="option.cscUnidadAdm as option.chrDescripcion for option in selects.chrDescripcion" >
        <option value="">--Elige opcion--</option>
      </select>
      <br>
      <br>
      El id de la entidad seleccionada es: {{modelo.CEntidad}} 
      <br>
      <br>
      El array de la UA seleccionada es: <br>{{selects}}
      
</body>

</html>

8
  • Según entiendo, quieres hacer una petecion al servidor cuando elijas una entidad, o la peticion ya esta hecho, y tienes el objeto alli? el 15 feb. 2017 a las 19:32
  • La peticion ya esta hecha, tengo una vista que tiene esos dos arreglos y solo los recupero con el index, ya sea cUnidad o cUnidadAdmin, pero como tengo demaciados datos, solo puse dos array de ejemplo con algunos datos, espero haberme explicado. el 15 feb. 2017 a las 19:35
  • este objeto {"cscUnidadAdm":2,"chrDescripcion":"UA 2","snActivo":1,"centidad":{"cscEntidad":1,"chrDescripcion":"ENTIDAD 1","snActivo":1}}, es el que debe cargar en el select? el 15 feb. 2017 a las 19:40
  • Este Objeto {"cscEntidad":1,"chrDescripcion":"ENTIDAD 1","snActivo":1} carga el primer select y este {"cscUnidadAdm":2,"chrDescripcion":"UA 2","snActivo":1,"centidad":{"cscEntidad":1,"chrDescripcion":‌​"ENTIDAD 1","snActivo":1}} carga el segundo select, como puedes observar el segundo object contiene la informacion de a cuales entidades pertenece. el 15 feb. 2017 a las 19:48
  • si pero mi pregunta, va a que si es ese el que quieres mostrar, en mi caso, elegí la primera entidad del primer select, y me cargo eso, ejecutando el código que tu pusiste el 15 feb. 2017 a las 19:58

1 respuesta 1

3

El error esta al filtrar los de ENTIDAD X el array solo guarda el ultimo. Deberías ponerlo así...

    $scope.getUA = function () {
           var array = [];
           for (var i in $scope.cUnidadAdministrativa) {

                  if ($scope.modelo.CEntidad === $scope.cUnidadAdministrativa[i].centidad.cscEntidad) {
                       array.push($scope.cUnidadAdministrativa[i]);                
                  }            
          }
          $scope.selects = array;
          return $scope.selects; 
   }

Ya teniendo eso, solo modifica esto en el html...

     <select ng-model="modelo.CUnidadAdministrativa" ng-options="option.chrDescripcion for option in selects" >

Espero te ayude... https://codepen.io/anon/pen/XpGQga?editors=1010

2
  • ¡Chingón!. Créeme que justo ahora estaba viendo esa función push, y si en efecto solo guardaba el ultimo, muchas gracias caballero. el 15 feb. 2017 a las 23:06
  • 1
    Que bueno que te resolvió, un detalle en lugar de usar un array podrías usar solo el $scope.selects = [] y hacer el push directamente. el 15 feb. 2017 a las 23:20

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.