How to reset the value of validation error based on radio button

Question

I have the below code to select Yes\No for selecting the options from Multi Select dropdown. But It is required only when I select the Yes Option from radio. Otherwise the validation message should disappear when I move from Yes to No. (I am disabling the Multi Select in script when the user selects the No optio)

<input id="Option1" name="MyRadio" ng-model="MyRadioData" type="radio" title="Yes" value="Yes" ng-click="Flip('Yes')" />Yes

<input id="Option2" name="MyRadio" ng-model="MyRadioData" type="radio" title="No" value="No" ng-click="Flip('No')" />No

<select id="MultiSelect1" kendo-multi-select name="MultiSelect1" k-value-primitive="true" k-max-selected-items="30" k-placeholder="multiPlaceHolderVendor"
k-ng-model="MyOptions" k-data-source="MyOptionsDS" ng-required="MyRadioData == 'Yes'" validationmessage="Required"></select>

<span data-for="MultiSelect1" data-role="validator"></span>

But the above code is not working though I have used ng-required option for multi select.

Appreciate any help.

Answer 1

If <span data-for="MultiSelect1" data-role="validator"></span> is where messages put, you can handle with ng-show ng-hide like this:

UPDATE

<!-- if you choose no  it hide--> 
<span ng-hide="MyRadioData == 'No'" data-for="MultiSelect1" data-role="validator"></span>

<!-- if you choose yes  it hide--> 
<span ng-hide="MyRadioData == 'Yes'" data-for="MultiSelect1" data-role="validator"></span>

Here is a plnkr with a button but it does the same, i will help you how this work.