Reputation: 1655
I use ng-hide and a selectbox to hide/show columns of my table .
HTML
<div ng-controller="MyCtrl">
<table>
<tbody>
<tr>
<td ng-hide="myOption=='one'"><input ng-hide="myOption=='one'"></input></td>
<td ng-hide="myOption=='one' || myOption=='two' "><input ng-hide="myOption=='one' || myOption=='two' "></input></td>
</tr>
</tbody>
</table>
<select ng-model="myOption">
<option value="one">test1</option>
<option value="two">test2</option>
<option value="three">test3</option>
</select>
</div>
It works well.
Here is a fiddle to demonstrate it: Fiddle
Question
How can I clear the values of the hidden input to avoid errors in my calculation? In jQuery i know the solution, but I want to learn AngularJS
Upvotes: 4
Views: 10392
Reputation: 20751
You can use ng-change="[second='', first='']"
to clear out the input fields, otherwise if you want more functionality to be done at the time of on-change use a function call at ng-change="someFunction()"
simply if you want to clear the input field which you have shown in jsfiddle you can try this
<div ng-controller="MyCtrl">
<table>
<tbody>
<tr>
<td ng-hide="myOption=='one'"><input ng-model="first" ng-hide="myOption=='one'"></input></td>
<td ng-hide="myOption=='one' || myOption=='two' "><input ng-model="second" ng-hide="myOption=='one' || myOption=='two' "></input></td>
</tr>
</tbody>
</table>
<select ng-model="myOption" ng-change="[second='', first='']">
<option value="one">test1</option>
<option value="two">test2</option>
<option value="three">test3</option>
</select>
</div>
Upvotes: 1