Make default button using JavaScript/JQuery

Question

I have 3 Divs as below:

<div id="div1">
    <table>
        <tr>
            <td>
                <Telerik:RadTextBox ID="RadTextBox1" runat="server">
                </Telerik:RadTextBox>
            </td>
        </tr>
        <tr>
            <td>
                <Telerik:RadTextBox ID="RadTextBox2" runat="server">
                </Telerik:RadTextBox>
            </td>
        </tr>
        <tr>
            <td>
                <Telerik:RadComboBox ID="RadComboBox1" runat="server">
                    <Items>
                        <Telerik:RadComboBoxItem Value="1" Text="First" />
                        <Telerik:RadComboBoxItem Value="2" Text="Second" />
                    </Items>
                </Telerik:RadComboBox>
            </td>
        </tr>
        <tr>
            <td>
                <Telerik:RadButton ID="RadButton1" runat="server" Text="Button 1">
                </Telerik:RadButton>
            </td>
        </tr>
    </table>
</div>
<div id="div2">
    <table>
        <tr>
            <td>
                <Telerik:RadTextBox ID="RadTextBox3" runat="server">
                </Telerik:RadTextBox>
            </td>
        </tr>
        <tr>
            <td>
                <Telerik:RadTextBox ID="RadTextBox4" runat="server">
                </Telerik:RadTextBox>
            </td>
        </tr>
        <tr>
            <td>
                <Telerik:RadComboBox ID="RadComboBox2" runat="server">
                    <Items>
                        <Telerik:RadComboBoxItem Value="1" Text="First" />
                        <Telerik:RadComboBoxItem Value="2" Text="Second" />
                    </Items>
                </Telerik:RadComboBox>
            </td>
        </tr>
        <tr>
            <td>
                <Telerik:RadButton ID="RadButton2" runat="server" Text="Button 2">
                </Telerik:RadButton>
            </td>
        </tr>
    </table>
</div>

If any of the textboxes or combobox (and there are additional html elements like calendar control etc) is focused, then I would like to set that divs button as default button when the enter is pressed.

I tried the code as below just for the RadTextBoxes:

$().ready(function() {
                $(document).keypress(function(e) {
                    if ((e.which && e.which == 13) || (e.keyCode && e.keyCode == 13)) {
                        e.preventDefault();
                        if ($('#div1 input').is(":focus")) {
                            alert("div1");
                        }
                        else if ($('#div2 input').is(":focus")) {
                            alert("Inside div2");
                        }
                        else {
                            return false;
                        }
                    }
                });
            });

I see it does not get inside into either of the If clauses. Could someone help me?

Answer 1

I was able to set the default button when the textboxes where focused. I see that the class riFocused is added when a RadTextBox is focused

if ($('#div1 input.riFocused').length > 0 || $('#div1.rcbFocused').length > 0) {
     alert("Inside div1");
}
else if ($('#div2 input.riFocused').length > 0) {
     alert("Inside div2");
}
else {
     return false;
}

For the RadComboBox, the class was rcbFocused. But the problem is, when I click Enter, I was not able to even get into the document.ready loop.