CODEWITHSUNDEEP
javascriptformsangularjs
Bruno Camarneiro
Bruno Camarneiro

Reputation: 555

Listen for ng-dirty in multiple forms

I'm building a app using AngularJs

In one of my template partials I use "ng-repeat" to spawn multiple forms:

<ul class="small-block-grid-2 medium-block-grid-3 large-block-grid-4 usbDevices">
  <li ng-repeat="usbDevice in usbDevices">
    <div class="block">
      <form name="form{{usbDevice.id}}">
        <!-- input fields -->
      </form>
    </div>
  </li>
</ul>

How do I make that when any one of this forms shows up "ng-dirty" a "Save" button shows in the bottom? Do I need a watcher?

<a href="#" class="button expanded">Save</a>

Upvotes: 2

Views: 530

Answers (1)

Ivan Chernykh
Ivan Chernykh

Reputation: 42166

You can wrap it all in ng-form , something like:

 <body ng-controller="MainCtrl" ng-form="MainForm">
    <ul class="small-block-grid-2 medium-block-grid-3 large-block-grid-4 usbDevices" >
      <li ng-repeat="usbDevice in usbDevices">
        <div class="block">
          <form name="form{{usbDevice.id}}">
            <input required ng-model="usbDevice.description" >
          </form>
        </div>
      </li>
    </ul>
    <button ng-show="MainForm.$valid">Save</button>
  </body>

Working: http://plnkr.co/edit/Z0CyyoqVHzs4ZV1F6uG4

Upvotes: 2

Related Questions