combobox: change font of text entered by user

2 posts, 0 answers
  1. Samer
    Samer avatar
    1 posts
    Member since:
    Nov 2011

    Posted 19 Nov 2012 Link to this post

    Hi,

    When the user writes text in the combobox, I need to check the inputted text against entries in the database and if the text is not found, I need to place a red wavy underline under the text as an indicator for the user that the inputted text is not correct. The red wavy underline I need is the exact one that is placed by the spellcheck. I am facing 2 problems:
    - I am unable to figure out how to change the font of the text from the code behind. I tried looking through the properties of the combobox.Text but couldn't find anything.. I also tried combobox.underline = true but that did not result in any change on the webpage!
    - Is it possible to place a red wavy underline or we can only place a regular straight line? If this is possible, how?

    Any help much appreciated.

    Thanks,
    Samer
  2. Kalina
    Admin
    Kalina avatar
    918 posts

    Posted 06 Dec 2012 Link to this post

    Hi Samer,

    I am afraid that underlining or changing the font of the RadComboBox text from code-behind is not an officially supported scenario.

    However you can try achieving this with some custom logic.
    For example, you can create small jpg image with an underline define it in a css style. Then you can add this style to RadComboBox from code behind if the text entered in control is not valid:
    <head runat="server">
        <title></title>
         <style type="text/css">
                
            .notValid
            {
                color: blue !important;
                background-image: url('underline.jpg') !important;
            }
        </style>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
            <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <telerik:RadComboBox ID="RadComboBox1"
            runat="server" AllowCustomText="true" AutoPostBack="true"
        </telerik:RadComboBox>
        </div>
        </form>
    </body>

    protected void Page_Load(object sender, EventArgs e)
    {
     
        PopulateSomeData();
     
        if (IsPostBack)
        {
            RadComboBoxItem item = this.RadComboBox1.FindItemByText(this.RadComboBox1.Text);
            if (item == null)
                this.RadComboBox1.InputCssClass = "notValid";
        }
    }
    protected void PopulateSomeData()
    {
        this.RadComboBox1.Items.Add(new RadComboBoxItem("apple"));
        this.RadComboBox1.Items.Add(new RadComboBoxItem("orange"));
        this.RadComboBox1.Items.Add(new RadComboBoxItem("banana"));
    }

    Please find more details in the sample attached.
    The sample is very basic, but I believe that it will help you easily implement the approach on your page.

    All the best,
    Kalina
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Back to Top