Non è possibile ottenere il valore della selezione di selezione dinamicamente in AngularJS

Di seguito è riportato il mio codice in cui non viene selezionata l'opzione radio per ciascuna riga corrispondente, fatemi sapere cosa sto facendo male qui.Non è possibile ottenere il valore della selezione di selezione dinamicamente in AngularJS

mio Plnkr Codice - http://plnkr.co/edit/MNLOxKqrlN5ccaUs5gpT?p=preview

Anche se io sono sempre nomi per classes oggetto, ma non ottenere la selezione.

codice HTML -

<body ng-controller="myCtrl"> 
    <div class="container-fluid"> 
     <form name="formValidate" ng-submit="submitForm()" novalidate="" class="form-validate form-horizontal"> 
      <div class="form-group"> 
      <label class="col-sm-2 control-label">Name</label> 
      <div class="col-sm-6"> 
       <input type="text" name="name" required="" ng-model="classes.name" class="form-control" /> 
      </div> 
      </div> 
      <div class="form-group"> 
      <table id="datatable1" class="table table-striped table-hover"> 
       <tr class="gradeA" ng-repeat="cls in reqgrps"> 
        <td ng-bind="cls.name"></td> 
        <td><input type="radio" name="groupName[{{$index}}]" ng-model="classes.satisfies"> Choice 1</td> 
        <td><input type="radio" name="groupName[{{$index}}]" ng-model="classes.satisfies"> Choice 2</td> 
        <td><input type="radio" name="groupName[{{$index}}]" ng-model="classes.satisfies"> Choice 3</td> 
       </tr> 
      </table> 
      </div> 
      <div class="panel-footer text-center"> 
      <button type="submit" class="btn btn-info">Submit</button> 
      </div>  
     </form> 
    </div> 

    <div class="result">{{classes}}</div> 
    </body>

file script -

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

myApp.controller('myCtrl', function($scope){ 
    $scope.reqgrps = [{name: 'Sub1', roll: 121},{name: 'Sub2', roll: 122}, {name: 'Sub3', roll: 123}]; 
    $scope.classes = {}; 
    $scope.result = {}; 

    $scope.submitForm = function() { 
    $scope.result = $scope.classes; 
    }; 

});

------------- EDIT ------- ------

Uscita prevista -

classi obj -

{ 
    name: "Test Class", 
    satisfies: [ 
     "Sub1": "Choice 1", 
     "Sub2": "Choice 3", 
     "Sub3": "Choice 2", 
     ................. 
     .................. 
     .................. 
     .................. 
     "Subn": "Choice 2", 
    ] 
}

fonte

2015-05-26 Tech Solvr

io non sono sicuro di capire che cosa si sta cercando di fare qui .... si dispone di un oggetto vuoto, e si sono , cosa, cercando di memorizzare i pulsanti di opzione selezionati in quell'oggetto vuoto? Non penso davvero che tu possa farlo in questo modo. – Claies

Non è necessario inizializzare oggetti vuoti per utilizzarli in ng-model, ng-model creerà implicitamente la proprietà scope se non esiste già –

@Claies Come posso acquisire quale pulsante di opzione è selezionato per ogni riga successiva ... Diciamo che per Sub 1 scelgo "Choice1" per Sub 2, scelgo "Choice3" ... e così via ... mi faccia sapere se ha senso –

È necessario distinguere tra ogni riga generata da ng-repeat.

Si può fare questo con l'aggiunta di [indice $] per ogni ng-modello come questo:

<td><input type="radio" ng-model="classes.satisfies[$index]" value="Choice 1"> Choice 1</td> 
<td><input type="radio" ng-model="classes.satisfies[$index]" value="Choice 2"> Choice 2</td> 
<td><input type="radio" ng-model="classes.satisfies[$index]" value="Choice 3"> Choice 3</td>

Come altri hanno già detto, è possibile rendere il risultato dinamico in base alle esigenze utilizzando ng-valore per impostare il valore che è passato nel modello.

L'oggetto risultante è qualcosa di simile:

{"name":"Bill","satisfies":{"0":"Choice 2","1":"Choice 1","2":"Choice 3"}}

See plunker here

fonte

2015-05-26 21:10:08 jordajm

Tutto quello che posso dire è .... WoW ...... questo è quello che mi serve !!! –

Felice di aiutare ... è sempre divertente e stimolante usare ng-model con ng-repeat - $ index può risparmiare un sacco di tempo, e puoi usarlo come {{$ index}} anche se non sei in una direttiva. – jordajm

@jordam ..thx per il suggerimento pro :) –

è necessario specificare una diversa proprietà ng-modello per ogni riga. (Non sei sicuro del motivo per cui desideri specificare lo stesso modello su 3 file identiche). In teoria non devi farlo, ma come ho detto, non vedo perché lo faresti.

Inoltre si dovrebbe aggiungere un attributo value sui tuoi pulsanti di opzione:

http://plnkr.co/edit/JN4JuQJH2OvRxoawfDbv?p=preview

Dalla documentazione angolari:

valore stringa
Il valore per cui l'espressione deve essere impostato quando selezionato.

https://docs.angularjs.org/api/ng/input/input%5Bradio%5D

consiglierei anche di rimuovere l'inizializzazione degli oggetti vuoti nel controller (se-modello ng non trova la proprietà sulla portata sarà sufficiente creare per voi), e io ve notato che hai usato ng-bind, nel caso non lo sa che è solo una scorciatoia per le doppie parentesi: {{}}

EDIT:

nel caso in cui il valore deve essere un valore dinamico è possibile utilizzare ng-value e specifica una proprietà sull'ambito che è possibile impostare sul controller

fonte

2015-05-26 20:37:34

..table (tr) è dinamico ... quindi ho bisogno di gestirlo dinamicamente. –

Cosa deve fare la tua tabella dinamicamente con l'aggiunta di un attributo value sui tuoi pulsanti radio? –

"Non sono sicuro del motivo per cui dovresti specificare lo stesso modello su 3 file identiche" se assegnerò un modello diverso. Selezioneremo 3 valus non uno ... Voglio catturare la scelta per ogni riga .. diciamo = >> Sub 1 Scelgo "Choice1" per Sub 2 scelgo "Choice3" ..e così via –

È necessario impostare ng-value per ciascun pulsante di opzione, in modo che Angular sia in grado di selezionare tali valori. Hai 3 file identiche, quindi ho aggiunto alcuni valori fittizi affinché mostrassero l'output corretto.

http://plnkr.co/edit/AxUx83xdotniYru6amGU?p=preview

Inoltre, è possibile trovare un esempio esplicito di utilizzare i pulsanti di opzione angolari nella documentazione ufficiale qui:

https://docs.angularjs.org/api/ng/input/input%5Bradio%5D

UPDATE:

Controllare a cura plnkr, spero che aiuta!

fonte

2015-05-26 20:41:12 skymk

Voglio qualcosa di simile - Per "Sub1" seleziono "Choice1", Per "Sub2" seleziono "Choice2" e Per "Sub3" seleziono "Choice2 "... nota che queste righe sono dinamiche ... Spero che abbia senso per te –

@ TechSolvr puoi pubblicare un esempio di oggetto che vuoi ricevere dopo aver controllato tutti i pulsanti di opzione? – skymk

Si prega di trovare il mio modificare o controllare questo - http://pastebin.com/KYzSdvAE –

Non è possibile ottenere il valore della selezione di selezione dinamicamente in AngularJS

risposta

Problemi correlati