Reverse behavior of up/down arrows in NumericTextBox on RadGrid

[Chris]

We have a numeric text box on a RadGrid, and the spin buttons are enabled. From a UX standpoint, we want to reverse the functionality of the up/down buttons. We want the up button to move the value lower, as the item is rising up the "rankings" in our list.

The page in question is not accessible, but I've attached a screenshot, and what we're trying to do should be pretty obvious from looking at it. In this shot, I have clicked the up arrow next to Josh Allen's "Rank" four times, with the intention of moving him higher in the list (by higher, I mean "better," as in a top ten list.) But, what it did was raise the value of "Rank" from 6 to 10.

Any idea how we can handle this?

Thanks...

 

Chris Barry

 

[Chris]

Do I need to turn off the spin buttons - and roll my own?  add a column with up down buttons one on top each other and add event handlers to manage the up down?  The master page the grid sits on is embedded in Angular js and I have so far been unable to hit on the css that affects the page - the Skin for the grid is Sunset (THANK YOU for not removing it - like you did Forest) so I've tried html .RadGrid_Sunset .riUp before / .riDown before but no dice - but even reversing the location won't affect the functionality

in case you get confused, there are really 2 Chris's - the real deal and fake Chris, me - I'm his developer - I used to post as Marianne only now my old posts show as Elliott

[Vessy]

Hi Chris,

Setting the IncrementSettings-Step property to a negative value should do the trick:

<telerik:RadNumericTextBox ID="Numeric1" runat="server"  IncrementSettings-Step="-1" ShowSpinButtons="true">
</telerik:RadNumericTextBox>

I hope this helps.

Regards,
Vessy
Progress Telerik

[Greg]

Can you please show me a piece of sample code on how to do this declaratively.  I'm trying to turn off the up/down arrow key behavior in a GridNumericColumn that I create in my CodeBehind.

Thanks.

[Vessy]

Hi Greg,

I am afraid that the IncrementSettings-Step property is not exposed for the default spinner buttons of the NumericColumn edit template. If you want to achieve the behavior previously discussed in this thread, you will need to define a custom Edit Form/Template, containing a RadNumericTextBox control:

https://docs.telerik.com/devtools/aspnet-ajax/controls/grid/data-editing/edit-mode/custom-edit-forms#template

Regards,
Vessy
Progress Telerik