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

RadColorPicker in a RadGrid

7 Answers 787 Views

ColorPicker

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

alpal111 asked on 02 May 2007, 03:32 PM

Issue 1:

I'm trying to add a radcolorpicker to a grid such that when inserting or updating a row, the color picker will display and it's selected value will show in the "Color" column field.

Using a templates i've added it to the edit column, but it doesn't do anything, can't even select colors, and when compiled and ran I get a javascript error: "Sys" is undefined.

I'm sure I have the basic idea of how to use it wrong. Of course. :)

I have a scriptmanager in place, although I'm not going to speculate on what that does. :)

Any ideas on what I'm missing, or doing wrong?

Issue 2:

protected void RadColorPicker1_ColorChanged(object sender, EventArgs e)  

{  

   Label1.Text = ColorTranslator.ToHtml(RadColorPicker1.SelectedColor);  

}

When compiling this gives me a compile time Error --
"The name 'RadColorPicker1' does not exist in the current context ..."

How do I ensure it's context?

Al

<radG:RadGrid   

    ID="RadGrid2" runat="server" 

    Height="100px" 

    Width="500px" 

    Title="Rules" 

    BorderStyle="Solid"   

    BorderWidth="1px" 

    DataSourceID="ObjectDataSource1"   

    GridLines="None" 

    AllowAutomaticInserts="True" 

    AllowAutomaticUpdates="True" 

    AutoGenerateColumns="False" 

    MasterTableView-AllowPaging="true" 

    OnDeleteCommand="RadGrid2_DeleteCommand"   

    OnPreRender="RadGrid2_PreRender"   

    OnItemEvent="RadGrid2_ItemEvent"   

    OnItemInserted="RadGrid2_ItemInserted"   

    OnItemUpdated="RadGrid2_ItemUpdated"   

    OnCancelCommand="RadGrid2_CancelCommand"   

    OnDataBound="RadGrid2_DataBound" > 

    <MasterTableView  

        DataKeyNames="idExceptionRule"   

        DataSourceID="ObjectDataSource1" 

        AllowPaging="True" > 

        <ExpandCollapseColumn Visible="False">  

            <HeaderStyle Width="19px" /> 

        </ExpandCollapseColumn> 

        <RowIndicatorColumn Visible="False">  

            <HeaderStyle Width="20px" /> 

        </RowIndicatorColumn> 

        <Columns> 

            <radG:GridBoundColumn DataField="decMin" HeaderText="From" UniqueName="From">  

            </radG:GridBoundColumn> 

            <radG:GridBoundColumn DataField="decMax" HeaderText="To" UniqueName="To">  

            </radG:GridBoundColumn> 

            <radG:GridBoundColumn DataField="hexColourFont" HeaderText="Color" UniqueName="Color">  

                <ItemStyle BackColor="White" BorderColor="#404040" BorderStyle="Solid" BorderWidth="1px" 

                    HorizontalAlign="Left" VerticalAlign="Middle" /> 

            </radG:GridBoundColumn> 

            <radG:GridTemplateColumn DataField="hexColourFont" ShowSortIcon="False" UniqueName="TemplateColumn">  

                <EditItemTemplate> 

                   <telerik:RadColorPicker ID="RadColorPicker1" runat="server" Preset="Web216" 

                        ShowIcon="True" OnDataBinding="RadColorPicker1_ColorChanged" AutoPostBack="True" OnColorChanged="RadColorPicker1_ColorChanged">  

                    </telerik:RadColorPicker> 

                    <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label> 

                </EditItemTemplate> 

            </radG:GridTemplateColumn> 

            <radG:GridEditCommandColumn> 

            </radG:GridEditCommandColumn> 

            <radg:GridButtonColumn CommandName="Delete" Text="Delete" 

               UniqueName= "DeleteColumn" ButtonType="ImageButton" ImageUrl=".\delete.gif" /> 

        </Columns> 

        <EditFormSettings> 

            <EditColumn UniqueName="EditCommandColumn1">  

            </EditColumn> 

        </EditFormSettings> 

    </MasterTableView> 

    <ValidationSettings CommandsToValidate="PerformInsert,Update,Delete" /> 

</radG:RadGrid>

7 Answers, 1 is accepted

answered on 07 May 2007, 08:57 AM

Hi alpal111,

1) "Sys is undefined" error - the web.config is not a ASP.NET AJAX project config file. You need to replace the original config file with a config file, containing all AJAX HttpHandler and HttpModule declarations.

2) You get that error, because the 'RadColorPicker1' is placed in a RadGrid - you should get the same error for the Label1 control. First, you have to find the Row of the RadGrid that is being edited and after that, use the FindControl method to find the controls in it. For example:

    protected void RadColorPicker1_ColorChanged(object sender, EventArgs e)  

    {  

        int index = Int32.Parse(this.RadGrid1.EditIndexes[0]);  

        RadColorPicker cpk = (RadColorPicker)(this.RadGrid1.Items[index]).FindControl("RadColorPicker1");  

        Label1.Text = cpk.SelectedColor.ToString();   

    }

