This is a migrated thread and some comments may be shown as answers.

Prevent Enter key from toggling checkbox

4 Answers 47 Views
Button
This is a migrated thread and some comments may be shown as answers.
Michael H
Top achievements
Rank 2
Michael H asked on 02 Sep 2013, 09:39 AM
I would like to have a RadButton checkbox toggle by only the space bar and not the Enter key.

Is there an easy way to do this?

Thanks

4 Answers, 1 is accepted

Sort by
0
Ianko
Telerik team
answered on 04 Sep 2013, 04:48 PM
Hi Michael,

You can use the client-side API of the RadButton control in order to detect when the Enter key is pressed and cancel the click event. The following code sample demonstrates this approach:
<script type="text/javascript">
    function OnClientClicking(sender, args) {
        var event = args.get_domEvent();
        if (event.keyCode == 13) {
            args.set_cancel(true);
        }
    }
</script>
 
<telerik:RadButton ID="btnVolume" runat="server" ButtonType="ToggleButton" ToggleType="CustomToggle"
    Width="100px" Height="60px" AutoPostBack="false" Skin="Metro" OnClientClicking="OnClientClicking">
    <ToggleStates>
        <telerik:RadButtonToggleState
            Text="Volume: Mute" Selected="true"></telerik:RadButtonToggleState>
        <telerik:RadButtonToggleState
            Text="Volume: Low"></telerik:RadButtonToggleState>
        <telerik:RadButtonToggleState
            Text="Volume: Medium"></telerik:RadButtonToggleState>
        <telerik:RadButtonToggleState
            Text="Volume: High"></telerik:RadButtonToggleState>
    </ToggleStates>
</telerik:RadButton>


Regards,
Ianko
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
0
Michael H
Top achievements
Rank 2
answered on 04 Sep 2013, 09:08 PM
Thanks very much Ianko!
0
Thomas Yanez
Top achievements
Rank 1
answered on 18 Sep 2013, 02:40 PM
EDIT : Forgot to mention, the RadButton in question is inside a RadNotification's content template, if that makes a difference.

I tried to use that example to prevent the space bar from triggering the button (don't ask), but it doesn't seem to work.

<script type="text/javascript">
    function OnClientClicking(sender, args) {
        var event = args.get_domEvent();
        if (event.keyCode == 32) {
            args.set_cancel(true);
        }
    }
</script>

Space was still triggering the button.  I put an alert() inside the condition to make sure I was getting there, and then the behavior changed to the alert popping up (so I was definitely in the condition), clearing itself without my interaction (assuming it ate the space) and the button not triggering, but then if I hit space again, this time, it would just trigger the button (no alert popped up.)

Then, I tried this :

<script type="text/javascript">
    function OnClientClicking(sender, args) {
        var event = args.get_domEvent();
        args.set_cancel(true);
    }
</script>

an unconditional cancelling of the event just for testing purposes.  While this version prevents mouse clicks from triggering the button, the space bar still triggers it.

Am I just missing some big fat clue?
0
Danail Vasilev
Telerik team
answered on 23 Sep 2013, 01:16 PM
Hello Thomas,

I have tried to reproduce the mentioned issue but to no avail. Could you please have a look at the short video in the attached archive and then tell me what I am missing?

Could you also confirm that you are using the latest official version of RadControls - currently this is version 2013.2.717 and if not does upgrading to it resolves the issue?

If the above step, however, is not helpful could you please try to reproduce the issue with the attached VS example and then send it back to us, so that we can make a research locally?

Could you also confirm which is the browser under which you are experiencing the unexpected behavior?

Regards,
Danail Vasilev
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
Tags
Button
Asked by
Michael H
Top achievements
Rank 2
Answers by
Ianko
Telerik team
Michael H
Top achievements
Rank 2
Thomas Yanez
Top achievements
Rank 1
Danail Vasilev
Telerik team
Share this question
or