Creating custom emoticons dropdown with toolsfile.xml

[Jason Rodman]

I have found your examples on how to create a custom emoticons dropdown, but these examples use inline tool declarations. Currently I use a toolsfile.xml so I can have several configuration of my editor, so I need to find a way to do the same thing using a toolsfile. Is this possible?

[Rumen]

Hi Jason,

You should use the following syntax in order to declare a custom dropdown in the toolsfile.xml file:

    <tool name="Emoticons" Name="Emoticons" Text="Emoticons" type="dropdown"  ItemsPerRow="3" PopupWidth="90" PopupHeight="90">
      <item  name="&lt;img src='./Emoticons/smil1.gif' />"  value="./Emoticons/smil1.gif"  />
      <item  name="&lt;img src='./Emoticons/smil2.gif' />" value="./Emoticons/smil2.gif" />
      <item  name="&lt;img src='./Emoticons/smil3.gif' />" value="./Emoticons/smil3.gif" />
      <item  name="&lt;img src='./Emoticons/smil4.gif' />" value="./Emoticons/smil4.gif" />
      <item  name="&lt;img src='./Emoticons/smil8.gif' />" value="./Emoticons/smil8.gif" />
      <item  name="&lt;img src='./Emoticons/smil6.gif' />" value="./Emoticons/smil6.gif" />
      <item  name="&lt;img src='./Emoticons/smil7.gif' />" value="./Emoticons/smil7.gif" />
      <item  name="&lt;img src='./Emoticons/smil9.gif' />" value="./Emoticons/smil9.gif" />
      <item  name="&lt;img src='./Emoticons/smil11.gif' />" value="./Emoticons/smil11.gif" />
    </tool>

Please, see the following forum thread for more information: http://www.telerik.com/community/forums/aspnet-ajax/editor/editor-in-a-master-page-not-working.aspx.

Best regards,
Rumen
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Dan Ehrmann]

Is there a way to create the emoticons tool as a button (with a nice icon) instead of a dropdown?  I know I can create a custom dialog, but I would rather see it work like the dropdown version.

[Rumen]

Hi Dan,

For your convenience I created a page that demonstrates how to create a dropdown that has an image in the header rather than text.  Of course, you need to put an image to be loaded through css at the right location.

The example is attached.

Best regards,
Rumen
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Andrew Dixon]

Hi,

I've tried using the sample provided, but the width of the "button" is too wide and I see several copies of the background image repeated.  I've played around with the css and I can't make the button any narrower.  Is there an updated version of this example that works properly with the latest version of RadEditor?

I am currently using the SplitButton method of setting up emoticons, but I don't like the way the splitbutton works and would much prefer a simple button.

Thanks
Andrew

[Rumen]

Hi Andrew,

I was able to render the dropdown of the latest editor Q1 2010 SP2 (version 2010.1.519) as a button by applying the following class:

<style type="text/css">                        
    .Emoticons span
    {
        display: block;
        background-image:url(Emoticons/smil11.gif);
        background-repeat : no-repeat;
        background-position: 0 3px;                 
        width: 20px !important;
        height: 23px;                        
    }            
</style>

For your convenience I have attached my project.


All the best,
Rumen
the Telerik team

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 Public Issue Tracking system and vote to affect the priority of the items.

[Andrew Dixon]

Thanks Rumen, much appreciated.

Kind regards
Andrew Dixon

[Parth]

HI,
I have Issue with RadEditor And Emoticons used togeather in Chrome.
I Have Implemented One FeedPost functionality where User Can Add Emotions and Other Text and post there comments.
Now The issue is When I Open Emoticons Button (Image) added with the Help of XML,And whatever operation related to Postback is performed by me causes "Chrome get stuck to that point only", NO further Process is possible without Refreshing the page.

The issue is only with Chrome not with any other browser.
I think it is telerik related issue.

Please find attachment of my code.


