Hi,
I have an EditFormSettings section in my RadGrid control which uses a FormTemplate. The FormTemlate contains multiple of RadTextBox controls and currently the only way to navigate through the controls is using the Tab key. Is there anyway to change the Enter key to behave like the Tab key in edit mode?
i.e. OnClientKeyPressing:
Thank you!
I have an EditFormSettings section in my RadGrid control which uses a FormTemplate. The FormTemlate contains multiple of RadTextBox controls and currently the only way to navigate through the controls is using the Tab key. Is there anyway to change the Enter key to behave like the Tab key in edit mode?
i.e. OnClientKeyPressing:
if
(window.event.keyCode == 13) {
window.event.keyCode = 9;
}
Thank you!
5 Answers, 1 is accepted
0

Shinu
Top achievements
Rank 2
answered on 25 Jun 2013, 04:51 AM
Hi Erena,
Please have a look at the sample code I tried which works as expected.
ASPX:
JavaScript:
Thanks,
Shinu.
Please have a look at the sample code I tried which works as expected.
ASPX:
<
EditFormSettings
EditFormType
=
"Template"
>
<
FormTemplate
>
<
telerik:RadTextBox
ID
=
"RadTextBox1"
runat
=
"server"
onKeyDown
=
"checkEnter()"
>
</
telerik:RadTextBox
>
<
br
/>
<
telerik:RadTextBox
ID
=
"RadTextBox2"
runat
=
"server"
onKeyDown
=
"checkEnter()"
>
</
telerik:RadTextBox
>
<
br
/>
<
telerik:RadTextBox
ID
=
"RadTextBox3"
runat
=
"server"
onKeyDown
=
"checkEnter()"
>
</
telerik:RadTextBox
>
</
FormTemplate
>
</
EditFormSettings
>
JavaScript:
<script type=
"text/javascript"
>
function
checkEnter() {
if
(event.keyCode == 13) {
event.keyCode = 9;
}
}
</script>
Thanks,
Shinu.
0

Erena
Top achievements
Rank 1
answered on 25 Jun 2013, 02:59 PM
Hi Shinu,
That worked like charm, thank you!
That worked like charm, thank you!
0

Marius
Top achievements
Rank 1
answered on 10 Jun 2014, 11:48 AM
That is fine in IE but this does not work in CHROME....any suggestions on getting it to work in CHROME?
0
Hi Marius,
in order to have the functionality working in all browsers you could use jQuery to focus the next input element.
If you have markup similar to the following:
Try using the JavaScript code below to implement the functionality:
Let me know how this approach is working for you.
Regards,
Viktor Tachev
Telerik
in order to have the functionality working in all browsers you could use jQuery to focus the next input element.
If you have markup similar to the following:
<
EditFormSettings
EditFormType
=
"Template"
>
<
FormTemplate
>
<
telerik:RadTextBox
ID
=
"RadTextBox1"
runat
=
"server"
CssClass
=
"tb"
ClientEvents-OnLoad
=
"onClientLoad"
>
</
telerik:RadTextBox
>
<
telerik:RadTextBox
ID
=
"RadTextBox2"
runat
=
"server"
CssClass
=
"tb"
>
</
telerik:RadTextBox
>
<
telerik:RadTextBox
ID
=
"RadTextBox3"
runat
=
"server"
CssClass
=
"tb"
>
</
telerik:RadTextBox
>
</
FormTemplate
>
</
EditFormSettings
>
Try using the JavaScript code below to implement the functionality:
function
onClientLoad(sender, args) {
$telerik.$(
'.tb'
).bind(
'keypress'
,
function
(event) {
if
(event.which === 13) {
event.preventDefault();
$telerik.$(
this
).parent().next().children()[0].focus();
}
});
}
Let me know how this approach is working for you.
Regards,
Viktor Tachev
Telerik
Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.
0

Marius
Top achievements
Rank 1
answered on 10 Oct 2014, 10:37 AM
Hi implemented your suggestion and it worked!
Thank you
Thank you