Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Gavin Lyons 13 posts 71 karma points
    Jul 16, 2013 @ 10:43
    Gavin Lyons
    0

    RadioButtonList with Edit Items with Multiline or RichTextEditor

    Hi,

    I'm extending the Contour Fieldtype for a quiz/training module. I've manage to create all things I need. The control I wish to make is a list of items to be put in the right order. So I using the RadioButtonList

    However the 'Edit Items' for a RadioButtonList/CheckBoxList in the backend in Umbraco, I would like override the textboxes with Multiline textboxes or even RichTextEditor so I can use images. 

    The 'WebControl Editor' has no effect when I override. Is there another way ? 

     

        public class OrderList : Umbraco.Forms.Core.Providers.FieldTypes.RadioButtonList

        {

       public override WebControl Editor

            {

                get

                {

                    if (Value.Count > 0)

                        txt.Text = Value[0].ToString();

     

     

                    txt.Culture = Culture;

                    txt.CheckSpellingCaption = CheckSpellingCaption;

                    txt.LoadingCaption = LoadingCaption;

                    txt.NoMistakesCaption = NoMistakesCaption;

     

                    return txt;

                }

                set { base.Editor = value; }

            }

          public override string RenderPreviewWithPrevalues(List<object> prevalues)

            {

     

                string o = string.Empty;

                int i = 1;

                foreach (var item in prevalues)

                {

                    o += @"<div style=""width:150px;height:150px;border:1px solid #d0d0d0;text-align:center;float:left;margin:5px;display:block;font-size: 80px;line-height: 140px;cursor:move;"">" + i.ToString() + "</div>";

     

                    i++;

                }

     

     

                return o + @"<div style=""clear:both""></div>";

            }

  • Comment author was deleted

    Jul 17, 2013 @ 11:05

    Hey Gavin,

    You are probably using the razor macro that doesn't make use of the webcontrol, for an example of a razor only fieldtype check out this thread

    http://our.umbraco.org/forum/umbraco-pro/contour/40417-Creating-custom-FieldType-with-multiple-SingleLine-textboxes

  • Comment author was deleted

    Jul 17, 2013 @ 11:06

    You might also be able to do this by just customizing the views for details on that check

    http://our.umbraco.org/projects/umbraco-pro/contour/documentation/Developer/Custom-Markup/

     

  • Gavin Lyons 13 posts 71 karma points
    Jul 23, 2013 @ 18:27
    Gavin Lyons
    0

    Hi Tim,

    I would like to have a RichTextEditor for the Prevalues in the backend. I've extended the TextBox class, I've try Tinymce control and HtmlEditorExtender (which I got a bit further) however the HTML content won't save when I save the form in Contour.

     

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using AjaxControlToolkit;
    using AjaxControlToolkit.Sanitizer;
    using System.Web.UI.WebControls;
    
    namespace Application.Web.FieldSetting
    {
        /// 
        /// http://our.umbraco.org/forum/umbraco-pro/contour/12375-How-to-create-a-new-FieldSettingType
        /// 
        public class RichTextEditor :  Umbraco.Forms.Core.FieldSetting.TextArea
        {
            public Guid ObjectGuid { get; set; }
          // public umbraco.editorControls.tinyMCE3.webcontrol.TinyMCEWebControl tinymce = new umbraco.editorControls.tinyMCE3.webcontrol.TinyMCEWebControl();
    
    
            private TextBox tb = new TextBox();
    
            public RichTextEditor()
            {
                ObjectGuid = new Guid("a2cb7830-f571-4787-9638-bc48539a0efb");
                //tinymce.SkinID = "umbraco";
            }
    
            /*
            public override string Value
            {
                get
                {
                    return tinymce.Text;
                }
                set
                {
                    tinymce.Text = value;
                }
            }
            */
    
            public override string Value
            {
                get
                {
                    return tb.Text;
                }
                set
                {
                    tb.Text = value;
                }
            }
    
            public override System.Web.UI.WebControls.WebControl RenderControl(Umbraco.Forms.Core.Attributes.Setting sender, Umbraco.Forms.Core.Form form)
            {
             /*
                tinymce.ID = sender.GetName();            
                tinymce.CssClass = "tinymceContainer";
                tinymce.Visible = true;       
                ///umbraco_client/tinymce3/themes/umbraco/skins/umbraco/ui.css
    
                if (string.IsNullOrEmpty(tinymce.Text) && Prevalues.Count > 0)
                    tinymce.Text = Prevalues[0];
                  return tinymce;
                */
    
    
                tb.ID = sender.GetName();
                tb.TextMode = TextBoxMode.MultiLine;
                tb.Width = 600;
                tb.Height = 200;
              //  tb.CssClass = "guiInputText guiInputStandardSize";
    
    
                if (string.IsNullOrEmpty(tb.Text) && Prevalues.Count > 0)
                    tb.Text = Prevalues[0];
    
    
                HtmlEditorExtender htmlEditorExtender = new HtmlEditorExtender();           
                htmlEditorExtender.ID = "htmlextender_" + sender.GetName();
                htmlEditorExtender.TargetControlID = sender.GetName();
    
                WebControl webctrl = new WebControl(System.Web.UI.HtmlTextWriterTag.Div);
                webctrl.Controls.Add(tb);
                webctrl.Controls.Add(htmlEditorExtender);
                return webctrl;
            }
        }
    }

    Field in the form part for a four questions ( Images/Text etc..., the user need to decide with image to choose etc...

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using Umbraco.Forms.Core;
    using System.Web.UI.WebControls;
    using System.IO;
    using System.Text;
    using umbraco.editorControls;
    using umb = umbraco;
    namespace Application.Web.FieldType
    {
        public class FourQuestions : Umbraco.Forms.Core.FieldType
        {
    
            public List

  • Comment author was deleted

    Jul 31, 2013 @ 13:14

    Ok mind sharing the code on github or as a zip as this won't work :)

  • Gavin Lyons 13 posts 71 karma points
    Aug 12, 2013 @ 09:55
    Gavin Lyons
    0

    Hi Tim,

    Thank you for answering me back.  I couldn't get the TinyMce Umbraco control  to render properly for a FieldType.

    So I used the HTMLEditrorExtender from the AjaxToolKit with the standard TextArea control. It renders in correct in Contour however it won't save or load values into the HTMLExtended TextArea.

    I've put the code classes on GitHub - https://github.com/glyons/ContourRichTextArea

    What I need is a way to have HTML in Prevalues via a FieldType, however Umbraco strips out HTML code. Probably via AntiXSS module, even tried .NET 4.5 and setting the TextArea to  System.Web.UI.ValidateRequestMode.Disabled. This makes no differences.

    Any ideas ?

    Thanks again,

    Gavin

     

     

     

  • Craig Cronin 304 posts 503 karma points
    Mar 07, 2014 @ 12:57
    Craig Cronin
    0

    Hi Gavin,

    I'm just looking at building a couple of new field types for contour with a view of removing our current corporate system, did you resolve this issue?

Please Sign in or register to post replies

Write your reply to:

Draft