Here is my ASPX Page :

 <asp:UpdatePanel ID="updRad" runat="server" UpdateMode="Conditional">
        <ContentTemplate>
            <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" UpdatePanelsRenderMode="Inline">
                <AjaxSettings>
                    <telerik:AjaxSetting AjaxControlID="RadMaskedTextBox1">
                        <UpdatedControls>
                            <telerik:AjaxUpdatedControl ControlID="RadDropDownTree1" />
                        </UpdatedControls>
                    </telerik:AjaxSetting>
                </AjaxSettings>
            </telerik:RadAjaxManager>
            <div class="controlHolder">
                <telerik:RadDropDownTree ID="RadDropDownTree1" AccessKey="P" runat="server" Width="300px"
                    OnNodeDataBound="RadDropDownTree1_NodeDataBound" CheckBoxes="CheckChildNodes"
                    BackColor="Black" Font-Names="Arial" Skin="Glow">
                    <DropDownSettings />
                </telerik:RadDropDownTree>
            </div>
            <div id="container">
                <telerik:RadEditor runat="server" EnableTheming="False" ID="RadEditor1" Height="125px"
                    StripFormattingOnPaste="All" StripFormattingOptions="All" Autotootipify="false"
                    ToolsFile="~/Emoticons/EmoticonsToolsFile.xml" OnClientCommandExecuting="OnClientCommandExecuting"
                    OnClientLoad="OnClientLoad" EditModes="Design" BorderColor="#D68B11" Style="border-bottom: none;"
                    ContentAreaMode="Div" ToolsWidth="140px">
                    <ContextMenus>
                        <telerik:EditorContextMenu TagName="BODY">
                            <telerik:EditorTool Name="Cut" />
                            <telerik:EditorTool Name="Copy" />
                            <telerik:EditorTool Name="Paste" />
                        </telerik:EditorContextMenu>
                    </ContextMenus>
                    <Tools>
                        <telerik:EditorToolGroup DockingZone="Module">
                            <telerik:EditorDropDown Name="DropDownTree" Width="300px" />
                        </telerik:EditorToolGroup>
                    </Tools>
                </telerik:RadEditor>
            </div>
            <table width="100%" cellpadding="0" cellspacing="0" class="posttag" style="border: 1px solid #d68b11;
                border-top: none;">
                <tr id="trPostTagDetails" runat="server">
                    <td colspan="3" width="100%">
                        <asp:DataList Width="100%" ID="dlPostEntity" runat="server" RepeatDirection="Horizontal"
                            RepeatColumns="3" OnItemCommand="dlPostEntity_ItemCommand">
                            <ItemTemplate>
                                <%# Eval("EntityName") %>
                                <span id="spDeleteTag" runat="server">
                                    <asp:ImageButton CommandName="Remove" CommandArgument='<%#Eval("EnityUniqueID") %>'
                                        ImageUrl="../images/ic_close.png" ID="lnkRemove" runat="server" />
                                </span>
                            </ItemTemplate>
                        </asp:DataList>
                    </td>
                </tr>
            </table>
        </ContentTemplate>
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID="btnPost" EventName="Click" />
            <asp:AsyncPostBackTrigger ControlID="dlPostEntity" EventName="ItemCommand" />
            <asp:AsyncPostBackTrigger ControlID="btnTempTag"  EventName="Click" />
        </Triggers>
    </asp:UpdatePanel>
    <br />
    <table id="Table1" width="100%" cellpadding="3" cellspacing="0" runat="server">
        <tr class="bgOrange">
            <td class="Arial14WhiteBold" align="right" width="15%">
                'Vine Feeds:&nbsp;&nbsp;
            </td>
            <td class="tdRadDropDownTree2">
                <telerik:RadDropDownTree ID="RadDropDownTree2" AccessKey="P" runat="server" Width="568px"
                    OnNodeDataBound="RadDropDownTree2_NodeDataBound" CheckBoxes="CheckChildNodes"
                    BackColor="Black" Font-Names="Arial" Skin="Glow">
                    <DropDownSettings />
                    <HeaderTemplate>
                        <div class="header">
                            <span><a href="javascript:void(0);" onclick="ToggleRadDropdownTreeview('ctl00_ctl00_cp_PageArea_RadDropDownTree2');GetPost(1);return false;">
                                <img src="../Images/vine_refresh.png" alt="refresh" height="30px" width="68px" />
                            </a></span>
                        </div>
                    </HeaderTemplate>
                    <DropDownNodeTemplate>
                        <div class="nodeTemplate">
                            <span>
                                <%# DataBinder.Eval(Container, "Text") %></span></div>
                    </DropDownNodeTemplate>
                </telerik:RadDropDownTree>
            </td>
        </tr>
        <tr>
            <td colspan="2">
                <div style="width: 100%;" id="divPost">
                </div>
                <div class='loading' id="dvLoading">
                    <img src='../images/loading2.gif' /></div>
            </td>
        </tr>
    </table>
    <asp:UpdatePanel ID="upbutton" runat="server">
        <ContentTemplate>
            <asp:HiddenField ID="hdnTagText" runat="server" Value="" />
            <asp:HiddenField ID="hdnEntityID" runat="server" Value="0" />
            <asp:HiddenField ID="hdnEntityName" runat="server" Value="" />
            <asp:HiddenField ID="hdnEntityType" runat="server" Value="" />
            <asp:HiddenField ID="hdnTagType" runat="server" Value="2" />
            <asp:HiddenField ID="hdnPageNumber" runat="server" Value="" />
            <asp:LinkButton ID="btnPost" runat="server" OnClick="btnPost_Click"></asp:LinkButton>
            <asp:LinkButton ID="btnTempTag" runat="server" OnClick="btnTempTag_Click"></asp:LinkButton>
            
            <asp:HiddenField ID="hdnIsAnonymous" runat="server" Value="0" />
        </ContentTemplate>
    </asp:UpdatePanel>

