I was able to solve my problem using jquery. I added a one additional field which would hides the 2 required options. I seperated both the input fields into 2 different divisions. and then I wrote the jquery code which would carryout the condition required.
View:
<select id="taxid" style="width:10%;">
<option>Select TaxID Type</option>
<option value="id1">ID1</option>
<option value="id2">ID2</option>
</select>
<div id="feinfield">
@Html.TextAreaFor(Model => Model.ID1, new { style = "width:50%; border-color: grey" })
@Html.ValidationMessageFor(Model => Model.ID1)
</div>
<div id="ssnfield">
@Html.TextAreaFor(Model => Model.ID2, new { style = "width:50%; border-color: grey" })
@Html.ValidationMessageFor(Model => Model.ID2)
</div>
jquery
<script>
$(function () {
$('#id1field').hide();
$('#taxid').change(function () {
if ($('#taxid').val() == 'id1') {
$('#id1field').show();
} else {
$('#id1field').hide();
}
});
});
$(function () {
$('#id2field').hide();
$('#taxid').change(function () {
if ($('#taxid').val() == 'id2') {
$('#id2field').show();
} else {
$('#id2field').hide();
}
});
});
</script>
Let me know if you have any concerns/queries about my solutions.