ClientSide population of resources

[Shawn McCollum]

I'm running into a problem with custom forms and client side population of resources.  When I do server side population, it works, but then I'm running into time out issues - and I just don't want to do it server side. I don't have those time out  issues client side, but there is a gotcha.

In the _populateResources function, the first for loop is never entered with Client Side population.  There aren't any event types that are populated.

Is this a known problem?

[Shawn McCollum]

To respond to my own post, the call to GetResources is returning data: here is a sample

{"d":[{"__type":"Telerik.Web.UI.ResourceData","Key":"121","Text":"Academic Calendar Date","Type":"Event_Type","Available":true,"EncodedKey":"/wEFAzEyMQ==","Attributes":{}},{"__type":"Telerik.Web.UI.ResourceData","Key":"61","Text":"Ae.Announcement","Type":"Event_Type","Available":true,"EncodedKey":"/wEFAjYx","Attributes":{}},{"__type":"Telerik.Web.UI.ResourceData","Key":"60","Text":"Ae.Basic","Type":"Event_Type","Available":true,"EncodedKey":"/wEFAjYw","Attributes":{}},{"__type":"Telerik.Web.UI.ResourceData","Key":"64","Text":"Ae.Clinical Correlation","Type":"Event_Type","Available":true,"EncodedKey":"/wEFAjY0","Attributes":{}},{"__type":"Telerik.Web.UI.ResourceData","Key":"62","Text":"Ae.Faculty Panel","Type":"Event_Type","Available":true,"EncodedKey":"/wEFAjYy","Attributes":{}},{"__type":"Telerik.Web.UI.ResourceData","Key":"63","Text":"Ae.Lecture","Type":"Event_Type","Available":true,"EncodedKey":"/wEFAjYz","Attributes":{}},{"__type":"Telerik.Web.UI.ResourceData","Key":"239","Text":"Ae.Optional","Type":"Event_Type","Available":true,"EncodedKey":"/wEFAzIzOQ==","Attributes":{}},{"__type":"Telerik.Web.UI.ResourceData","Key":"75","Text":"Ae.Small Group Session","Type":"Event_Type","Available":true,"EncodedKey":"/wEFAjc1","Attributes":{}},{"__type":"Telerik.Web.UI.ResourceData","Key":"278","Text":"Athletics","Type":"Event_Type","Available":true,"EncodedKey":"/wEFAzI3OA==","Attributes":{}},{"__type":"Telerik.Web.UI.ResourceData","Key":"45","Text":"Banner","Type":"Event_Type","Available":true,"EncodedKey":"/wEFAjQ1","Attributes":{}},{"__type":"Telerik.Web.UI.ResourceData","Key":"3","Text":"Banquet","Type":"Event_Type","Available":true,"EncodedKey":"/wEFATM=","Attributes":{}},{"__type":"Telerik.Web.UI.ResourceData","Key":"244","Text":"Benefit","Type":"Event_Type","Available":true,"EncodedKey":"/wEFAzI0NA==","Attributes":{}},{"__type":"Telerik.Web.UI.ResourceData","Key":"4","Text":"Blood Drive","Type":"Event_Type","Available":true,"EncodedKey":"/wEFATQ=","Attributes":{}},{"__type":"Telerik.Web.UI.ResourceData","Key":"5","Text":"Breakfast","Type":"Event_Type","Available":true,"EncodedKey":"/wEFATU=","Attributes":{}},{"__type":"Telerik.Web.UI.ResourceData","Key":"122","Text":"C.Basic","Type":"Event_Type","Available":true,"EncodedKey":"/wEFAzEyMg==","Attributes":{}},{"__type":"Telerik.Web.UI.ResourceData","Key":"81","Text":"C.C.M Chamber Music","Type":"Event_Type","Available":true,"EncodedKey":"/wEFAjgx","Attributes":{}},{"__type":"Telerik.Web.UI.ResourceData","Key":"82","Text":"C.C.M Choral","Type":"Event_Type","Available":true,"EncodedKey":"/wEFAjgy","Attributes":{}},{"__type":"Telerik.Web.UI.ResourceData","Key":"83","Text":"C.C.M Dance","Type":"Event_Type","Available":true,"EncodedKey":"/wEFAjgz","Attributes":{}},{"__type":"Telerik.Web.UI.ResourceData","Key":"84","Text":"C.C.M Drama","Type":"Event_Type","Available":true,"EncodedKey":"/wEFAjg0","Attributes":{}}

But for some reason, the resources aren't being merged in to the scheduler object.

[Shawn McCollum]

I narrowed down why I'm getting the time out issues with server side population.  In addition to sending the form authentication cookie in the header, I was also adding the session cookie.  This was causing a long wait.  As soon as I removed the session cookie from the header, the response was nearly immediate - it failed because I rely on session information in my provider, but it failed instantly, which was an improvement.  I'm now looking into ways of getting the additional information to the provider other than through session, but I still would prefer to have this work completely client side.

[Shawn McCollum]

I've narrowed the problem down farther and it appears that the resource types aren't being populated when doing a client side bind.  I think I can rewrite advancedform.js to determine the resource types based on the resources themselves.  I'm still hoping for a better explanation of what is going on.

[T. Tsonev]

Hi Shawn,

I can confirm that the resource types are not getting populated when ResourcePopulationMode is ClientSide. We'll look into this issue, but for the moment you can use the resourcesPopulated client-side event to manually populate them. That said, the default advanced form requires the resource types to be available on the server, so it can create the drop-downs.

Please, refer to this help topic on how to pass additional information to the web service when populating the resources server-side:
Notes on resource grouping

I hope this helps.

Sincerely yours,
Tsvetomir Tsonev
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Shawn McCollum]

I'm modifying advancedform.js to get around that limitation (where the advanced form requires population on the serverside).  I'll post the code once I'm done.

[Shawn McCollum]

As promised, here is the code to allow for client side initialization of custom form resources

    _initializeCustomControls: function() {
        var template = this;
        var resourceTypes = this._scheduler.get_resourceTypes();
        var resources = this._scheduler.get_resources();


        resourceTypes.forEach(function(resType) {
            var baseName = template._templateId + "_Res" + resType.get_name() + resourceControlSuffix;
            var baseLabel = template._templateId + "_Res" + resType.get_name() + resourceLabelSuffix;
            if (resType.get_allowMultipleValues()) {
                var checkBox = $("#" + baseLabel).parent().children('.rsCheckBoxList');
                if (checkBox.children().length == 0) {
                    resources.forEach(function(res) {
                        if (res.get_type() == resType.get_name()) {
                            var listItem = $('<li />').appendTo(checkBox);
                            var checkItem = $('<input id="' + baseName + '_' + res.get_key() +'" type="checkbox" name="' + baseName.replace('_', '$') + '$' + res.get_key() + '" />').appendTo(listItem);
                            var label = $('<label>' + res.get_text() + '</label>').appendTo(listItem);
                        }
                    });
                }
            }
            else {
                var dropDown = $find(baseName);
                if (dropDown && dropDown.get_items().get_count() == 1) {
                    dropDown.trackChanges();
                    resources.forEach(function(res) {
                        if (res.get_type() == resType.get_name()) {
                            var comboItem = new Telerik.Web.UI.RadComboBoxItem();
                            comboItem.set_text(res.get_text());
                            comboItem.set_value(res.get_key());
                            dropDown.get_items().add(comboItem);
                        }
                    });
                    dropDown.commitChanges();
                }
            }
        });
    }

You need to places a call to the function in the "initialize" function is AdvancedForm.js