Increment server event

[Elliott]

I have a web page with a RadNumericTextBox on it
it needs to implement the following functionality
if the user types in a number it  waits for the user to click a button to fill a grid
if the user increments the box using the mouse wheel or arrow keys it fills a grid with the value of the textbox as a parameter

please advise

[Elliott]

Telerik made this so easy - I already had a client-side key press event

one question - can I style the spin buttons in any way?  the CSS class seems to be a read-only property

<telerik:RadNumericTextBox ID="rntbPage" MinValue="1" MaxValue="9999" MaxLength="4" ShowSpinButtons="True" AutoPostBack="true" Font-Names="Verdana" Font-Size="X-Small" Height="22px" Width="72px" runat="server" >
    <NumberFormat DecimalDigits="0" GroupSeparator="" />
    <ClientEvents OnKeyPress="OnKeyPress" />
    <ClientEvents OnValueChanged="OnValueChanged" />
</telerik:RadNumericTextBox>

// do not allow entry of comma or dot in textboxes
function OnKeyPress(sender, args) {
    dont_rebuild_grid = true;
    var uniCode = args.get_keyCode();
    if (uniCode > 43 & uniCode < 47) {
        args.set_cancel(true);
    }
}

var dont_rebuild_grid = false;
function OnValueChanged(sender, args) {
    if (dont_rebuild_grid) {
        args.set_cancel(true);
    }
}

Protected Sub rntbPage_TextChanged(sender As Object, e As System.EventArgs) Handles rntbPage.TextChanged
    OnePageOfItems()
End Sub

[Elliott]

I am never going to learn how to program if Telerik keeps making things so easy.....

to style the spin buttons, first put a skin on the textbox (counter-intuitive) i.e. Skin="Hay"
then override the spin buttons for that skin in the CSS

.radInput_Hay a.spinbutton
{
   font-size:larger !important;
   font-weight:bolder !important;
}

[Maria Ilieva]

Hi Marianne,

Thank you for sharing you experience with our controls and posting your opinion. Do not hesitate to write back in case any issues with any of our components appear.

All the best,
Maria Ilieva
the Telerik team

[Elliott]

I'm finding clicking the arrows triggers the event but the mouse wheel only changes the value in the textbox
is there a way to make moving the mouse wheel trigger the client-side ValueChanged as well as the server-side TextChanged events?

[Maria Ilieva]

Hi Marianne,

Note that the client ValueChanged and the server TextChanged event fire in case the text is submitted after blurring the control or pressing Enter key. The same behavior is applicable for the MouseWheel. In case the value is increment with the mouse wheel you need to blur the input and the mentioned events will fire

Greetings,
Maria Ilieva
the Telerik team

[Elliott]

I found I had to add a client event on the button - the paging was becoming disabled if something was entered into the textbox

[Maria Ilieva]

Hi Marianne,

Thank you for updating us on this issue. I'm glad to hear you have found appropriate solution for your case.

Regards,
Maria Ilieva
the Telerik team

[moegal]

I would like the mouse wheel changes to trigger a change in the OnValueChanged.  How can I capture the wheelmouse and blur the test box so it fires the event?

Also, on keypress too.

I would think that by now this should be built into the control? Right?

Marty

[Shinu]

Hi moegal,

Please have a look into the sample code snippet to attach the onmousewheel , onkeypress and OnBlur event to RadNumericTextBox.

ASPX:

<telerik:RadNumericTextBox ID="RadTextBox1" runat="server" ClientEvents-OnBlur="OnBlur"
    onkeypress="KeyPress();" onmousewheel="MouseWheel();">
</telerik:RadNumericTextBox>

JavaScript:

<script type="text/javascript">
    function OnBlur(sender, args) {
        alert("OnBlur");
        //your code
    }
    function KeyPress() {
        alert("KeyPress");
        //your code
    }
    function MouseWheel() {
        alert("MouseWheel");
        //your code
    }
</script>

Let me know if you have any concern.
Thanks,
Shinu.

[moegal]

Shinu,

thanks.  How do I get the sender on any of these?

I am using a repeater and a master page or 2. 

do I need to do something like this?  kludgy?

onmousewheel='<%# string.Format("MouseWheel({0});", Eval("myid").ToString()) %>'

Marty

[Shinu]

Hi moegal,

Please try the following code snippet to achieve your scenario.

ASPX:

...
<telerik:RadTextBox ID="RadTextBox1" runat="server" onmousewheel="MouseWheel(this);"             Text='<%# DataBinder.Eval(Container.DataItem, "FileName").ToString() %>'>
 </telerik:RadTextBox>
...

JavaScript:

function MouseWheel(id) {
    var sender = id;
    //your code
}

Thanks,
Shinu.

[moegal]

Still not working the way I would expect.

onkeypress='<%# string.Format("KeyPress(\"{0}\");", ((RepeaterItem)Container).FindControl("qty").ClientID) %>'
                                onmousewheel='<%# string.Format("MouseWheel(\"{0}\");", ((RepeaterItem)Container).FindControl("qty").ClientID) %>'
                                onkeydown='<%# string.Format("return (event.keyCode != 13);KeyDown(\"{0}\");", ((RepeaterItem)Container).FindControl("qty").ClientID) %>'

I had to block the enterkey because it was posting the page. Any way to stop the page from post back but still do my js code?  I cannot get it to work.

Marty

[Shinu]

Hi moegal,

Please try the following code snippet to achieve your scenario.

ASPX:

<telerik:RadTextBox ID="RadTextBox1" runat="server" onmousewheel="MouseWheel(this);" onkeypress="KeyPress(event,this);" Text=' <%# DataBinder.Eval(Container.DataItem, "FileName").ToString() %>'>
</telerik:RadTextBox>

JavaScript:

function KeyPress(key,id) {
    if (key.keyCode == 13)
        key.preventDefault();
}

Thanks,
Shinu.

[moegal]

Shinu,

thanks but it still seems to post the page.  My RadNumericTextBox and RadButton are in a Repeater and it seems that the event for RadButtonAdd_Click is getting fired when I hit enter while my focus is in the RadNumericTextBox .

Any way to prevent that?

Marty

[moegal]

seems adding UseSubmitBehavior="false" to the RadButton did the trick.

Thanks, Marty