However, this event handler will not be executed and we are aware of this issue. It is on our TODO list we will fix it as soon as possible.

All the best,
Tsvetie
the telerik team

Instantly find answers to your questions at the new Telerik Support Center

answered on 07 May 2007, 03:38 PM

Re Issue 1 - Sys is undefined :
Can i get a quick sample of what to see in the config file? Should I be adding something in the <assemblies></assemblies> node?

<?xml version="1.0"?>  

<!--  

    Note: As an alternative to hand editing this file you can use the   

    web admin tool to configure settings for your application. Use  

    the Website->Asp.Net Configuration option in Visual Studio.  

    A full list of settings and comments can be found in   

    machine.config.comments usually located in   

    \Windows\Microsoft.Net\Framework\v2.x\Config   

--> 

<configuration> 

    <appSettings> 

        <add key="MatrixPath" value="/thresholdingmatrix/"/>  

    </appSettings> 

    <connectionStrings/> 

    <system.web> 

        <!--   

            Set compilation debug="true" to insert debugging   

            symbols into the compiled page. Because this   

            affects performance, set this value to true only   

            during development.  

        --> 

        <compilation debug="true">  

            <assemblies> 

                <add assembly="System.DirectoryServices, Version=2.0.0.0, Culture=neutral, PublicKeyToken=B03F5F7F11D50A3A"/>  

                <add assembly="System.Windows.Forms, Version=2.0.0.0, Culture=neutral, PublicKeyToken=B77A5C561934E089"/>  

                <add assembly="System.Design, Version=2.0.0.0, Culture=neutral, PublicKeyToken=B03F5F7F11D50A3A"/>  

                <add assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/></assemblies> 

        </compilation> 

        <!--  APPLICATION-LEVEL TRACE LOGGING  

          Application-level tracing enables trace log output for every page within an application.   

          Set trace enabled="true" to enable application trace logging.  If pageOutput="true", the  

          trace information will be displayed at the bottom of each page.  Otherwise, you can view the   

          application trace log by browsing the "trace.axd" page from your web application  

          root.   

    --> 

        <trace enabled="true" requestLimit="50" pageOutput="false" traceMode="SortByTime" localOnly="false"/>  

        <!--  

            The <authentication> section enables configuration   

            of the security authentication mode used by   

            ASP.NET to identify an incoming user.   

             userName="************" password="**********" 

        --> 

        <trust level="Full"/>  

        <httpModules> 

            <add name="Session" type="System.Web.SessionState.SessionStateModule"/>  

        </httpModules> 

        <customErrors mode="Off"/>  

        <authentication mode="Windows"/>  

        <identity impersonate="true"/>  

        <!--  

            The <customErrors> section enables configuration   

            of what to do if/when an unhandled error occurs   

            during the execution of a request. Specifically,   

            it enables developers to configure html error pages   

            to be displayed in place of a error stack trace.  

        <customErrors mode="RemoteOnly" defaultRedirect="GenericErrorPage.htm">  

            <error statusCode="403" redirect="NoAccess.htm" /> 

            <error statusCode="404" redirect="FileNotFound.htm" /> 

        </customErrors> 

        --> 

    </system.web> 

</configuration>

And, I hope you get the event handler not firing thing fixed soon.
Thanks,
Al

answered on 07 May 2007, 03:43 PM

In a new Ajax-Enabled Web Site project, (File -> New -> Web Site -> ASP.NET AJAX Enabled Web-Site). VS.NET seems to autogenerate additional stuff in the web.config - for example this is the default web.config I have for this site (it appears that there are additional modules / handlers):

