2015-06-08 8 views
8

ho una lista delle marche:Ricarica dopo chiusura modale

<script type="text/ng-template" id="list.brands"> 
     <table class="table table-striped table-bordered bootstrap-datatable datatable dataTable" id="DataTables_Table_0" aria-describedby="DataTables_Table_0_info" ng-controller="BrandsCtrl"> 
        <input type="text" ng-model="searchBox"> 
        <thead> 
        <tr> 
         <th><tags:label text="brandid"/></th> 
         <th><tags:label text="name"/></th> 
         <th><tags:label text="isactive"/></th> 
         <th></th> 
         </tr> 
        </thead> 
        <tbody> 
         <tr id="actionresult{{$index + 1}}" ng-repeat="brand in brands | filter:searchBox"> 
          <td>{{brand.brandid}}</td> 
          <td>{{brand.name}}</td> 
          <td>{{brand.isactive}}</td> 

          <td> 
          <a class="btn btn-ext-darkblue btn-ext-darkblue savestockbtn" ng-click="open(brand.brandid)"><tags:label text="edit"/></a> 
          <a class="btn btn-ext-darkblue btn-modal-trigger btn-ext-darkblue savestockbtn" href="/admin.brands/deleteConfirm?brandid={{brand.brandid}}" data-toggle="modal" ><tags:label text="delete"/></a> 
          </td> 
         </tr> 
        </tbody> 
       </table> 
    </script> 

Questa lista ha la linea marche con il tasto 2; modifica ed elimina. pulsante Modifica apre un modale del marchio modulo di modifica:

<%@page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> 

<%@taglib tagdir="/WEB-INF/tags" prefix="tags"%> 
<%@taglib uri="/WEB-INF/tlds/fields.tld" prefix="fields"%> 

<div class="row-fluid sortable"> 
    <div class="box span12"> 
     <div class="box-content"> 
     <form class="form-horizontal" name="brandform" action='/admin.brands/update' data-toggle="validate" method="post"> 
      <fields:form formName="brand.id.form"> 
       <input type="hidden" ng-model="item.brandid" name="brandid"/> 
      </fields:form> 
      <fields:form formName="brand.form"> 
       <div class="section-heading"></div> 
       <div class="control-group"> 
        <label class="control-label" for="selectError"><tags:label text="name"/> *</label> 
        <div class="controls"> 

         <input name="name" ng-model="item.name" required/> 
        </div> 
       </div> 
       <div class="control-group"> 
        <label class="control-label" for="selectError"><tags:label text="isactive"/> </label> 
        <div class="controls"> 
         <input type="checkbox" ng-model="item.isactive" ng-checked="item.isactive" name="isactive" value="1"/> 

        </div> 
       </div> 
      </fields:form> 
       <div class="form-actions"> 
        <a ng-click="cancel()" class="btn btn-ext-lightblue"><tags:label text="close"/></a> 
        <a ng-click="ok()" class="btn btn-ext-darkblue btn-disable-on-submit" ><tags:label text="save"/></a> 
       </div> 
     </form> 
    </div> 
</div> 
</div> 

In modale, salvare il pulsante salva le modifiche e chiude la modale.

Desidero ricaricare la lista dopo la chiusura. Come posso farlo ? I controller di elenco e modali sono diversi.

Come posso ricaricare lo sfondo di modale dopo averlo chiuso?

+0

Forse generare un evento nel metodo di chiusura modale che sta chiudendo e ascoltarlo nell'altro controller? – robertk

+0

si prega di fornire maggiori informazioni, e bonjour a toi aussi Garip!. –

risposta

14

È possibile trasmettere un metodo per comunicare

provare come questo

controller modale in cui il pulsante di chiusura viene attivato

$rootScope.$broadcast('updateList'); 

Se vuoi passare i dati da modale

$rootScope.$broadcast('updateList',{data : 'passing'}); // pass object in {} if you wanna to pass anything 

Nel controller dati

$scope.$on("updateList",function(){ 
    // Post your code 
}); 

se hai superato i dati da modale

$scope.$on("updateList",function(e,a){ 
     // Post your code 
    console.log(a.data); 
}); 
+0

Registra 'undefined' nella console. – GaripTipici

+0

Ho aggiornato la mia risposta. Prova ora –

+0

Funziona ora, qual è la funzionalità di e e a qui? – GaripTipici

3

Se si utilizza angolare UI $modal servizio, allora la sua piuttosto semplice. Il metodo open() del servizio $modal restituisce una promessa su close e cancel del modale.

Diciamo

var myModal = $modal.open({ 
    animation: true, 
    templateUrl: 'editForm.html', 
    backdrop: 'static', 
    keyboard: false, 
    scope: $scope 

}); 

myModal.result.then(function(){ 
    //Call function to reload the list 
}); 

Come si sta chiamando $modal.open dalla lista controller stesso, avete avuto accesso a `promessa' controller lista unica e da lì si può facilmente chiamare la funzione per ricaricare la lista.

+0

Desidero richiamare la funzione reloadlist() dopo aver chiuso la modal. Posso farlo iniettando BrandService su BrandCtrl ma non so come posso passare i dati a BrandsCtrl da BrandCtrl. Anche se potessi farlo, aggiornerà la lista? – GaripTipici

+0

Se è necessario comunicare tra i controller (Figlio/Genitore/Fratelli/sorelle) è necessario utilizzare $ broadcast/$ emit su $ scope o $ rootScope in base alla relazione dei controller. vedere questo: http://stackoverflow.com/questions/29467339/how-to-call-function-in-another-controller-in-angularjs/29468486#29468486 –

+0

Ho provato a inviare con $ rootScope. $ broadcast ('newList ', {data: lista}); ma non ho potuto ottenerlo da $ scope. $ on ("newList", function (a) {console.log (a.data);} Registra non definito. – GaripTipici