Focus on textbox

[Nupur Yaduka]

Hi There

I have a RadTextbox and RadiobuttonList. What I want is when there is a focus on textbox the radiobuttonlist should be visible.

Problem I am facing is that there is no server-side event for 'focus'. So I have to use javascript. I want the radiobutton to be invisible when the page loads. So when i use javascript I cannot find that radiobuttonlist control.

Is there a way i can achieve this through server side event or some other way. Please let me know its urgent.

Thanks

Nupur Yaduka

[Shinu]

Hi Nupur Yaduka,

I tried following client code and it is working fine in my end. Give a try with this.

aspx;

    <telerik:RadTextBox ID="RadTextBox4" runat="server">
        <ClientEvents OnFocus="OnFocus" />
    </telerik:RadTextBox>
    <asp:RadioButtonList ID="RadioButtonList1" runat="server">
        <asp:ListItem Text="Item1"></asp:ListItem>
    </asp:RadioButtonList>

javascript:

<script type="text/javascript">
    function OnFocus() {
        var rbutton = document.getElementById("RadioButtonList1");
        rbutton.style.display = "block";
    }
    function pageLoad() {
        var rbutton = document.getElementById("RadioButtonList1");
        rbutton.style.display = "none";
    }
</script>

-Shinu.

[Nupur Yaduka]

Thanks Shinu, that example works but still if this can be resolved using some server side code would be better for me.

Please let me know if that is possible. 

Thanks

Nupur

[Shinu]

Hello Nupur,

You can invoke an ajaxRequest from clientside, and then set the Visibility of RadioButtonList from code behind in AjaxRequest event as shown below.

ASPX:

    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server"
        onajaxrequest="RadAjaxManager1_AjaxRequest">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="RadAjaxManager1">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadioButtonList2" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>
<telerik:RadTextBox ID="RadTextBox5" runat="server">
        <ClientEvents OnFocus="SetVisibility" />
    </telerik:RadTextBox>
            <asp:RadioButtonList ID="RadioButtonList2" Visible="false" runat="server">
        <asp:ListItem Text="Item1"></asp:ListItem>
    </asp:RadioButtonList>

JavaScript:

<script type="text/javascript">
function SetVisibility() {
        var ajaxManager = $find("<%= RadAjaxManager1.ClientID %>");
        ajaxManager.ajaxRequest("visibility");
    }
</script>

CS:

protected void RadAjaxManager1_AjaxRequest(object sender, Telerik.Web.UI.AjaxRequestEventArgs e)
    {
        RadioButtonList2.Visible = true;
    }

-Shinu.