<?xml version="1.0"?> 
<configuration> 
    <configSections> 
        <sectionGroup name="system.web.extensions" type="System.Web.Configuration.SystemWebExtensionsSectionGroup, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"> 
            <sectionGroup name="scripting" type="System.Web.Configuration.ScriptingSectionGroup, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"> 
                <section name="scriptResourceHandler" type="System.Web.Configuration.ScriptingScriptResourceHandlerSection, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" requirePermission="false" allowDefinition="MachineToApplication"/> 
                <sectionGroup name="webServices" type="System.Web.Configuration.ScriptingWebServicesSectionGroup, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"> 
                    <section name="jsonSerialization" type="System.Web.Configuration.ScriptingJsonSerializationSection, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" requirePermission="false" allowDefinition="Everywhere"/> 
                    <section name="profileService" type="System.Web.Configuration.ScriptingProfileServiceSection, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" requirePermission="false" allowDefinition="MachineToApplication"/> 
                    <section name="authenticationService" type="System.Web.Configuration.ScriptingAuthenticationServiceSection, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" requirePermission="false" allowDefinition="MachineToApplication"/> 
                </sectionGroup> 
            </sectionGroup> 
        </sectionGroup> 
    </configSections> 
    <system.web> 
        <pages> 
            <controls> 
                <add tagPrefix="asp" namespace="System.Web.UI" assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/> 
            </controls> 
        </pages> 
        <!-- 
          Set compilation debug="true" to insert debugging 
          symbols into the compiled page. Because this 
          affects performance, set this value to true only 
          during development. 
    --> 
        <compilation debug="true"> 
            <assemblies> 
                <add assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/> 
                <add assembly="System.Design, Version=2.0.0.0, Culture=neutral, PublicKeyToken=B03F5F7F11D50A3A"/></assemblies> 
        </compilation> 
        <httpHandlers> 
            <remove verb="*" path="*.asmx"/> 
            <add verb="*" path="*.asmx" validate="false" type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/> 
            <add verb="*" path="*_AppService.axd" validate="false" type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/> 
            <add verb="GET,HEAD" path="ScriptResource.axd" type="System.Web.Handlers.ScriptResourceHandler, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" validate="false"/> 
        </httpHandlers> 
        <httpModules> 
            <add name="ScriptModule" type="System.Web.Handlers.ScriptModule, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/> 
        </httpModules> 
    </system.web> 
    <system.web.extensions> 
        <scripting> 
            <webServices> 
                <!-- Uncomment this line to customize maxJsonLength and add a custom converter --> 
                <!-- 
      <jsonSerialization maxJsonLength="500"> 
        <converters> 
          <add name="ConvertMe" type="Acme.SubAcme.ConvertMeTypeConverter"/> 
        </converters> 
      </jsonSerialization> 
      --> 
                <!-- Uncomment this line to enable the authentication service. Include requireSSL="true" if appropriate. --> 
                <!--
        <authenticationService enabled="true" requireSSL = "true|false"/>
      --> 
                <!-- Uncomment these lines to enable the profile service. To allow profile properties to be retrieved 
           and modified in ASP.NET AJAX applications, you need to add each property name to the readAccessProperties and 
           writeAccessProperties attributes. --> 
                <!-- 
      <profileService enabled="true" 
                      readAccessProperties="propertyname1,propertyname2" 
                      writeAccessProperties="propertyname1,propertyname2" /> 
      --> 
            </webServices> 
            <!--
      <scriptResourceHandler enableCompression="true" enableCaching="true" />
      --> 
        </scripting> 
    </system.web.extensions> 
    <system.webServer> 
        <validation validateIntegratedModeConfiguration="false"/> 
        <modules> 
            <add name="ScriptModule" preCondition="integratedMode" type="System.Web.Handlers.ScriptModule, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/> 
        </modules> 
        <handlers> 
            <remove name="WebServiceHandlerFactory-Integrated"/> 
            <add name="ScriptHandlerFactory" verb="*" path="*.asmx" preCondition="integratedMode" type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/> 
            <add name="ScriptHandlerFactoryAppServices" verb="*" path="*_AppService.axd" preCondition="integratedMode" type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/> 
            <add name="ScriptResource" preCondition="integratedMode" verb="GET,HEAD" path="ScriptResource.axd" type="System.Web.Handlers.ScriptResourceHandler, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/> 
        </handlers> 
    </system.webServer> 
</configuration> 
 

answered on 10 Jun 2020, 01:30 PM

Hi,

Allow me to clear the misunderstanding. There is no problem in having RadColorPicker control in a GridTemplateColumn. However, when it comes to accessing them programmatically, a specific procedure needs to be followed since it is a different procedure when the Control is outside of the Grid and another one when it is inside. Please review the Accessing Values and Controls article for more information.

For example, there is one Control outside, and there is one inside:

<telerik:RadColorPicker ID="RadColorPicker1" runat="server"></telerik:RadColorPicker>

<telerik:RadGrid ID="RadGrid1" runat="server">
    <MasterTableView>
        <Columns>
            <telerik:GridTemplateColumn>
                <EditItemTemplate>
                    <telerik:RadColorPicker ID="RadColorPicker2" runat="server"></telerik:RadColorPicker>
                </EditItemTemplate>
            </telerik:GridTemplateColumn>
        </Columns>
    </MasterTableView>
</telerik:RadGrid>

Procedure to access the two controls on server-side:

protected void RadButton1_Click(object sender, EventArgs e)
{
    RadColorPicker firstPicker = this.RadColorPicker1;

    // Accessing the ColorPicker of the First Line
    RadColorPicker secondPicker = RadGrid1.Items[0].FindControl("RadColorPicker2") as RadColorPicker;

    // Accessing the ColorPicker in all Grid rows one by one using a Loop
    foreach (GridItem item in RadGrid1.Items)
    {
        RadColorPicker colorPicker = item.FindControl("RadColorPicker2") as RadColorPicker;
    }
}

Regards,
Attila Antal
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.