This is a migrated thread and some comments may be shown as answers.

RadInput & Rad/ComboBox

7 Answers 160 Views
Input
This is a migrated thread and some comments may be shown as answers.
Brian Taylor
Top achievements
Rank 1
Brian Taylor asked on 31 May 2011, 10:55 PM

Hi,
I am using the radinput manager with the "<Validation IsRequired="True" />" property to force certain textboxs to be required.

This works well displaying a warning symbol on the relevant textbox and a red outline if the box is left empty.

My issue is I also have a combobox with a required field validator, but this doesn’t indicate the input has no value selected in the same style as the other textbox controls giving an inconsistent interface.

Could this functionality be added to the standard combobox (obviously only IsRequired functionality) or full functionality if using a RadCombobox as this effectively contains a textbox.

7 Answers, 1 is accepted

Sort by
0
Vasil
Telerik team
answered on 02 Jun 2011, 12:17 PM
Hi Brian,

You could style the input of the RadComboBox to use the same CSS class as the TextBox when is empty. Please check the code-snippets below.

Aspx:
<script type="text/javascript">
 
  var originalClassName = null;
 
  function inputBlured(sender, args) {
    if (!sender.target.value) {
      sender.target.className = "RadInputMgr RadInputMgr_Default RadInput_Error_Default";
    }
  }
 
  function inputFocused(sender, args) {
    if (!sender.target.value) {
      sender.target.className = originalClassName;
    }
  }
 
  function ClientLoad(sender, args) {
    originalClassName = sender.get_inputDomElement().className;
 
    $addHandler(sender.get_inputDomElement(), "blur", inputBlured);
    $addHandler(sender.get_inputDomElement(), "focus", inputFocused);
  }
 
</script>
<telerik:RadComboBox ID="RadComboBox1" runat="server" AllowCustomText="true" OnClientLoad="ClientLoad">
  <Items>
    <telerik:RadComboBoxItem Text="" Value="" />
    <telerik:RadComboBoxItem Text="Item 1" Value="Item1" />
    <telerik:RadComboBoxItem Text="Item 2" Value="Item2" />
  </Items>
</telerik:RadComboBox>
<telerik:RadInputManager runat="server" ID="RadInputManager1">
  <telerik:TextBoxSetting>
  </telerik:TextBoxSetting>
</telerik:RadInputManager>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>

C#:
protected void Page_Init(object sender, EventArgs e)
{
    NumericTextBoxSetting numericSetting = new NumericTextBoxSetting();
    numericSetting.Validation.IsRequired = true;
    numericSetting.TargetControls.Add(new TargetInput(TextBox1.ID, true));
    RadInputManager1.InputSettings.Add(numericSetting);
}

I hope this helps.

Greetings,
Vasil
the Telerik team

Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

0
Milind
Top achievements
Rank 1
answered on 04 Mar 2016, 02:49 PM

Hello,

 

How can I set the width and height of error box displayed in combobox and make it of same size of combobox ?

 

Regards

Milind

0
Maria Ilieva
Telerik team
answered on 09 Mar 2016, 12:01 PM
Hi Milind,

Can you please elaborate what kind of validation you are using and what is the exact scenario you are implementing so that we can further help in this case?

Regards,
Maria Ilieva
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
0
Milind
Top achievements
Rank 1
answered on 09 Mar 2016, 03:07 PM

Hi Maria,

 

There is inconsistency in displaying the validation error box. Pls find attached document which contains the image and explains the scenario

When we build responsive sites the size of control varies as per the device resolution. In such case the consistency should be maintained. the solution should be a full fledged solution. 

Thanks

 

Milind

0
Maria Ilieva
Telerik team
answered on 14 Mar 2016, 10:03 AM
Hello,

Can you please share your code to see how exactly the validation for the ComboBox is performed sop that we can further assists?

Regards,
Maria Ilieva
Telerik
Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
0
Milind
Top achievements
Rank 1
answered on 14 Mar 2016, 10:20 AM

Hi Maria,

 

Following is the code

ASPX : 

 

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="ErpWebApplication.WebForm1" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <script type="text/javascript">

            var originalClassName = null;

            function inputBlured(sender, args) {
                if (!sender.target.value) {
                    sender.target.className = "RadInputMgr RadInputMgr_Default RadInput_Error_Default";
                }
            }

            function inputFocused(sender, args) {
                if (!sender.target.value) {
                    sender.target.className = originalClassName;
                }
            }

            function ClientLoad(sender, args) {
                originalClassName = sender.get_inputDomElement().className;

                $addHandler(sender.get_inputDomElement(), "blur", inputBlured);
                $addHandler(sender.get_inputDomElement(), "focus", inputFocused);
            }

        </script>

    </head>
    <body>
        <form id="form1" runat="server">
            <telerik:RadInputManager runat="server" ID="RadInputManager1">
                <telerik:TextBoxSetting>
                </telerik:TextBoxSetting>
            </telerik:RadInputManager>

            <div>
                <asp:ScriptManager ID="ScriptManagerProxy1" runat="server">
                </asp:ScriptManager>
                <table style="width:100%">
                    <tr>
                        <td style="width:50%">
                            <telerik:RadComboBox ID="RadComboBox1" runat="server" AllowCustomText="true" OnClientLoad="ClientLoad" Width="100%">
                                <Items>
                                    <telerik:RadComboBoxItem Text="" Value="" />
                                    <telerik:RadComboBoxItem Text="Item 1" Value="Item1" />
                                    <telerik:RadComboBoxItem Text="Item 2" Value="Item2" />
                                </Items>
                            </telerik:RadComboBox>
                        </td>
                        <td  style="width:50%">
                            <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
                        </td>
                    </tr>
                </table>
            </div>
        </form>
    </body>
</html>

ASPX.CS

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using Telerik.Web.UI;

namespace ErpWebApplication
{
    public partial class WebForm1 : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {

        }

        protected void Page_Init(object sender, EventArgs e)
        {
            NumericTextBoxSetting numericSetting = new NumericTextBoxSetting();
            numericSetting.Validation.IsRequired = true;
            numericSetting.TargetControls.Add(new TargetInput(TextBox1.ID, true));
            RadInputManager1.InputSettings.Add(numericSetting);
        }
    }
}

 

Thanks

 

Milind

0
Maria Ilieva
Telerik team
answered on 17 Mar 2016, 01:52 PM
Hello,

Try setting the css class below:
<style>
        .RadInputMgr {
 
            width:100%;
        }
         
    </style>
 and see how it goes.

Regards,
Maria Ilieva
Telerik
Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
Tags
Input
Asked by
Brian Taylor
Top achievements
Rank 1
Answers by
Vasil
Telerik team
Milind
Top achievements
Rank 1
Maria Ilieva
Telerik team
Share this question
or