XAF Web – ASPxTokenBoxPropertyEditor

Have you had this request before? A Token PropertyEditor? One of our students had a client asking for this, so as always, we started by searching the support center and voila, we found an implementation that with minimal changes was up and running in no time.

Let’s take a look at the code:

[PropertyEditor(typeof(string), false)]
   public class ASPxTokenBoxPropertyEditor : ASPxStringPropertyEditor
   {
       private ASPxTokenBox tokenBox;

       public new ASPxTokenBox Editor => (ASPxTokenBox)base.Editor;
       public new ASPxTokenBox InplaceViewModeEditor => (ASPxTokenBox)base.InplaceViewModeEditor;

       public ASPxTokenBoxPropertyEditor(Type objectType, IModelMemberViewItem model) : base(objectType, model)
       {
       }

       protected override WebControl CreateEditModeControlCore()
       {
           tokenBox = new ASPxTokenBox();
           tokenBox.IncrementalFilteringMode = IncrementalFilteringMode.None;
           RenderHelper.SetupASPxWebControl(tokenBox);
           SetupTokenBox(tokenBox);
           tokenBox.TextChanged += new EventHandler(EditValueChangedHandler);

           return tokenBox;
       }

       protected override WebControl CreateViewModeControlCore()
       {
           tokenBox = new ASPxTokenBox();
           tokenBox.ClientEnabled = false;
           SetupTokenBox(tokenBox);
           tokenBox.TokenRemoveButtonStyle.Height = 0;
           tokenBox.TokenRemoveButtonStyle.Width = 0;
           tokenBox.Border.BorderWidth = 0;

           return tokenBox;
       }

       protected virtual void SetupTokenBox(ASPxTokenBox tokenBox)
       {
           tokenBox.ShowDropDownOnFocus = ShowDropDownOnFocusMode.Never;
           tokenBox.TokenStyle.BackColor = System.Drawing.Color.DarkGreen;
           tokenBox.TokenRemoveButtonHoverStyle.BackColor = System.Drawing.Color.DarkGreen;
           tokenBox.Width = new Unit("100%");
       }

       protected override void ReadValueCore()
       {
           base.ReadValueCore();
           string value = (string)PropertyValue;

           if (value != null)
           {
               string[] tokens = value.Split(',', ';');

               foreach (string token in tokens)
               {
                   if (!string.IsNullOrEmpty(token) && !string.IsNullOrWhiteSpace(token))
                       tokenBox.Tokens.Add(token);
               }
           }
       }
   }

As you can see we use ASPxStringPropertyEditor as our base editor and we override the creation of the control so we can instantiate the ASPxTokenBox. 

Pay special attention to the ReadValueCore method where we split our string value and add each one as a separate token.

Here is how it gets saved in the database:

Check source here.

Neat right? See you next time. XAF out!

Posted in XAF

Leave a Reply

Your email address will not be published. Required fields are marked *