5

में नया रिकॉर्ड डालने के बाद स्मार्ट टेबल रीफ्रेश करें, मैं कोणीय-बूटस्ट्रैप और कोणीय स्मार्ट तालिका का उपयोग करता हूं। मेरे पास एक मॉडल फॉर्म है जो डेटाबेस में नए रिकॉर्ड जोड़ता है और मेरी स्मार्ट टेबल में सूची दिखाता है। नए रिकॉर्ड जोड़ना ठीक काम कर रहा है लेकिन डेटाबेस में एक नया रिकॉर्ड डालने के बाद मैं अपनी स्मार्ट टेबल को रीफ्रेश कैसे करूं।एंगुलरजेएस बूटस्ट्रैप मॉडल फॉर्म

नियंत्रक

//ajax request to gather data and list in smart table 
october.controllers['dashboard/feeds'] = function ($scope, $filter , $request, $modal, $log, $http) { 

    $scope.api = $request('onFeeds', {success: function(data, scope){ 
     this.success(data).done(function() { 
      $scope.rowCollection = []; 
      $scope.rowCollection = angular.fromJson(data.result); 
      $scope.displayedCollection = [].concat($scope.rowCollection); 


      }); 
     } 
    }); 
} 

//Modal 

var ModalInstanceCtrl = function ($scope, $modalInstance, $request, $filter) { 


    $scope.save = function (data) { 

     $request('onAddFeed', 

     {data:data, 
       success: function(data){ 
       this.success(data); 
        $scope.refresh(); 
        $modalInstance.close(); 

      } 
     }); 

    }; 
}; 

खाका

 <script type="text/ng-template" id="myModalContent.html"> 
      <div class="modal-header"> 
       <h3 class="modal-title">neue Feed eintragen!</h3> 
      </div> 
      <div class="modal-body"> 
       <form class="form-horizontal" role="form"> 
        <input type=hidden ng-init="formInfo.user_id = {% endverbatim %} {{ user.id }} "> 
        {%verbatim %} 
        <div class="form-group"> 
        <label for="inputName3" class="col-sm-2 control-label">Feed Name</label> 
        <div class="col-sm-8"> 
         <input class="form-control" id="inputName3" placeholder="Feed Name" ng-model="formInfo.name"> 
        </div> 
       </div> 
       <div class="form-group"> 
       <label for="inputEmail3" class="col-sm-2 control-label">Feed Type</label> 
       <div class="col-sm-8"> 
        <select ng-model="formInfo.feed_type" class="form-control"> 
         <option>Select Feed Source</option> 
         <option value="api">API</option> 
         <option value="xml">XML</option> 
         <option value="csv">CSV</option> 
         <option value="json">JSON</option> 
         <option value="upload">Upload</option> 
        </select> 
       </div> 
     </div> 

     <div class="form-group" ng-show="formInfo.feed_type =='api'"> 
      <label for="selectAPI" class="col-sm-2 control-label">Select API</label> 
      <div class="col-sm-8"> 
       <select ng-change="selectAction(item.id)" ng-model="formInfo.network_id" ng-options="item.id as item.name for item in networks" class="form-control"> </select> 
      </div> 
     </div> 

     <div class="form-group" ng-repeat="setup in setups"> 
      <label for="setup" class="col-sm-2 control-label">{{setup}}</label> 
      <div class="col-sm-8"> 
       <input ng-model="formInfo['api_credentials'][setup]" class="form-control" placeholder="Enter your {{setup}}"> 

     </div> 
     </div> 

     <div class="form-group" ng-show="formInfo.feed_type =='xml' || formInfo.feed_type =='csv' "> 
      <label for="inputPassword3" class="col-sm-2 control-label">Source</label> 
      <div class="col-sm-8"> 
       <div class="input-group"> 
        <div class="input-group-addon"><i class="fa fa-link"></i></div> 
       <input ng-model="formInfo.source" type="text" class="form-control" id="sourceInput" placeholder="URL"> 
     </div> 

     </div> 
    </div> 
</div> 
<span>{{formInfo}}</span> 
</form> 
</div> 
<div class="modal-footer"> 
    <button type="submit" class="btn btn-primary" ng-click="save(formInfo)">Save</button> 
    <button type="button" class="btn btn-warning" ng-click="cancel()">Cancel</button> 
</div> 
</script> 
+0

क्या आप तालिका को ताज़ा करने के लिए $ scope.api को कॉल नहीं कर सकते? –

+0

मैं कोशिश कर रहा हूं ऐसा लगता है कि – fefe

उत्तर

5
{data:data, 
      success: function(data){ 
      this.success(data); 
       $scope.refresh(); 
       $modalInstance.close(); 

     } 

इसके बजाय $ scope.refresh की उपरोक्त कोड में() $ route.reload (का उपयोग करें) के लिए अद्यतन मॉडल इंस्टेंस को बंद करने से पहले रिकॉर्ड।

पुनः लोड() वर्तमान मार्ग को फिर से लोड करने के लिए $ मार्ग सेवा भले ही $ स्थान

+1

काम नहीं करता है यह मेरे लिए काम करता है, लेकिन ऐसा लगता है कि आपको एक रीलोड को मजबूर नहीं करना चाहिए। मुझे उम्मीद है कि इसे उस सरणी में जोड़ने की आवश्यकता होगी जो स्मार्ट-टेबल देख रहा है, लेकिन यह निश्चित रूप से काम नहीं करता है। – bbrown

0

बात है कि मेरे लिए काम किया नहीं बदला है (और लगता है कि आप समस्या का कारण करने के लिए) का कारण बनता है के लिए है एक खाली सरणी में displayedCollection सेट करें। स्मार्ट टेबल इसे आपके द्वारा निर्दिष्ट किए गए पेज, जो फ़िल्टर किए गए, फ़िल्टर किए गए या सॉर्ट किए गए डेटा से भर देगा। कुछ इस तरह:

<table st-table="displayedCollection" st-safe-src="rowCollection"> 
अचानक

सभी, rowCollection.push(data) स्वचालित रूप से स्मार्ट टेबल अपडेट किया गया।

+0

मैं स्मार्ट टेबल का उपयोग आपके रूप में कर रहा हूं, लेकिन यह समाधान मेरे लिए काम नहीं कर रहा है क्योंकि यह तालिका को साफ़ करता है लेकिन इसे रीफ्रेश नहीं करता है। – mggSoft

+0

क्या आप अपने नियंत्रक में '$ scope.displayedCollection = [];' सेट करते हैं या आप '$ scope.displayedCollection = [] .concat (rowCollection);'? यदि आप पहले व्यक्ति करते हैं तो यह काम करेगा। – bbrown

+0

हां, मैंने पहला किया था। '$ Path.reload()' के बिना यह काम नहीं करता है – mggSoft

1

स्मार्ट-टेबल रीफ्रेश करने के लिए आप आइटम जोड़ या निकाल सकते हैं या सरणी को फिर से बना सकते हैं।

$scope.tableData = [].concat($scope.tableData); 
संबंधित मुद्दे