Relevant Script:
 function ReloadPage() {
            var start = /@/ig;
            var word = /@(\w+)/ig;
            var radeditor = "#ctl00_ctl00_cp_PageArea_RadEditor1_contentDiv";

            $(radeditor).live("keyup", function () {
                var content = $(this).text();
                var go = content.match(start);
                var name = content.match(word);
                var dataString = 'searchword=' + name;
                if (go != null && go.length > 0) {
                    if (name != null && name[0].length > 0) {
                        searchText(name);
                    }
                }
            });

            $("#dvLoading").hide();
            $(".Anonymous").css("background-image", "url(../Images/anonymous.png)");
            GetPost(1);

            $(window).scroll(function () {
                var s = $(window).scrollTop(),
                        d = $(document).height(),
                        c = $(window).height();
                scrollPercent = (s / (d - c)) * 100;
                scrollTop = $(window).scrollTop();
                if (scrollPercent > 99) {
                    if (NoMoreRecord == 0) {
                        GetMorePost();
                    }
                }
            });
        }

    function OnClientCommandExecuting(editor, args) {
            var name = args.get_name(); //The command name
            var val = args.get_value(); //The tool that initiated the command


            if (name == "Emoticons" || name == "Emoticons2") {
                //Set the background image to the head of the tool depending on the selected toolstrip item
                var tool = args.get_tool();
                var span = tool.get_element().getElementsByTagName("SPAN")[0];
                span.style.backgroundImage = "url(" + val + ")";
                //Paste the selected in the dropdown emoticon   
                editor.pasteHtml("<img src='" + val + "'>");
                //Cancel the further execution of the command
                args.set_cancel(true);
            }

            if (name == "Anonymous" || name == "lbl1" || name == "Anonymous1" || name == "Anonymous2") {

                var bhdnIsAnonymous = $('#<%=hdnIsAnonymous.ClientID%>').val();

                if (bhdnIsAnonymous == "0") {
                    $('#<%=hdnIsAnonymous.ClientID%>').val("1");
                    $(".Anonymous").css("background-image", "url(../Images/anonymous_h.png)");
                }
                else {
                    $('#<%=hdnIsAnonymous.ClientID%>').val("0");
                    $(".Anonymous").css("background-image", "url(../Images/anonymous.png)");
                }


                args.set_cancel(true);
            }

            if (name == "Post") {
                var postbox = $find("<%=RadEditor1.ClientID%>");
                if (postbox._contentArea.innerText == "" || postbox._contentArea.innerText == "undefined") {
                    alert("Please Enter Text to Post");
                    args.set_cancel(true);
                    return false;
                }
                __doPostBack('ctl00$ctl00$cp$PageArea$btnPost', '');

                args.set_cancel(true);
            }
            if (name == "lbl2") {
                args.set_cancel(true);
            }

            if (name == "AddTag") {
                var url = '../Grapevine/popAddTag.aspx';
                if (isIE || isSafari || isChrome) {
                    showPopUp(event, 'dvComments', url, '300', '300', 'yes');
                }
                else {
                    showPopUp(Event, 'dvComments', url, '300', '325', 'yes');
                }
                args.set_cancel(true);
            }
        }

