Mouse cursor on RadMultiColumnComboBox

1 Answer 38 Views
MultiColumnComboBox
Hampden Tech
Top achievements
Rank 1
Hampden Tech asked on 02 Aug 2022, 02:38 PM

I noticed in the RadMultiColumnComboBox that the cursor appears to be a text-insertion/editing cursor instead of an arrow. I'm using this to allow the user to select an item so the text cursor is unintuitive. Is there a way to set the style of the mouse cursor on this control?


   
<telerik:RadMultiColumnComboBox runat="server" ID="radMultiComboPhrases" DropDownWidth="200px" Height="400px" AutoPostBack="true" Placeholder="Select a phrase..." DataTextField="sBrief" DataValueField="sPhrase" RenderMode="Mobile">
     <ColumnsCollection>
        <telerik:MultiColumnComboBoxColumn Field="sBrief" Title="Brief Desc." Width="200px"></telerik:MultiColumnComboBoxColumn>
        <telerik:MultiColumnComboBoxColumn Field="sPhrase" Title="Phrase" Width="200px"></telerik:MultiColumnComboBoxColumn>
     </ColumnsCollection>
</telerik:RadMultiColumnComboBox>

1 Answer, 1 is accepted

Sort by
0
Rumen
Telerik team
answered on 04 Aug 2022, 12:35 PM

Hi Robert,

You can override the built-in cursor using the following CSS class:

.k-input {
    cursor: default;
}

or 

.RadMultiColumnComboBox {
    cursor: default;
}

 

Regards,
Rumen
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Hampden Tech
Top achievements
Rank 1
commented on 04 Aug 2022, 12:58 PM

Okay, thanks for the reply Rumen.

I tried this, and I did notice that in general the mouse cursor is a pointer, but when I'm over the text, I get the text insertion/selection cursor.

This is actually not a big deal for me though, because this app is targeted for tablets, so there's no mouse anyway.

 

Thanks.

Rumen
Telerik team
commented on 04 Aug 2022, 03:19 PM

Have you tried to apply the CSS classes I provided?

Here is an example from the live demos how you can directly change the cursor there:

 
Hampden Tech
Top achievements
Rank 1
commented on 04 Aug 2022, 06:46 PM

I checked out the live demo and your example exhibits the same behavior. The cursor is a pointer unless you are over text in which case it becomes the text insertion/selection pointer. I guess this makes sense if you want to select some of the text for copying/pasting, but it's not very intuitive.

However, the application in question is designed for mobile devices such as tablets and smartphones, so there is no mouse anyway. It really doesn't matter in this case.

 

Thanks for your help.

 

Rumen
Telerik team
commented on 05 Aug 2022, 11:38 AM

Hi Robert,

Since the screenshot tool did not capture the cursor and you were unable to see that the cursor was changed to a pointer icon when I manually set the CSS cursor setting to default, I created and attached a video demonstrating the proposed solution.

Here is the CSS class I used in the video solution:

    <style>
        .k-select, .k-input {
            cursor: default !important;
        }
    </style>

Hampden Tech
Top achievements
Rank 1
commented on 05 Aug 2022, 02:32 PM

I watched your demo. If you notice, when over the grid area of the combo box, the mouse cursor changes to a text/insertion cursor.

 

Rumen
Telerik team
commented on 08 Aug 2022, 09:00 AM

The paragraph beneath the multicolumncombobox control is actually a standard asp:Panel:

You can change the cursor shape for the asp:Panel with the following CSS class:

    <style>
        .k-select, .k-input, #result {
            cursor: default !important;
        }
    </style>

 

Best regards,

Rumen

Tags
MultiColumnComboBox
Asked by
Hampden Tech
Top achievements
Rank 1
Answers by
Rumen
Telerik team
Share this question
or