1

I have a drop down that is populated witht eh following code:

<span class="bluedept">Department:</span>
            <select class="selectpicker deptpicker" selectpicker ng-model="department" ng-controller="CaseListCtrl" ng-change="getCalendar();">
                <option ng-repeat="department in departments track by $index">{{department.CourtRoom}}</option>
            </select>

I then have this in my controller:

JBenchApp.controller('CaseListCtrl', ['$scope', '$http', 
  function ($scope, $http) {
      // Case list stuff here

      $scope.getCalendar = function () {
          var e = document.getElementById("deptSelect");
          var department = e.options[e.selectedIndex].text;
          console.log(department);

          $http.get('http://10.34.34.46/BenchViewServices/api/Calendar/LA/' + department + '/08-27-2015').success(function (response) {
              $scope.cases = response;
          });
      }

          $http.get('http://10.34.34.46/BenchViewServices/api/CourtDept/LA').success(function (response) {
              $scope.departments = response;
          });


  }]);

The $scope.cases updates with new data, but the partial doesn't change to match that. What can I do to make the partial view refresh?

EDIT TO ADD PARTIAL VIEW CODE:

<div class="row" ng-show="$parent.loggedin">
    <div class="col-sm-12 calselectrow">
        <div class="inner-addon left-addon">
            <span class="glyphicon glyphicon-calendar calicon"></span>

            <input type="text" id="calpick" ng-model="date" jdatepicker />
            <i class="glyphicon glyphicon-calendar calclick"></i>

            <a href="#" class="btn btn-primary flat-edge">>></a>

            <span class="bluedept">Department:</span>
            <select class="selectpicker deptpicker" id="deptSelect" selectpicker ng-model="department" ng-controller="CaseListCtrl" ng-change="getCalendar();">
                <option ng-repeat="department in departments track by $index">{{department.CourtRoom}}</option>
            </select>
        </div>
    </div>
</div>
<div class="row" ng-show="$parent.loggedin">
    <div ng-controller="CaseListCtrl">
        <div class="col-sm-8 col-sm-offset-2 caselist" ng-repeat-start="case in cases track by $index">
            <div class="sequence">
                <input type=text class="seq-box" size="1" value="{{case.sequence}}" />
            </div>
            <div class="casetitle">
                <span class="caselink">{{case.Case_Number}}</span>
                <a href="calendar" data-toggle="tooltip" data-placement="top" title="Calendar" class="btn btn-xs btn-danger calicon-view" tooltip>
                    <span class="glyphicon glyphicon-calendar"></span>
                </a>
                <a href="documents/{{case.Case_Number}}" data-toggle="tooltip" data-placement="top" title="Documents" class="btn btn-xs btn-danger calicon-view" tooltip>
                    <span class="glyphicon glyphicon-file"></span>
                </a>
                <a href="parties/{{case.Case_Number}}" data-toggle="tooltip" data-placement="top" title="Parties" class="btn btn-xs btn-danger calicon-view" tooltip>
                    <span class="glyphicon glyphicon-user"></span>
                </a>
                {{case.Case_Title}}
            </div>
        </div>
        <div class="col-sm-8 col-sm-offset-2 caselist-bottom">
            <div class="col-sm-9 col-sm-offset-1">
                <div class="hearing-time">{{case.Sched_Time}}&nbsp;{{case.AmPm}}</div>
                <div class="hearing-title">{{case.Event}}</div>
            </div> 
        </div>
        <div ng-repeat-end></div>
    </div>
</div>
Michael Mahony
  • 1,310
  • 3
  • 15
  • 33

1 Answers1

0

Try tracking the cases by their id or remove track by from the ng-repeat.

ng-repeat not update model with track by

UPDATE:

I think the issue is that your are using ng-controller twice within your html causing a second scope to be created. Wrap your html in a container div and apply the ng-controller attribute to that only.

Community
  • 1
  • 1
Tyler Drake
  • 24
  • 6
  • I took the track by out and still doesn't refresh upon ng-change firing of the function – Michael Mahony Aug 31 '15 at 22:33
  • I have one area where the data loads based upon a default value pre-selected by the user. I then have a function that runs on ng-change. That function triggers, there is success, but the model doesn't update so the view won't refresh. As a test, I added $scope.cases = ''; in the success function and it still doesn't change the screen. Ideas? – Michael Mahony Sep 01 '15 at 17:50
  • Process... 1. Grabs default data and displays it...this works. 2. Change dropdown and have it trigger a function...that works 3. In function I am alerting a piece of data in the variable and it is correct. 4. In the function I am alerting a piece of data in the variable after it is updated and it comes up undefined This means the data is changing, but the view is not updating. Any ideas here? – Michael Mahony Sep 01 '15 at 18:27
  • So it sounds like angular isn't aware that the cases model has changed, thus doesn't know that is should update view. I would think that $http is 'inside' angular, but maybe not. Try wrapping your model update in $scope.$apply() - http://stackoverflow.com/questions/24836007/ng-repeat-not-updating-the-list-when-adding-data – Tyler Drake Sep 01 '15 at 21:07
  • Actually that's probably not your problem, $apply shouldn't be neccessary, try wrapping your html in a container div and applying ng-controller only once to that. I think using ng-controller twice with the same controller is creating a scope problem. – Tyler Drake Sep 01 '15 at 21:16
  • Tyler, you are a genius! Please add your response about the ng-controller as the answer to this issue. You fixed it for me! – Michael Mahony Sep 01 '15 at 22:16