Ng-reapeat selects input from all Forms change together

Asked

Viewed 55 times

0

Hello,

I’m a beginner with Angularjs, and I’m having trouble with ng-repeat:

The user can enter a snippet of a form as many times as he wants but in each one of them it should be possible to select different options.

I put ng-reapet, but it turns out that the option I select in any of the replicated snippets automatically changes the other selects of the other snippets as well

http://jsfiddle.net/yfj68juq/

<div ng-app="icmssProdutos" ng-controller="IcmssProdutosController">
  <div ng-repeat="icms in ICMSs">
    <div class="jumbotron">
      <label for="ex2">Regime</label>
      <select class="form-control" ng-model="selected.regime" ng-options="r.regime for r in data">
        <option value="">Selecione o Regime</option>
      </select>
      <label for="ex2" ng-show="selected.regime">Situação Tributária
        <select class="form-control" ng-show="selected.regime" ng-model="selected.situacao" ng-options="s.situacao for s in selected.regime.SituacaoTributaria">
          <option value="">Selecione a Situação Tributária</option>
        </select>
      </label>
      <label for="ex2" ng-show="selected.regime">Origem
        <select class="form-control" ng-model="selected.Origem" ng-options="o.Origem for o in selected.regime.Origens">
          <option value="">Selecione a Origem do Produto</option>
        </select>
      </label>
    </div>
  </div>

  <button type="button" class="btn btn-warning" ng-click="IncluirICMS()">INCLUIR</button>
</div>

How to solve this?

  • From what I understand, you’re generating forms dynamically, which means you have more than one. Put the part of the code that also generates the forms, without this we have no way to simulate your problem (which is probably scope).

  • @Gabrielkatakura, thank you for answering. See the fiddle for all the code for this action http://jsfiddle.net/yfj68juq/ is actually just a snippet of the form that will be replicated not the whole form

  • After you push your object, delete it. delete $Scope.data

  • Thanks @Paulogustavo this way, by clicking the include button, the selects are not working http://jsfiddle.net/x8mcrkju/3/

  • @Gih, maybe the problem that is happening is that the same list you add is the list that "lists" the icms. Try to store that somewhere else, another list. See if this solves your problem: http://jsfiddle.net/x8mcrkju/4/ Notice that I have put {{selected}} to show all the objects you have inside the list

  • Thanks @Paulogustavo but this way how do I access the data {{selecionados}} and organize in a table for example

Show 1 more comment

1 answer

0


According to the link that was past, all the ICMS were operating on top of the same object, the Selected. To solve the problem, simply remove the Selected (which is unnecessary in this case), and take advantage of the variable icms of ng-repeat. So each will operate with his object. Here is the solution:

http://jsfiddle.net/zbdvke2w/1/

  • Thank you that solved :D If it is possible to answer, how do I take action to remove if the person gives up putting the tax?

  • Just put a button that when you click it, it removes the ICMS object from the $Scope.Icmss property.

  • With ng-remove?? <button style="float:right "type="button" class="btn btn-danger" ng-remove="icms">x</button> http://jsfiddle.net/zbdvke2w/2/

  • No, you have to create a button and associate it in an event that does this removerIcms action. http://jsfiddle.net/zbdvke2w/3/

  • Thank you works perfectly, but I don’t understand what exactly makes these two parts of Function(icms): .indexOf(icms); and .splice(index, 1)

  • https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf

  • https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/splice

  • Thank you very much Gabriel

Show 3 more comments

Browser other questions tagged

You are not signed in. Login or sign up in order to post.