javascript - React datepicker hide on click outside broken -


i'm trying update react component based on array in controller.in controller i'm doing merge on diaries , change content , can't update view in react component.can explain me how can update react state controller??thank !

var app = angular.module('app', ['react']);

app.controller('mainctrl', function ($scope) {      $scope.resultprops = {         item:[]     }     $scope.firstarrayprops =  {         item:[]     }     $scope.secondarrayprops =  {         item:[]     }      $scope.mergediariesfunction = function (first,second) {        .... merge diaries code     }     $scope.runmerge = function () {          var first = angular.copy($scope.firstarrayprops.item);         var second = angular.copy($scope.secondarrayprops.item);         first = $scope.sortdiarybystartdate(first);         second = $scope.sortdiarybystartdate(second);          if($scope.firstarrayprops.item.length == 0 && $scope.secondarrayprops.item.length == 0)         {             sweetalert({                 title: "",                 text: "there's no need merge empty diaries.please,add periods.",                 type: "warning"             });             $scope.resultprops.item = [];         }         else {             $scope.resultprops.item = $scope.mergediariesfunction(first, second);             $scope.showmydirc.show = true;             $scope.hidebool.show = true;          }     } }); 

my react component...

var diaryresult = react.createclass({     getinitialstate: function() {         return {             items : this.props.item,         };     },   init:function () {     this._super.apply(this,arguments);       if (this.get("props")) {           this.get('props').set(this.get("resultprops") || "default", this);       }   },     render: function(){         var arrayitems =  this.state.items.map(function (item,i) {             return (                 <tr key={i}>                     <td><formatteddate value={item.start}/></td>                     <td><formatteddate value={item.end}/></td>                     <td>{item.hours}</td>                 </tr>             );         }.bind(this));         return (             <table classname="resulttable">                 <thead>                 <tr>                     <th>start date:</th>                     <th>end date:</th>                     <th id="hoursfield">hours:</th>                 </tr>                 </thead>                 <tbody>                 {arrayitems}                 </tbody>                 <tfoot>                  </tfoot>             </table>         );     } }); 

and html ....

body  ng-app="app" ng-controller="mainctrl mainctrl">   <div class="tablewrapper"> <react-component name="diarytable" props="firstarrayprops" /> </div>  <button class="mybutton" id="mergebutton" ng-click="runmerge()">merge diaries</button>  <div class="tablewrapper"> <react-component name="diarytable" props="secondarrayprops" /> </div>  <react-component name="diaryresult" props="resultprops" />   </body> 


Comments

Popular posts from this blog

Spring Boot + JPA + Hibernate: Unable to locate persister -

go - Golang: panic: runtime error: invalid memory address or nil pointer dereference using bufio.Scanner -

c - double free or corruption (fasttop) -