And Code :

   public partial class Home : PageBase
    {
        #region "Properties And Variables"

        /// <summary>
        /// tbl_PostTag
        /// </summary>
        /// <value></value>
        /// <returns></returns>
        /// <remarks></remarks>
        public DataTable tbl_PostTag_Temp
        {
            get { return (DataTable)ViewState["tbl_PostTag_Temp"]; }
            set { ViewState["tbl_PostTag_Temp"] = value; }
        }

       
        #endregion

        #region "Page Load"
        /// <summary>
        /// Page Load Event
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                SessionUtility.EdgeRankFlag = 1;
                RadEditor1.EnsureToolsFileLoaded();
                BindButtons();
                RemoveButton("Cut");
                RemoveButton("Copy");
                RemoveButton("Paste");
                BindRadDropDownTree();
                tbl_PostTag_Temp = new DataTable();
                tbl_PostTag_Temp.Columns.Add("EntityID", typeof(string));
                tbl_PostTag_Temp.Columns.Add("EntityName", typeof(string));
                tbl_PostTag_Temp.Columns.Add("EntityType", typeof(string));
                tbl_PostTag_Temp.Columns.Add("EnityUniqueID", typeof(string));
                tbl_PostTag_Temp.Columns.Add("PostID", typeof(string));
                tbl_PostTag_Temp.Columns.Add("TagType", typeof(string));
                 //'Track Page Visits By User
               PageView_Session.InsertUpdate(SessionUtility.MainID, Lup.Products.Insight.GetHashCode(), SessionUtility.UserId, SessionUtility.TimeZone);
               if(SessionUtility.PageTrackingEnable)
               {
                PageView_Session.InsertPageWiseTracking(SessionUtility.MainID,Lup.Products.Insight.GetHashCode() ,SessionUtility.UserId,SessionUtility.TimeZone,CommonHelper.TrackingPage.GrapeVine_Home.GetHashCode());
               }
            }
        }
        #endregion

        #region "Methods"
        /// <summary>
        /// Button like Post and anonymous bind
        /// </summary>
        private void BindButtons()
        {
            //Anonymous Button
            EditorToolGroup main = default(EditorToolGroup);
            main = new EditorToolGroup();
            main.Attributes.Add("DockingZone", "Module");
            RadEditor1.Tools.Add(main);

            EditorTool lbl1 = default(EditorTool);
            lbl1 = new EditorTool();
            lbl1.Name = "Anonymous2";
            EditorTool lbl2 = default(EditorTool);
            lbl2 = new EditorTool();
            lbl2.Name = "lbl2";
           
            EditorTool btnAnonymous = default(EditorTool);
            
            btnAnonymous = new EditorTool();
            btnAnonymous.Attributes.Add("style", "width:130px !important");
            btnAnonymous.Name = "Anonymous";

            main.Tools.Add(lbl2);
            main.Tools.Add(lbl2);
            main.Tools.Add(lbl2);
            main.Tools.Add(lbl2);
            main.Tools.Add(btnAnonymous);
            main.Tools.Add(lbl1);
            main.Tools.Add(lbl1);
            main.Tools.Add(lbl1);
            
            // Post Button
            EditorToolGroup main2 = default(EditorToolGroup);
            main2 = new EditorToolGroup();
            main2.Attributes.Add("DockingZone", "Module");
            RadEditor1.Tools.Add(main2);

            EditorTool btnPost = default(EditorTool);
            btnPost = new EditorTool();
            btnPost.Attributes.Add("style", "width:130px !important");
            btnPost.Name = "Post";
            main2.Tools.Add(btnPost);
        }

        /// <summary>
        /// Bind Rad Drop Down Tree
        /// </summary>
        private void BindRadDropDownTree()
        {
            DataTable dt = new DataTable();
            MarketClient objClientRegion = new MarketClient();
            objClientRegion.ClientID = SessionUtility.ClientID;

            dt = objClientRegion.GetVineFeed();

            if ((dt.Rows.Count > 0))
            {
                RadDropDownTree1.DataTextField = "Market";
                RadDropDownTree1.DataFieldID = "MarketID";
                RadDropDownTree1.DataFieldParentID = "ParentID";
                RadDropDownTree1.DataValueField = "MarketID";

                RadDropDownTree1.DataSource = dt;
                RadDropDownTree1.DataBind();


                RadDropDownTree2.DataTextField = "Market";
                RadDropDownTree2.DataFieldID = "MarketID";
                RadDropDownTree2.DataFieldParentID = "ParentID";
                RadDropDownTree2.DataValueField = "MarketID";

                RadDropDownTree2.DataSource = dt;
                RadDropDownTree2.DataBind();
            }
        }

        /// <summary>
        /// Bind Temp Tag When Comes From Add Tag Popup
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        protected void btnTempTag_Click(object sender, EventArgs e)
        {
            CreateTempTable();
            BindDatalistForTempTag();
        }

       /// <summary>
        /// Temporary tbl_PostTag_Temp Table Created with EntityId,EntityName And EntityType Fields
        /// </summary>
        public void CreateTempTable()
        {
            DataRow dr;
            dr = tbl_PostTag_Temp.NewRow();
            dr["EntityID"] = hdnEntityID.Value;
            dr["EntityName"] = hdnEntityName.Value;
            dr["EntityType"] = hdnEntityType.Value;
            dr["EnityUniqueID"] = hdnEntityType.Value + hdnEntityID.Value;
            dr["TagType"] = hdnTagType.Value;
            dr["PostID"] = 0;
            tbl_PostTag_Temp.Rows.Add(dr);
        }

        /// <summary>
        /// Post Button Click Event
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        protected void btnPost_Click(object sender, EventArgs e)
        {
            int PostID = 0;
            clsPosts objPosts = new clsPosts();
            clsPostsTag objPostTag = new clsPostsTag();
            objPosts.ActivityType = 0;
            objPosts.PostText = RadEditor1.Content;
            if (hdnIsAnonymous.Value == "1")
            {
                objPosts.BlnAnonymous = true;
            }
            else
            {
                objPosts.BlnAnonymous = false;
            }
            objPosts.Created_UserID = SessionUtility.UserId;
            objPosts.VineFilter = RadDropDownTree1.SelectedValue;
            objPosts.Insert();
            PostID = objPosts.PostID;

            foreach (DataRow dr in tbl_PostTag_Temp.Rows) {
                objPostTag.PostID = PostID;
                objPostTag.EntityID = Convert.ToInt32(dr["EntityID"]);
                objPostTag.EntityType = Convert.ToInt32(dr["EntityType"]);
                objPostTag.TagType = Convert.ToInt32(dr["TagType"]);
                objPostTag.Insert();
            }

            CommonHelper.SendVineNotificationMailToTaggedUser(objPosts.PostID);
            ClearPost();
            ScriptManager.RegisterClientScriptBlock(Page, Page.GetType(), Guid.NewGuid().ToString(), "ReloadPage();", true);
       ///Reload page is not called from here.Database value insertion is happened
        }

        /// <summary>
        /// Clear Post After Button Click
        /// </summary>
        private void ClearPost()
        {
            RadEditor1.Content = "";
            hdnIsAnonymous.Value = "0";
            tbl_PostTag_Temp.Clear();
            BindDatalistForTempTag();
        }

        /// <summary>
        /// Anonymous Button Click Event
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        protected void btnAnonymous_Click(object sender, EventArgs e)
        {

            if (hdnIsAnonymous.Value.ToString() == "0")
            {
                hdnIsAnonymous.Value = "1";
                AddStyleElement("Anonymous", "../Images/anonymous_h.png");
            }
            else
            {
                hdnIsAnonymous.Value = "0";
                AddStyleElement("Anonymous", "../Images/anonymous.png");
            }
        }

        /// <summary>
        /// Add Style Element
        /// </summary>
        /// <param name="name"></param>
        /// <param name="backgroundImageUrl"></param>
        private void AddStyleElement(string name, string backgroundImageUrl)
        {
            HtmlGenericControl style = new HtmlGenericControl();
            style.TagName = "style";
            style.Attributes.Add("type", "text/css");
            style.Attributes.Add("tooltip", "none");
            style.InnerHtml = String.Format(".reTool .{0}{{background-image:url('{1}') !important;width:150px;height:20px;}}", name, backgroundImageUrl);
            Page.Header.Controls.Add(style);
        }

        /// <summary>
        /// Bind TempTag Data list
        /// </summary>
        private void BindDatalistForTempTag()
        {
            DataTable dtSummary = tbl_PostTag_Temp;
            dlPostEntity.DataSource = dtSummary;
            dlPostEntity.DataBind();
        }

        public void RemoveButton(string name)
        {
            foreach (Telerik.Web.UI.EditorToolGroup @group in RadEditor1.Tools)
            {
                EditorTool tool = @group.FindTool(name);
                if ((tool != null))
                {
                    @group.Tools.Remove(tool);
                }
            }
        }


        #endregion

        #region "Control Events"
      
        /// <summary>
        /// Node Data Bound For Rad DropDown Tree
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        protected void RadDropDownTree1_NodeDataBound(object sender, Telerik.Web.UI.DropDownTreeNodeDataBoundEventArguments e)
        {
            e.DropDownTreeNode.Text = Server.HtmlEncode(e.DropDownTreeNode.Text);
           
            if (e.DropDownTreeNode.Level == 0)
                e.DropDownTreeNode.Expanded = true;

                e.DropDownTreeNode.CreateEntry();
        }


        /// <summary>
        /// Node Data Bound For Rad DropDown Tree
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        protected void RadDropDownTree2_NodeDataBound(object sender, Telerik.Web.UI.DropDownTreeNodeDataBoundEventArguments e)
        {
            e.DropDownTreeNode.Text = Server.HtmlEncode(e.DropDownTreeNode.Text);

            if (e.DropDownTreeNode.Level == 0)
                e.DropDownTreeNode.Expanded = true;

            if (e.DropDownTreeNode.Text == "My Community")
            {
                e.DropDownTreeNode.CreateEntry();
            }
        }





        /// <summary>
        /// Post Entity Remove Command Event
        /// </summary>
        /// <param name="source"></param>
        /// <param name="e"></param>
        protected void dlPostEntity_ItemCommand(object source, DataListCommandEventArgs e)
        {
            if (e.CommandName == "Remove")
            {
                string EnityUniqueID = Convert.ToString(e.CommandArgument);
                DataView dv = new DataView(tbl_PostTag_Temp);
                dv.RowFilter = "EnityUniqueID <>'" + EnityUniqueID + "'";
                tbl_PostTag_Temp = dv.ToTable();
                BindDatalistForTempTag();
            }
        }

        #endregion

        /// <summary>
        /// Show All Comment of Group
        /// </summary>
        /// <param name="postId"></param>
        /// <returns></returns>
        [System.Web.Services.WebMethod()]
        public static string GetDataForTag(string SearchText)
        {
            try
            {
                return GetGroupPropertyPeopleData_ForTag(SearchText);
            }
            catch (Exception ex)
            {
                throw ex;
            }
        }

        /// <summary>
        /// Get Data For Group And People
        /// </summary>
        /// <param name="postId"></param>
        /// <param name="showAllComment"></param>
        /// <returns></returns>
        private static string GetGroupPropertyPeopleData_ForTag(string SearchText)
        {
            return SearchText;
        }
    }

[Ianko]

Hi Jason,

It seems to me that the problem is encountered due to an issue with the Ajax requests, although I cannot confirm that because I am unable to investigate the project locally.

In the code it can be observed the use of UpdatePanel with nested RadAjaxManager control on the page. Such mixture and nesting of Ajax controls are leading to many issues with requests and ajaxification and we do not recommend using such configuration. More about this subject can be found in this help article.

I recommend fixing the Ajax configuration and checking if this resolves the issue.

Currently the provided code is not runnable o nmy end, because of the used database. If the problem is still encountered, it would be helpful if you could provide a simple, locally runnable project, which isolates the problem, so that I could be able to investigate it on my end. 

Regards,
Ianko
Telerik

[Parth]

Hey Lanko,

I have took RadAjaxManager outside the Updatepanel.
But still it's causes the same problem.

This issue is only in chrome and comes only when I do Select Smiley options.

Please suggest possible solution for that.

Thanks,
Hope for your quick reply.

[Ianko]

Hello Parth,

Currently I am not able to investigate the provided implementation, could you please get back to me with a locally runnable project, which isolates the problem.

Regards,
Ianko
Telerik