CODEWITHSUNDEEP
javascripthtmlangularjsinputtypescript
Adrien Blaizot
Adrien Blaizot

Reputation: 47

ng-required, how to use it between input?

I created a form with two input repeated for X elements. Each element is required only if we put something in the other one:

My.HTML

<form ng-submit="validate();">
 <div ng-reapet="elem in Myelements">
  <label>{{elem.name}}</label>
  <div>
    New Value : <input name="value" ng-required="reason.$valid" ng-model="elem.value" />
  </div>
  <div>
    Why : <textarea name="reason" ng-required="value.$valid" ng-model="elem.reason"/>
  </div>
 </div>  
 <input type="submit" value="Submit" />
</form>

This not working as expected. How do I make this work properly ?

EDIT The right solution for me (the accepted answer helped me)

<form ng-submit="validate();">
    <div ng-reapet="elem in Myelements">
        <label>{{elem.name}}</label>
        <div>
            New Value : <input name="value" ng-required="elem.reason" ng-model="elem.value" />
        </div>
        <div>
            Why : <textarea name="reason" ng-required="elem.value" ng-model="elem.reason"/>
        </div>
    </div>  
    <input type="submit" value="Submit" />
</form>

Upvotes: 2

Views: 175

Answers (1)

Mathew Berg
Mathew Berg

Reputation: 28750

Just pivot off the other inputs value

<form ng-submit="validate();">
    <div ng-reapet="elem in Myelements">
        <label>{{elem.name}}</label>
        <div>
            New Value : <input name="value" ng-required="elem.reason !== ''" ng-model="elem.value" />
        </div>
        <div>
            Why : <textarea name="reason" ng-required="elem.value !== ''" ng-model="elem.reason"/>
        </div>
    </div>  
    <input type="submit" value="Submit" />
</form>

Upvotes: 1

Related Questions