This is a migrated thread and some comments may be shown as answers.
Change border on focus
1 Answer 29 Views
This is a migrated thread and some comments may be shown as answers.
This question is locked. New answers and comments are not allowed.
Duncan
Top achievements
Rank 1
Duncan asked on 24 Aug 2011, 09:33 AM
Hi 

I'm trying to change the border (size and colour) when a combo / drop down list when it receives focus, I have looked at the visual style builder but this is not working very well at all. Does anybody know what css tags I need to override to get this to do what I'm looking for.

Thanks

Duncan

1 Answer, 1 is accepted

Sort by
0
Georgi Krustev
Telerik team
answered on 26 Aug 2011, 12:15 PM
Hello Duncan,

 
You will need to modify CSS class of the DIV element which wraps the visible input element and the button. Here is a code snippet which shows how to wire the focus and blur of the visible input and apply CSS class to the wrapper:

[JavaScript]:

function onComboBoxLoad(e) {
    $console.log('ComboBox loaded');
 
    $(this).closest(".t-combobox")
           .find("input:visible")
           .bind({
                focus: function(e) {
                    $(this).parent().addClass("boldCombo");
                },
                blur: function(e) {
                    $(this).parent().removeClass("boldCombo");
                }
           });
}

[Style]:
.boldCombo
        {
            border-width : 2px;
            border-color : Red;
        }

All the best,
Georgi Krustev
the Telerik team

Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>

Tags
ComboBox
Asked by
Duncan
Top achievements
Rank 1
Answers by
Georgi Krustev
Telerik team
Share this question
or