javascript radio button not working on IE7 and IE8

Question

I want to use radio buttons to select a field to submit on my form. I'm using this script:

<script>
    function validateForm(){
        var x=document.forms["preinsert"]["RIF"].value;
        var y=document.forms["preinsert"]["CTP"].value;
        var xd=document.forms["preinsert"]["RIF"].disabled;
        var yd=document.forms["preinsert"]["CTP"].disabled;
        if (xd == false){
            if (x==null || x==""){
                alert("The first field can't be empty.");
                return false;
            }
        }
        else if (yd == false){
            if (y==null || y==""){
                alert("The second field can't be empty.");
                return false;
            }
        }
    }
</script>

on this HTML code:

<form name="preinsert" action="/ServletPreInsert" method="post" onsubmit="return validateForm()">
    <table>
        <tr>
            <td>
                <input type="radio" name="rad" checked="checked" onclick="RIF.disabled=false; CTP.disabled=true;"/>
                <select name="RIF1" class="right-select">
                    <option selected="selected">NB</option>
                    <option>LTI</option>
                </select>
            </td>
            <td>
                <input id="RIF" name="RIF" class="fixed-input" type="text">
            </td>
        </tr>
        <tr>
            <td>
                <input type="radio" name="rad" onclick="RIF.disabled=true; CTP.disabled=false;"/>Counterparty
            </td>
            <td>
                <select id="CTP" name="CTP" class="fixed-select" disabled>
                    <option>Option_1</option>
                    <option>Option_2</option>
                    <option>Option_3</option>
                </select>
            </td>
        </tr>
    </table>
    </br></br>
    <p align="right"><input type="submit" value="Insert"></p>
</form>

What I'm noticing is: if I use this code on browsers like IE7/8, when I select the second radio button, an option and then submit my form, the error message from the javascript appear: "The second field can't be empty." But, if I type something in the first field, with the first radio button selected, it works as I want.

This "mad" thing does not happen on Firefox 26.0.

So, what's wrong?

Answer 1

If you want this working on IE7/8, you must change this:

<select id="CTP" name="CTP" class="fixed-select" disabled>
    <option>Option_1</option>
    <option>Option_2</option>
    <option>Option_3</option>
</select>

into this:

<select id="CTP" name="CTP" class="fixed-select" disabled>
    <option value="Option_1">Option_1</option>
    <option value="Option_2">Option_2</option>
    <option value="Option_3">Option_3</option>
</select>

because if the value parameter is not set, it will always figure as a null value.