Drop down list and check boxes in control designer

Posted by Community Admin on 03-Aug-2018 13:18

Drop down list and check boxes in control designer

All Replies

Posted by Community Admin on 03-Aug-2011 00:00

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.

Posted by Community Admin on 03-Aug-2011 00:00

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

Posted by Community Admin on 05-Aug-2011 00:00

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.

Posted by Community Admin on 05-Aug-2011 00:00

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

Posted by Community Admin on 08-Aug-2011 00:00

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?

Posted by Community Admin on 08-Aug-2011 00:00

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

Posted by Community Admin on 15-Sep-2011 00:00

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

Posted by Community Admin on 16-Sep-2011 00:00

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

Posted by Community Admin on 26-Sep-2011 00:00

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 = "";

Posted by Community Admin on 28-Sep-2011 00:00

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

Posted by Community Admin on 30-Sep-2011 00:00

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(localhost:4721/Telerik.Web.UI.WebResource.axd

Is there another way/workaround for ths?

Thanks

Charles D.

Posted by Community Admin on 30-Sep-2011 00:00

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

This thread is closed