We help IT Professionals succeed at work.

Remove text from textbox when textbox becomes invisible

AlHal2
AlHal2 asked
on
Medium Priority
98 Views
Last Modified: 2019-09-09
I have this code Typesript code using AngularJs.  There are two radio buttons "All shops" and "selected shops".  If the selected shops button is pressed, an extra textbox becomes visible where user can enter which shops they want.
If all shops are selected the textbox becomes invisible.
How can I clear the text from the textbox when the textbox becomes invisible.

       <tr> <!-- Scope of Distribution -->
        <td class="${styles.editRowHeader}">Scope of Distribution:</td>
        <td>
        <div ng-show="vm.showEditControls">
          <input type="radio" ng-model="vm.editAllShops" ng-value="true" /> All Shops and Stores          
          <input type="radio" ng-model="vm.editAllShops" ng-value="false" /> Specified Shops and Stores
        </div>
        


        </td>
       </tr>
       <tr>
          <div>
            <td  ng-hide="vm.editAllShops" class="${styles.editRowHeader}">Selected Shops:</td>
            <td>
              <!--<input  ng-hide="vm.editAllShops" class="${styles.efTextField}" ng-show="vm.showEditControls" type="text" ng-Model="vm.editSelectedShops" maxlength="100" />-->
              <input  ng-hide="vm.editAllShops" class="${styles.efTextField}" ng-show="vm.showLabelControls" type="text" text="" ng-Model="vm.editSelectedShops" maxlength="100" />
              
            </td>
          </div>
       </tr>
       <tr> <!-- insights -->
        <td class="${styles.editRowHeader}">Previous Insights:</td>
        <td>
        <textarea class="${styles.efTextArea}" ng-show="vm.showEditControls" ng-Model="vm.editInsights" rows="2" cols="50"></textarea>	
        <textarea class="${styles.efTextArea}" ng-show="vm.showLabelControls" ng-Model="vm.editInsights" disabled rows="2" cols="50"></textarea>	
        </td>
       </tr>

Open in new window

Comment
Watch Question

CERTIFIED EXPERT
Most Valuable Expert 2017
Distinguished Expert 2019
Commented:
Change line 18 to
<input type="radio" ng-model="vm.editAllShops" ng-click="vm.editSelectedShops=''" ng-value="false" /> Specified Shops and Stores

Open in new window

i.e. add an ng-click that clears the value of editSelectedShops

Author

Commented:
Thanks.
CERTIFIED EXPERT
Most Valuable Expert 2017
Distinguished Expert 2019

Commented:
You are welcome.