Taxonomy Selection in Custom Control Designer

Posted by Community Admin on 05-Aug-2018 19:59

Taxonomy Selection in Custom Control Designer

All Replies

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

I have a page control that uses a RadScheduler to display events in a calendar format.  I want to filter the events displayed based on categories and would like the user to be able to edit the selected categories from the backend designer menu.

My first question is, what is the recommended way to display available categories and allow user selection in a designer form?

I'm currently using a RadTreeView to display the categories in a hierarchy, but I'm not sure how to detect the selected categories on form submission.

Second question, assuming using a RadTreeView is the recommended approach, how would I go about retrieving the selected values from the RadTreeView control on the designer form?

Thanks.

Posted by Community Admin on 09-Mar-2011 00:00

Hi Geoff,

You should build this into one control. The easiest way to filter the RadScheduler based on a category is using QueryString key in the url. You can click a node from the RadTreeView and on this event you can bind the RadScheduler or you can cause a post back which will call CreateChildControls. Please take a look at this post that shows how to filter items based on a taxon

www.sitefinity.com/.../sitefinity-4-0-taxonomy-categorization.aspx

If you want to just perform the filtering form the ControlDesigner, not from the public part of the website, you just need a property where you pass the category /s ID. You can take a look at

www.sitefinity.com/.../creating-the-c-sharp-custom-designer-class.aspx

You need to pass the RadTreeView object to the client component and inside applyChanges you can call get_selectedNodes()[0].get_value client method to get the selection.


Greetings,
Ivan Dimitrov
the Telerik team

Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!

Posted by Community Admin on 09-Mar-2011 00:00

Thank you for the detailed response. get_selectedNodes()[0].get_value is what I was looking for.  However, I'm having an issue getting access to the RadScheduler from within the applyChanges js method. I tried exposing it as a property on the designer .cs file similar to how values are persisted within applyChanges (controlData.Scheduler), but I was unable to access it this way. Because the server control renders as markup on the client, I'm not sure how to get access to the actual RadScheduler object client side.

Thanks.

Posted by Community Admin on 09-Mar-2011 00:00

Hi Geoff,

You should add the RadScheduler on the client through GetScriptDescriptors() as a component property.


this._Scheduler = null;
 
 
get_Scheduler : function ()
    return this._Scheduler ;
,
set_Scheduler : function (value)
    this._Scheduler = value;
,


Greetings,
Ivan Dimitrov
the Telerik team
Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!

Posted by Community Admin on 09-Mar-2011 00:00

I misspoke earlier about the RadScheduler.  The control is a RadTreeView. Adding the RadTreeView as a component property in the GetScriptDescriptors() method worked, as you suggested, but it led me to another issue.

My RadTreeView is using checkboxes and I am able to get the value of a single checkbox.  I would like to be able to iterate through all the checked checkboxes and retrieve the value from each of them.

I wrote the following code, separating the values with a delimiter, but .get_value() is not defined as a method on a single element within the loop.

var categoryIds = '';
var checkedNodes = this.get_Categories().get_checkedNodes();
for (var category in checkedNodes)
    categoryIds += category.get_value() + '_|_';

How would I successfully retrieve the values from each of the checked nodes?

Thanks.

Posted by Community Admin on 10-Mar-2011 00:00

Hi Geoff,

Once you pass the RadTreeView on the client you can use all methods that the RadTeeView expose

www.telerik.com/.../treeview-client-basics.html

You can use

get_checkBoxElement
get_checkState

Greetings,
Ivan Dimitrov
the Telerik team

Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!

Posted by Community Admin on 10-Mar-2011 00:00

It is now working successfully. Thank you for all your help on this issue, Ivan.

I didn't see much documentation on Script Descriptors or how to get access to server controls client side, so to help anyone else that has a similar issue, here is how I loaded the RadTreeView as a component property to get access to it client side:

public override IEnumerable<ScriptDescriptor> GetScriptDescriptors()
    var scriptDescriptors = new List<ScriptDescriptor>(base.GetScriptDescriptors());
    var descriptor = (ScriptControlDescriptor)scriptDescriptors[scriptDescriptors.Count - 1];
    descriptor.AddComponentProperty("Categories", this.tvwTaxa.ClientID);
    return scriptDescriptors.ToArray();

And here is my client side code with my accessors and code to load and save the data:
refreshUI: function ()
    var data = this.get_propertyEditor().get_control();
 
    var selectedNodes = new Array();
 
    var categories = data.Categories.split('_|_');
    for (var i = 0; i < categories.length; i++)
        var node = this.get_Categories().findNodeByValue(categories[i]);
        if (node)
            selectedNodes.push(node);
        
    
 
    this.get_Categories().checkNodes(selectedNodes);
,
applyChanges: function ()
    var controlData = this.get_propertyEditor().get_control();
 
    var categoryIds = '';
    var checkedNodes = this.get_Categories().get_checkedNodes();
    for (var i = 0; i < checkedNodes.length; i++)
        categoryIds += checkedNodes[i].get_value() + '_|_';
    
 
    controlData.Categories = categoryIds;
,
get_Categories: function ()
    return this._Categories;
,
set_Categories: function (value)
    this._Categories = value;

This thread is closed