1-888-365-2779
+1-888-365-2779
Try Now
More in this section

Forums / General Discussions / Drop down list and check boxes in control designer

Drop down list and check boxes in control designer

12 posts, 0 answered
  1. Charles
    Charles avatar
    21 posts
    Registered:
    07 Jun 2011
    03 Aug 2011
    Link to this post
    Hi

    I need to create a custom designer for one of my controls. It needs to have 1 drop down list and a few check boxes (I know I can use a text box with a boolean value in, but it is at the request of my client).

    Is this possible? I haven't been able to find documentation for it (that or I'm not sure how to phrase what I'm looking for)

    Charles D.
  2. Svetoslav Petsov
    Svetoslav Petsov avatar
    456 posts
    Registered:
    24 Sep 2012
    03 Aug 2011
    Link to this post
    Hi Charles,

    Yes, this is possible. In the template of your  control designer, you can add any controls you want - a DropDownList, as well. You can read more about control designers and how to work with them here:
    http://www.sitefinity.com/40/help/developers-guide/sitefinity-essentials-controls-working-with-control-designers.html

    Regards,
    Svetoslav Petsov
    the Telerik team
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. Charles
    Charles avatar
    21 posts
    Registered:
    07 Jun 2011
    05 Aug 2011
    Link to this post
    Hi

    It took a bit of trial and error, but I got it right!

    Now, How do I pass this value (in the designer) to my control? I might've overlooked that in the documentation.
  4. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    16 Jun 2017
    05 Aug 2011
    Link to this post
    Hi Charles,

    Inside the client component there is a method applyChanges which you can use to set the property of the control you use. This method is called when the changes must be applied to the control. In it you must get an instance of the control and set its properties to the new values in the UI.


    var controlData = this.get_controlData();
    controlData.Title = jQuery("#txtTitle").val();


    Here Title is a property of the control and we set its value to the txtTitle value
    returned by a control from our desginer.


    Greetings,
    Ivan Dimitrov
    the Telerik team
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  5. Charles
    Charles avatar
    21 posts
    Registered:
    07 Jun 2011
    08 Aug 2011
    Link to this post
    Hi

    I know I'm asking silly questions...

    I got everything to work now. Now, is there a way to make the dropdown list read values dynamically?

    This is what my designer template looks like (not working):

    <%@ Control Language="C#" %>
     
    <script>
            protected void Page_Load(object sender, EventArgs e)
            {
                var folderArray = Directory.GetDirectories("~/IntranetDocumentLibrary","*.*",SearchOption.TopDirectoryOnly).ToList();
     
                foreach (var x in folderArray)
                {
                    drpPath.Items.Add(x.ToString());
                }
            }
     
    </script>
     
    <asp:DropDownList ID="drpPath" runat="server">
         
    </asp:DropDownList>

    Any thoughts?
  6. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    16 Jun 2017
    08 Aug 2011
    Link to this post
    Hello Charles,

    You can bind the DropDown on the client, using server side code or service.  You can use RadComboBox control, because there are many samples that you can reuse.

    Greetings,
    Ivan Dimitrov
    the Telerik team
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  7. Charles
    Charles avatar
    21 posts
    Registered:
    07 Jun 2011
    15 Sep 2011
    Link to this post
    Hi

    So, I got everything to work, and it well... It stopped working. I upgraded my project to SF4.2, and now it's not working...

    Let me explain:
    I have a control with a custom designer. On the designer I have 1 dropdown box, 1 textbox, and 6 checkboxes. The dropdown list and textbox workes. The values are passed through. But the checkboxes have changes from passing back a boolean to passing back "checked".

    01.applyChanges: function () {
    02. 
    03.    var controlData = this.get_controlData();
    04. 
    05.    controlData.Other = jQuery("#txtOther").val();
    06.    controlData.libraryPath = jQuery("#drpPath").val();
    07.    controlData.chkpdf = jQuery("#pdf").attr('checked');
    08.    controlData.chkdoc = jQuery("#doc").attr('checked');
    09.    controlData.chkdocx = jQuery("#docx").attr('checked');
    10.    controlData.chkxls = jQuery("#xls").attr('checked');
    11.    controlData.chkxlsx = jQuery("#xlsx").attr('checked');
    12.},

    The code above worked. This is the example I got from the SDK (I think that's where I got it).

    This was not the case with SF4.1 (all SP's)

    What should I do about this?

    Regards

    Charles D.

    ##EDIT##
    I also seem to be getting "validator is undefined":
    http://localhost:4467/Telerik.Web.UI.WebResource.axd?_TSM_HiddenField_=ctl01_TSM&compress=0&_TSM_CombinedScripts_=%3b%3bTelerik.Sitefinity.Resources%3aen%3a7866b8a4-e0a8-4a7b-8304-35960ddd00f2%3a7ee0bb1f
    This is when I change the value of the dropdown list
  8. Svetoslav Petsov
    Svetoslav Petsov avatar
    456 posts
    Registered:
    24 Sep 2012
    16 Sep 2011
    Link to this post
    Hi Charles,

     Which example exactly did you use? If it is an example from the Products module, the module has been majorly changed in 4.2, so you will have to get the example from the new SDK. 
    If that's not the case - please send me your control so I can look for the problem.

    Regards,
    Svetoslav Petsov
    the Telerik team
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  9. Charles
    Charles avatar
    21 posts
    Registered:
    07 Jun 2011
    26 Sep 2011
    Link to this post
    Hi

    The problem is that the designer is passing back the value 'checked' where it used to pass back a boolean value.

    I have attached the output from firebug.

    Here is the code I used:

    DocumentListDesigner.js
    Type.registerNamespace("SitefinityWebApp.common.UserControls.Documents.DocumentListDesigner");
     
    SitefinityWebApp.common.UserControls.Documents.DocumentListDesigner = function (element) {
        SitefinityWebApp.common.UserControls.Documents.DocumentListDesigner.initializeBase(this, [element]);
    }
     
    SitefinityWebApp.common.UserControls.Documents.DocumentListDesigner.prototype = {
        initialize: function () {
            SitefinityWebApp.common.UserControls.Documents.DocumentListDesigner.callBaseMethod(this, 'initialize');
        },
        dispose: function () {
            SitefinityWebApp.common.UserControls.Documents.DocumentListDesigner.callBaseMethod(this, 'dispose');
        },
        refreshUI: function () {
            var controlData = this.get_controlData();
     
            jQuery("#txtOther").val(controlData.Other);
            jQuery("#drpPath").attr('selected', controlData.libraryPath);
            jQuery("#pdf").attr('checked', controlData.chkpdf);
            jQuery("#doc").attr('checked', controlData.chkdoc);
            jQuery("#docx").attr('checked', controlData.chkdocx);
            jQuery("#xls").attr('checked', controlData.chkxls);
            jQuery("#xlsx").attr('checked', controlData.chkxlsx);
        },
        applyChanges: function () {
     
            var controlData = this.get_controlData();
     
            controlData.Other = jQuery("#txtOther").val();
            controlData.libraryPath = jQuery("#drpPath").val();
            controlData.chkpdf = jQuery("#pdf").attr('checked');
            controlData.chkdoc = jQuery("#doc").attr('checked');
            controlData.chkdocx = jQuery("#docx").attr('checked');
            controlData.chkxls = jQuery("#xls").attr('checked');
            controlData.chkxlsx = jQuery("#xlsx").attr('checked');
        },
        get_controlData: function () {
            return this.get_propertyEditor().get_control();
        },
        get_propertyEditor: function () {
            return this._propertyEditor;
        }
    }
     
    SitefinityWebApp.common.UserControls.Documents.DocumentListDesigner.registerClass('SitefinityWebApp.common.UserControls.Documents.DocumentListDesigner', Telerik.Sitefinity.Web.UI.ControlDesign.ControlDesignerBase);
    if (typeof (Sys) !== 'undefined') Sys.Application.notifyScriptLoaded();

    DesignerTemplate.ascx
    <%@ Control Language="C#" AutoEventWireup="true" CodeBehind="DesignerTemplate.ascx.cs"
        Inherits="SitefinityWebApp.common.UserControls.Documents.DesignerTemplate" %>
    <script type="text/javascript">
        $(document).ready(function () {
            $('#dvDrop').load('/Common/UserControls/Documents/DesignerTemplateValues.aspx');
        });
     
    </script>
    <div style="width: 500px;">
        <span>Library Path</span><br />
        <div id="dvDrop">
        </div>
        <span>If other, please specify:</span><br />
        <input type="text" id="txtOther" />
        <br />
        <br />
        <span>Allowed file types:</span><br />
        <table>
            <tr>
                <td>
                    <label>
                        DocX</label>
                </td>
                <td>
                    <input id="docx" type="checkbox" />
                </td>
            </tr>
            <tr>
                <td>
                    <label>
                        Doc</label>
                </td>
                <td>
                    <input id="doc" type="checkbox" />
                </td>
            </tr>
            <tr>
                <td>
                    <label>
                        XlsX</label>
                </td>
                <td>
                    <input id="xlsx" type="checkbox" />
                </td>
            </tr>
            <tr>
                <td>
                    <label>
                        Xls</label>
                </td>
                <td>
                    <input id="xls" type="checkbox" />
                </td>
            </tr>
            <tr>
                <td>
                    <label>
                        Pdf</label>
                </td>
                <td>
                    <input id="pdf" type="checkbox" />
                </td>
            </tr>
        </table>
         </div>

    And these are my Get:Set's
    [ControlDesigner(typeof(common.UserControls.Documents.DocumentListDesigner)), PropertyEditorTitle("Library Properties")]
     
        public string libraryPath { get; set; }
        public string Other { get; set; }
        public bool chkpdf { get; set; }
        public bool chkdoc { get; set; }
        public bool chkdocx { get; set; }
        public bool chkxls { get; set; }
        public bool chkxlsx { get; set; }
     
        #region Visiblity
     
        [Browsable(false)]
        public override bool EnableViewState
        {
            get
            {
                return base.EnableViewState;
            }
            set
            {
                base.EnableViewState = value;
            }
        }
     
        [Browsable(false)]
        public override ClientIDMode ClientIDMode
        {
            get
            {
                return base.ClientIDMode;
            }
            set
            {
                base.ClientIDMode = value;
            }
        }
     
        [Browsable(false)]
        public override bool EnableTheming
        {
            get
            {
                return base.EnableTheming;
            }
            set
            {
                base.EnableTheming = value;
            }
        }
     
        [Browsable(false)]
        public override string ID
        {
            get
            {
                return base.ID;
            }
            set
            {
                base.ID = value;
            }
        }
     
        [Browsable(false)]
        public override ViewStateMode ViewStateMode
        {
            get
            {
                return base.ViewStateMode;
            }
            set
            {
                base.ViewStateMode = value;
            }
        }
     
        [Browsable(false)]
        public override bool Visible
        {
            get
            {
                return base.Visible;
            }
            set
            {
                base.Visible = value;
            }
        }
     
        #endregion
     
        public string folderPath = "~/[DocumentLibrary]/";
        public string filePath = "/[DocumentLibrary]/";
        public string SortBy = "DateModified desc";
        public static int ItemsPerPage = 50;
        public static string fSort = "";
        public static string sSort = "";
        public static string dSort = "";
  10. Svetoslav Petsov
    Svetoslav Petsov avatar
    456 posts
    Registered:
    24 Sep 2012
    28 Sep 2011
    Link to this post
    Hello Charles,

     I tested it and indeed - the property has been changed to return string. To fix this, you can just use the property "isChecked" instead of "checked":

    controlData.chkpdf = jQuery("#pdf").attr('isChecked')
    If you have any further questions, feel free to get back to me Regards,
    Svetoslav Petsov
    the Telerik team
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  11. Charles
    Charles avatar
    21 posts
    Registered:
    07 Jun 2011
    30 Sep 2011
    Link to this post
    Hi Svetoslav

    Thanks for the reply. I have tried your suggestion, but it still does not work.

    I am also still getting "validator is undefined" from one of the SF axd files(http://localhost:4721/Telerik.Web.UI.WebResource.axd?_TSM_HiddenField_=ctl01_TSM&compress=0&_TSM_CombinedScripts_=%3b%3bTelerik.Sitefinity.Resources%3aen%3a7866b8a4-e0a8-4a7b-8304-35960ddd00f2%3a7ee0bb1f).

    Is there another way/workaround for ths?

    Thanks

    Charles D.
  12. Svetoslav Petsov
    Svetoslav Petsov avatar
    456 posts
    Registered:
    24 Sep 2012
    30 Sep 2011
    Link to this post
    Hello Charles,

     I used the control from this article to test your issue, it really reproduced on 4.2, but after changing "checked" with "isChecked" no further problem was caused. 
    The only way I can tell why this isn't working for you is if you share your control so I can test it locally. 

    All the best,
    Svetoslav Petsov
    the Telerik team
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
12 posts, 0 answered