angularjs - Image is not getting updated after I edit data in ng-grid -


i having grid has button ,by clicking on button opens modal window allow user modify data present in row,the code required is

//html file <body ng-controller="myctrl">    <script type="text/ng-template" id="mymodalcontent.html">           <div class="modal-header">             <h3 class="modal-title">i'm modal!</h3>           </div>        <div class="modal-body" >            <button>hello</button>              <form>              <input data-ng-model="items.name"/>              <input data-ng-model="items.age"/>                 <input data-ng-model="items.sa"/>              <button class="primary" data-ng-click="ok()">save</button>              <button class="primary" data-ng-click="cancel()">cancel</button>              </form>         </div>     </script>         <div class="gridstyle" ng-grid="gridoptions"></div>     </body> //js file // main.js var app = angular.module('myapp', ['nggrid','ui.bootstrap']); var celltemplate='<div class="ngcelltext"  data-ng-model="row"><button data-ng-click="updateselectedrow(row,$event)">edit</button></div>' var ctrl=app.controller('myctrl', function($scope,$modal) {     $scope.mydata = [{name: "moroni", age: 50,sa: 2,},                      {name: "tiancum", age: 43,sa:1,},                      {name: "jacob", age: 27,sa: 2,},                      {name: "nephi", age: 29,sa: 4,},                      {name: "enos", age: 34,sa: 1,}];     $scope.gridoptions = {        data: 'mydata',        enablecellselection: true,       enablecelledit: true,       enablerowselection: false,       columndefs: [{field: 'name', displayname: 'name', enablecelledit: true},        {field:'age', displayname:'age'},       {field:'sa', displayname:'serviceaffecting',  //celltemplate:'<div><img ng-src="{{row.getproperty(\'"sa"\') | imagefilter}}"></img></div>' celltemplate:'<div><img ng-src="{{row.getproperty(\'sa\') | imagefilter}}"></img></div>'},       {field:'',celltemplate:celltemplate}          ]     };     var dialog;     $scope.updateselectedrow=function(row){        $scope.myrow=row.entity;      var modalinstance = $modal.open({       templateurl: 'mymodalcontent.html',       controller: modalinstancectrl,       resolve: {         items: function () {           return row.entity;         }       }     });      }     $scope.save=function(){       console.log($modal);      $modal.dismiss('cancel');     }  }); var modalinstancectrl = function ($scope, $modalinstance, items) {    $scope.items = items;   var name=items.name;   var age=items.age;   var sa=items.sa;     $scope.ok = function () {    $modalinstance.close();     };    $scope.cancel = function () {     items.name=name;     items.age=age;     $modalinstance.dismiss('cancel');   };   }; app.filter('imagefilter', function() {         return function(sa) {             if(sa===0) { return 'http://goo.gl/afomaa'; }             if(sa===1) { return 'http://goo.gl/vxcnlc'; }             if(sa===2) { return 'http://goo.gl/afomaa'; }               if(sa===4) { return 'http://goo.gl/afomaa'; }                 if(sa===5) { return 'http://goo.gl/afomaa'; }             return 'unknown';         };  }); 

when editing value image not getting updated ,cant understand why ? either should happen on clicking button image should automatically turn red,any of solutions appreciated. in adcvance.

the modal turns items.sa string, no branches in imagefilter match anymore because sa compared numeric values only.

two solutions spring mind:

use number input box: <input type="number" data-ng-model="items.sa"/>

or

coerce sa number in imagefilter:

app.filter('imagefilter', function () {     return function (sa) {         sa = +sa; //coerce sa number         if (sa === 0) {         .... 

Comments

Popular posts from this blog

php - failed to open stream: HTTP request failed! HTTP/1.0 400 Bad Request -

java - How to filter a backspace keyboard input -

java - Show Soft Keyboard when EditText Appears -