0

I have a form control in some directive. I am resetting object data to its original state but it is not working in the $scope.on event. If I use it outside in some function it works.

   $scope.$on('edit_view_changed', function (event, parameters) {
            if (parameters.viewName === "" && parameters.editIndex === -1) { 
                vm.resetData(); 
                // this reset data is not working
            }
          });

    function resetData() {
          vm.rowData = angular.copy(vm.data);
    }

    // works properly on cancel button click
    function cancelEdit() {
      vm.resetData();
      $timeout(function () {
        vm.editCancelProspect();
      });
    }

// RowData is bind to a form in a html view.

    <form class="col-md-12" name="editForm" novalidate>
        <div class="col-md-10">
          <div class="form-group col-md-3">
            <label class="col-sm-3 control-label">{{'customers.columns.companyName'|translate}}</label>
            <input type="text" name="name" class="form-control" ng-model="vm.rowData.name"></input>
          </div>
          <div class="form-group col-md-4">
            <label class="col-sm-3 control-label">{{'customers.columns.address'|translate}}</label>
            <input type="text" name="adresse" class="form-control" ng-model="vm.rowData.adresse"></input>
          </div>
          <div class="form-group col-md-3">
            <label class="col-sm-3 control-label">{{'customers.columns.contactPerson'|translate}}</label>
            <input type="text" name="kontakt" class="form-control" ng-model="vm.rowData.companyContact"></input>
          </div>
          <div class="form-group col-md-2 ">
            <label class="col-sm-3 control-label">{{'customers.columns.phone'|translate}}</label>
            <input type="text" name="phone" class="form-control" ng-model="vm.rowData.phone" ng-pattern="/^\d+$/"></input>
            <span ng-show="editForm.phone.$error.pattern" class="error">{{'customers.inValidPhone' | translate}}</span>
          </div>
        </div>
 <button type="button" class="btn cancel-button" title="{{'prospects.cancelEdit'|translate}}" ng-click="vm.cancelEdit()">
             {{'prospects.cancelEdit'|translate}}</button>
</form>
Shikha
  • 551
  • 5
  • 20
  • Can you please show a bit more code about how `edit_view_changed` event is triggered? – Stanislav Kvitash Sep 26 '17 at 12:48
  • Can i know why are you using the `$scope.$on`?.. take a look at this https://stackoverflow.com/questions/14502006/working-with-scope-emit-and-scope-on – Raghav Sep 26 '17 at 12:51
  • Actually this directive gets transcluded into other table directive. On edit_view_changed, transclusion occurs and form is shown under the table row and rowData is passed into it. I am listening to $scope.$on to change the open close state of a directive. But I want to reset rowdata if someone close that directive without clicking cancel button. – Shikha Sep 26 '17 at 13:04
  • You could try either vm.resetData.bind(this); or vm.resetData.bind($scope); – rrd Sep 26 '17 at 13:26
  • @Shikha, so the question was how someone could close the form without clicking cancel button? From what code this event is being broadcasted/emitted? Is it still in angularjs scope? Could you try wrapping this call `vm.resetData();` with `$timeout` and see if it helps? Have you tried to debug and see if the breakpoint on this line is ever reached? We all need more details to try to help you. – Stanislav Kvitash Sep 26 '17 at 13:57
  • angular.copy do not worked. I put the code in $timeout and assign property of vm.data to vm.rowdata one by one and it worked. – Shikha Sep 27 '17 at 09:46

0 Answers0