More in this section

Forums / Developing with Sitefinity / Using categories and data binding events a FlatSelector

Using categories and data binding events a FlatSelector

3 posts, 0 answered
  1. Nate
    Nate avatar
    7 posts
    31 Jul 2013
    17 Sep 2013
    Link to this post
    I created a Dynamic Items Field Control Selector for a dynamic module that I have, which uses a FlatSelector to list out the items by default.  That all works fine, but I need to add another column to show the category that the item belongs to.  By default it just gives me the category's GUID, but I need to show the actual text.

    I have 2 questions:
    Why doesn't the OnDataBinding event fire for the FlatSelector?  I've successfully used this before with other controls (DynamicDetailContainer for example), but my breakpoint never gets hit at runtime.


    Is there any built in way to just show the category's name/hierarchy as a column in the FlatSelector?

    Thanks in advance!
  2. Arno
    Arno avatar
    249 posts
    08 Sep 2010
    18 Sep 2013 in reply to Nate
    Link to this post
    Hi Nate,

    Yes, the GUID is quite useless to display. There is a request to improve this in Thunder, but it has still not been done. Please vote for it!

    I received this work around from Support when asking about it:

    The reason why only the Guids are displayed is that we do not know which provider is used for the dynamic content. In order to be able to display the item titles you will need to call the Dynamic module's Data service and get them from there.

    In my scenario I have exposed one public GUID property on the widget called "SelectedItemID" like so:

    public Guid SelectedItemId { get; set; }

    Then I have created a widget designer with Thunder following the instructions from the referred documentation article. Here are the 2 changes I made to the widget designer's .js file:

    1. In the refreshUI function I call the service in order to get the item's Title like so:

    refreshUI: function () {
            var controlData = this._propertyEditor.get_control(); /* JavaScript clone of your control - all the control properties will be properties of the controlData too */
            if (controlData.SelectedItemId) {
                var serviceUrl = this.get_SelectedItemIdItemSelector()._originalServiceBaseUrl;
                if (serviceUrl.endsWith("/live")) {
                    serviceUrl = serviceUrl.substring(0, serviceUrl.length - 5);
                var providerName = "";
                if (this.get_SelectedItemIdItemSelector().get_providerName()) {
                    providerName = this.get_SelectedItemIdItemSelector().get_providerName();
                var me = this;
                $.get(serviceUrl + "/" + controlData.SelectedItemId +
                    "/?provider=" + providerName +
                    "&itemType=" + this.get_SelectedItemIdItemSelector().get_itemType(), function (data) {
                        me.get_selectedSelectedItemId().innerHTML = data.Item.Title.Value;
                //this.get_selectedSelectedItemId().innerHTML = controlData.SelectedItemId;
                this.get_selectButtonSelectedItemId().innerHTML = '<span class=\"sfLinkBtnIn\">Change</span>';

    Basically this calls the service with the correctly populated values for provider, item type etc. which retrieves the item's title. It also strips off the "/live" from the string constructed.
    2. In the Private methods section for DoneSelecting you also need to pass the title like so:

    _SelectedItemIdDoneSelecting: function (sender, args) {
            var selectedItem = this.get_SelectedItemIdSelectedItems()[0];
            if (selectedItem != null) {
                this.get_selectedSelectedItemId().innerHTML = selectedItem.Title.Value;
                this.get_selectButtonSelectedItemId().innerHTML = '<span class=\"sfLinkBtnIn\">Change</span>';
            jQuery("body > form").show();

  3. Nate
    Nate avatar
    7 posts
    31 Jul 2013
    18 Sep 2013
    Link to this post
    Thanks, it hadn't occurred to me to try making an AJAX request to get the info.  I'll give that a try.
3 posts, 0 answered