+ Start a Discussion
Manjunath reddy 25Manjunath reddy 25 

I am trying to latest values in the Cost/unit field after saving in my angular table, basically I need to reload the angular table, but I am not able to reload my angular page or angular table, can someone help me on this?

Manjunath reddy 25Manjunath reddy 25
My code is as below
<apex:page controller="costController"  action="{!updateitems}" showHeader="false">
<apex:stylesheet value="{!URLFOR($Resource.Apttus_Config2__ngCPQ, '/aptCPQUI/assets/stylesheets/angular-material.css')}"/>
<apex:stylesheet value="{!URLFOR($Resource.Apttus_Config2__vendor, '/lib/apttus-nova-design-system/lib/nova.min.css')}"/>
<apex:stylesheet value="{!URLFOR($Resource.Apttus_Config2__ngCPQ, '/aptCPQUI/assets/stylesheets/nova-design-style-changes.css')}"/>

  

<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css"/>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.11/angular.min.js"></script>
<script>
 var App = angular.module('myApp', []);
 App.controller('myctrl', function ($scope) { 
 $scope.lineItems= {!UpdateString};
 console.log("firstPrint $scope.lineItems===", $scope.lineItems);      
 $scope.items= [];
 
 //console.log("jsonlitem"+jsonlitem); 
 console.log("===========secondPrint $scope.lineItems===", $scope.lineItems); 
// $scope.json=angular.toJson($scope.lineItems); 
 
  $scope.getItems = function() {
  //alert($scope.lineItems);
  console.log("getitems -- Print $scope.lineItems", $scope.lineItems); 
    //console.log("jsonlitem"+jsonlitem);  
    $scope.json=angular.toJson($scope.lineItems); 
 Visualforce.remoting.Manager.invokeAction(
 '{!$RemoteAction.costController.ItemsUpdate}', 
 $scope.json,
 function(result, event) {
     //alert(result);
     //alert('enterFunction');
   $scope.items= result;
 }); 
 
 }
 });
</script>

<style>
.button{
border: none;
border-radius: 5px;
background: #A5E0BB;
margin: .4rem .25rem;
font-size: .95rem;
padding: .4rem 1rem;
font-weight: 400;
border: none;
border-radius: 5px;
cursor: pointer;
color: #28492C;
margin-left: 500px;

}
</style>
<style>

table, th, td {
border: 1px solid black;
border-collapse: collapse;
}
.input{
padding: -20px;
text-align: left;
font-size: 15px;   
color: #2093DA;


}

.cost{
padding: -20px;
text-align: right;
font-size: 15px;   


}



th {
background-color: white;
color: #44596C;
min-width: 6rem;
text-align: center !important;
margin-bottom: .5rem;
font-size: 0.875rem;
line-height: 1rem;
font-weight: 700;
}
</style>
</head>
<body ng-app="myApp" class="container" > 

<div style="display:{!if(outPut,"block","none")};" ng-controller="myctrl">   

<table class="table table-bordered" id="t01" width="80%">
<tr>
    <th >Item </th>
    <th colspan="2" >Engineering </th>
    <th colspan="2">Sourcing</th>
    <th colspan="2">Manufacturing </th>
    <th colspan="2">I and FS </th>
    <th> </th>
    
</tr>
 <tr>
   <th></th>
   <th>Per Item</th>
   <th>Per Project</th>
   <th>Per Item</th>
   <th>Per Project</th>
   <th>Per Item</th>
   <th>Per Project</th>
   <th>Per Item</th>
   <th>Per Project</th>
   <th>Cost/unit</th>
 </tr>
 

 <tr ng-repeat="linitem in lineItems| filter:query"> 
     <td>{{linitem.Apttus_Config2__OptionId__r.Name}}</td>
     <td>{{linitem.Apts_Engineering_per_item__c}}</td>
     <td>{{linitem.Apts_Engineering_per_project__c}}</td>
     <td>{{linitem.Apts_Sourcing_price_item__c}}</td>
     <td>{{linitem.Apts_sourcing_per_project__c }}</td>
     <td>{{linitem.apts_Manufacturing_per_item__c}}</td>
     <td>{{linitem.Apts_Manufacturing_per_project__c}}</td>
     <td>{{linitem.Apts_I_FS_per_item__c}}</td>
     <td>{{linitem.Apts_I_FS_per_project__c}}</td>
     <td>{{linitem.Cost_per_unit__c}}</td>
 </tr>
</table>    

</div>


<div style="display:{!if(edit,"block","none")};" ng-controller="myctrl">      
   <apex:form >  
    <table class="table table-bordered" id="t01" width="70%">
 <tr>
     <tr>
    

    <th width="40%">Item </th>
    <th colspan="2" >Engineering </th>
    <th colspan="2">Sourcing</th>
    <th colspan="2">Manufacturing </th>
    <th colspan="2">I and FS </th>
    <th> </th>
 </tr> 
</tr>
 <tr>
   <th width="100%"></th>
   <th>Per Item</th>
   <th>Per Project</th>
   <th>Per Item</th>
   <th>Per Project</th>
   <th>Per Item</th>
   <th>Per Project</th>
   <th>Per Item</th>
   <th>Per Project</th>
   <th>Cost/unit</th>
 </tr>
 
 <tr ng-repeat="linitem in lineItems| filter:query">     
     <td >
     <div ng-if="linitem.Apttus_Config2__OptionId__r.Name == null " style="color:#2093DA;font-weight:bold" > 
        {{linitem.Bundle_Name__c}} 
    </div>
    
     <div ng-if="linitem.Apttus_Config2__OptionId__r.Name != null "  class="input">  
        {{linitem.Apttus_Config2__OptionId__r.Name}} 
    </div>
     </td>
     <td><input type="text" ng-model=" linitem.Apts_Engineering_per_item__c" style="width:80px;" ng-if="linitem.Apttus_Config2__OptionId__r.Name != null "/></td>
     <td><input type="text" ng-model=" linitem.Apts_Engineering_per_project__c" style="width:80px;" ng-if="linitem.Apttus_Config2__OptionId__r.Name != null "/></td>
     <td><input type="text" ng-model=" linitem.Apts_Sourcing_price_item__c" style="width:80px;" ng-if="linitem.Apttus_Config2__OptionId__r.Name != null "/></td>
     <td><input type="text" ng-model=" linitem.Apts_sourcing_per_project__c" style="width:80px;" ng-if="linitem.Apttus_Config2__OptionId__r.Name != null "/></td>
     <td><input type="text" ng-model=" linitem.apts_Manufacturing_per_item__c" style="width:80px;" ng-if="linitem.Apttus_Config2__OptionId__r.Name != null "/></td>
     <td><input type="text" ng-model=" linitem.Apts_Manufacturing_per_project__c" style="width:80px;" ng-if="linitem.Apttus_Config2__OptionId__r.Name != null "/></td>
     <td><input type="text" ng-model=" linitem.Apts_I_FS_per_item__c" style="width:80px;" ng-if="linitem.Apttus_Config2__OptionId__r.Name != null "/></td>
     <td><input type="text" ng-model=" linitem.Apts_I_FS_per_project__c" style="width:80px;" ng-if="linitem.Apttus_Config2__OptionId__r.Name != null "/></td>
     <td ng-if="linitem.Apttus_Config2__OptionId__r.Name != null" class="cost">{{linitem.Cost_per_unit__c}}</td>
     
     
 </tr>
  
</table>
   
       </apex:form>    

        <button  ng-click="getItems()" class="button" >Save </button>
</div>


      

</body>
</apex:page>