Search code examples
angularjsselectangularjs-directiveangularjs-ng-clickng-options

AngularJS ng is ignored


i'm developing an app that should have a form with select boxes that are populated dinamically with JSON arrays and the options depends of the choose option in the before select.

My problem is that the controller is correctly executed but the select options are not populated from the controller, there are empty.

And seems the the ng directives are always ignored

Also the ng-click directive in the button is ignored.

Can someone help me to solve it?

Thank's

angular.module('App', []) .controller('TimesController', function ($http) {
            console.log("JavaScript Function");
            var attivita = <?php echo json_encode($cod_attivita); ?>;
            var config = {
      transformResponse: function (data, headers) {
        var result = {
          events: [],
          events2: [],
          events3: [],
          schedules: [],
          schedules2: [],
          schedules3: []
        };
        var events = JSON.parse(data);
        console.log(events);
        var events2 = JSON.parse(data);
        var events3 = JSON.parse(data);
        var dates = [];
        var sedi = [];
        var professionisti = [];
        console.log("qua3");
        for (var i = 0; i < events.length; i++) {
          if (dates.indexOf(events[i].day) === -1) {
            var date = events[i].day;
            dates.push(date);
            result.events.push({
              date: date
            });
          }
          if (sedi.indexOf(events[i].sede) === -1) {
            var sede = events[i].sede;
            sedi.push(sede);
            result.events2.push({
              sede: sede
            });
          }
          if (professionisti.indexOf(events[i].professionista) === -1) {
            var professionista = events[i].professionista;
            professionisti.push(professionista);
            result.events3.push({
              professionista: professionista
            });
          }
          var a = 0;
          var found = false;
          while (a < result.schedules2.length) {
              if (events[i].sede === result.schedules2[a].sede && events[i].professionista === result.schedules2[a].professionista) {
                  found = true;
              }
              a++;
          }
          if (found == false) {
              result.schedules2.push({
                sede: events[i].sede,
                professionista: events[i].professionista
              });
          }
          var a = 0;
          var found = false;
          while (a < result.schedules3.length) {
              if (events[i].sede === result.schedules3[a].sede && events[i].professionista === result.schedules3[a].professionista && events[i].day === result.schedules3[a].date) {
                  found = true;
              }
              a++;
          }
          if (found == false) {
              console.log("OLEE");
              result.schedules3.push({
                sede: events[i].sede,
                professionista: events[i].professionista,
                date: events[i].day
              });
          }
          result.schedules.push({
            sede: events[i].sede,
            professionista: events[i].professionista,
            date: events[i].day,
            time: events[i].time
            //console.log("qua4");
          });
        }
        console.log(result);
        return result;
      }
    };
    var email = "assistenza@pgdue.com";
    var link = 'http://sviluppo.pgdue.com/shuttle/admin/app-service/get-orari?e='+email+"&attivita="+attivita;
    console.log(link);
    return $http.get(link, config)
      .then(getEventsCompleted)
      .catch(getEventsFailed);
    function getEventsCompleted(response) {
        console.log(response.data);
      return response.data;
      console.log(response.data);
    }

    function getEventsFailed(error) {
      console.error(error);
    }

    var submit = function () {
        console.log("submit function");
    }
        })
<div ng-app="App">
    <div align="center" ng-controller="TimesController as ctrl">
        <p style="font-size: 22px;">Inserisci appuntamento</p>
        <br>
        <div class="list" align="center">
                <div class="input-label">
                </div>
                <select style="width: 75%;" ng-options="event as event.sede for event in ctrl.data.events2" ng-model="ctrl.form.sede">
                    <option value="" disabled>Seleziona sede</option>
                </select>
        </div><br>
        <div class="list" align="center">
                <div class="input-label">
                </div>
                <select style="width: 75%;" ng-options="schedule as schedule.professionista for schedule in ctrl.data.schedules2| filter: { sede: ctrl.form.sede.sede}" ng-model="ctrl.form.professionista" ng-disabled="!ctrl.form.sede">
                    <option value="" disabled>Seleziona professionista</option>
                </select>
        </div><br>
        <div class="list" align="center">
                <div class="input-label">
                </div>
                <select style="width: 75%;" ng-options="schedule as schedule.date for schedule in ctrl.data.schedules3| filter: { professionista: ctrl.form.professionista.professionista, sede: ctrl.form.sede.sede}" ng-model="ctrl.form.giorno" ng-disabled="!ctrl.form.professionista">
                    <option value="" disabled>Seleziona giorno</option>
                </select>
        </div><br>
        <div class="list" align="center">
                <div class="input-label">
                </div>
                <select style="width: 75%;" ng-options="schedule as schedule.time for schedule in ctrl.data.schedules| filter: { date: ctrl.form.giorno.date, professionista: ctrl.form.professionista.professionista, sede: ctrl.form.sede.sede}" ng-model="ctrl.form.ora" ng-disabled="!ctrl.form.giorno">
                    <option value="" disabled>Seleziona orario</option>
                </select>
        </div><br>
    </div>
</div>
<br>                    
<div align="right">
    <button ng-click="ctrl.submit()"><p>Prenota</p></button>
</div>

Solution

  • CHANGE

    var submit = function () {
        console.log("submit function");
    }
    

    TO

    this.submit = function () {
        console.log("submit function");
    }
    

    submit()'ll work for sure.