RadInputManager focus on error

[Mehmet Tirgil]

hi,

i use rad inputmanager like this

<telerik:RadInputManager ID="RadInputManager1" runat="server" Skin="WebBlue" >

                                <telerik:TextBoxSetting Validation-IsRequired="true" Validation-ValidationGroup="News">

                                    <TargetControls>

                                        <telerik:TargetInput ControlID="TbxContentHeader" />

                                    </TargetControls>

                                </telerik:TextBoxSetting>

                            </telerik:RadInputManager>

when TbxContentHeader is empty and press button it works. But it can not be focused to TbxContentHeader. So my button is at bottom of the page, TbxContentHeader is at the top of the page. So users can not see why button does not work. How can i focus when error appears.

[Shinu]

Hi,

Try the following code in order to focus to the textbox when validation fails.

aspx:

<telerik:RadInputManager ID="RadInputManager1" runat="server" Skin="WebBlue">
    <telerik:TextBoxSetting Validation-IsRequired="true">
        <ClientEvents  OnValidating="OnValidating" />
        <TargetControls>
            <telerik:TargetInput ControlID="TbxContentHeader" />
        </TargetControls>
    </telerik:TextBoxSetting>
</telerik:RadInputManager>
<asp:TextBox ID="TbxContentHeader" Text="" runat="server"></asp:TextBox>

javascript:

    function OnValidating(sender, args) {
        var id = args.get_input().get_id();
        var textbox = document.getElementById(id);
        if (textbox.value == "") {
            textbox.focus();
        }
    }

-Shinu.

[Mehmet Tirgil]

Hi,

Thank you, it worked for me.

[adam]

Hi 

That kind of worked for me.

i have a number of texboxs and have the radinputmanager set up as follows

<telerik:RadInputManager ID="RadInputManager" runat="server">
    <telerik:TextBoxSetting EmptyMessage="Company Name" Validation-IsRequired="true" Validation-ValidationGroup="Val-contact">
        <ClientEvents OnValidating="OnValidating" />
        <TargetControls>
            <telerik:TargetInput ControlID="TxtFullname" />
        </TargetControls>
    </telerik:TextBoxSetting>
    <telerik:TextBoxSetting EmptyMessage="Address One" Validation-IsRequired="true" Validation-ValidationGroup="Val-contact">
    <ClientEvents OnValidating="OnValidating" />
        <TargetControls>
            <telerik:TargetInput ControlID="TxtEmailAddress" />
        </TargetControls>
    </telerik:TextBoxSetting>
    <telerik:TextBoxSetting EmptyMessage="Your Name" Validation-IsRequired="true" Validation-ValidationGroup="Val-contact">
    <ClientEvents OnValidating="OnValidating" />
        <TargetControls>
            <telerik:TargetInput ControlID="TxtTelephone" />
        </TargetControls>
    </telerik:TextBoxSetting>
    <telerik:TextBoxSetting EmptyMessage="Email Address" Validation-IsRequired="true" Validation-ValidationGroup="Val-contact">
    <ClientEvents OnValidating="OnValidating" />
        <TargetControls>
            <telerik:TargetInput ControlID="TxtEmailAddress" />
        </TargetControls>
    </telerik:TextBoxSetting>
     <telerik:TextBoxSetting EmptyMessage="Query">
        <TargetControls>
            <telerik:TargetInput ControlID="TxtQuery" />
        </TargetControls>
    </telerik:TextBoxSetting>
</telerik:RadInputManager>

When i submit the form it focuses on "TxtEmalAddress" even though its the 2nd non validated field. also if i submit and its focuses and then i change my mind and want to navigate somewhere else on the site i can't until i've entered a value in the focused textbox.

any ideas on these issues?

cheers

[Michael]

I have same issue.

Any viable solution would be appreciated!

Thanks!

[Shinu]

Hi Dan,

I guess you want to focus the first non validated TextBox. Please have a look into the following code snippet which works fine at my end.

ASPX:

<asp:TextBox ID="TxtFullname" runat="server">
</asp:TextBox>
<br />
<asp:TextBox ID="TxtEmailAddress" runat="server">
</asp:TextBox>
<br />
<asp:TextBox ID="TxtTelephone" runat="server">
</asp:TextBox>
<br />
<asp:TextBox ID="TxtQuery" runat="server">
</asp:TextBox>
<br />
<telerik:RadInputManager ID="RadInputManager" runat="server">
    <telerik:TextBoxSetting EmptyMessage="Company Name" Validation-IsRequired="true"
        Validation-ValidationGroup="Val-contact">
        <ClientEvents OnValidating="OnValidating" />
        <TargetControls>
            <telerik:TargetInput ControlID="TxtFullname" />
        </TargetControls>
    </telerik:TextBoxSetting>
    <telerik:TextBoxSetting EmptyMessage="Address One" Validation-IsRequired="true" Validation-ValidationGroup="Val-contact">
        <ClientEvents OnValidating="OnValidating" />
        <TargetControls>
            <telerik:TargetInput ControlID="TxtEmailAddress" />
        </TargetControls>
    </telerik:TextBoxSetting>
    <telerik:TextBoxSetting EmptyMessage="Your Name" Validation-IsRequired="true" Validation-ValidationGroup="Val-contact">
        <ClientEvents OnValidating="OnValidating" />
        <TargetControls>
            <telerik:TargetInput ControlID="TxtTelephone" />
        </TargetControls>
    </telerik:TextBoxSetting>
    <telerik:TextBoxSetting EmptyMessage="Query">
        <TargetControls>
            <telerik:TargetInput ControlID="TxtQuery" />
        </TargetControls>
    </telerik:TextBoxSetting>
</telerik:RadInputManager>
<telerik:RadButton ID="RadButton1" runat="server" Text="Validate" ValidationGroup="Val-contact">
</telerik:RadButton>

JavaScript:

<script type="text/javascript">
    var flag = 0;
    function OnValidating(sender, args) {
        if (flag == 0) {
            var id = args.get_input().get_id();
            var textbox = document.getElementById(id);
            if (textbox.value == textbox.defaultValue) {
                textbox.focus();
                flag = 1;
            }
        }
    }
</script>

Please elaborate your requirement if it doesn't help.
Thanks,
Shinu.