Telerik ClientSide Extensibility

[Jay]

First off, I'm sorry if this has been asked before, I searched but didn't find anything like this, but did find cases where this would be useful.

Anyway....To my question....

There are often times where for simplicity I need to modify/extend the client side code for some of the Telerik Controls.  The RadInputBox for example, I modified to give it Show/Hide methods.  Here's the scenario that caused this:
I needed a RadComboBox to turn into a RadTextBox if there were no DropDownItems available.  So I added a Show/Hide method to the RadTextBox.  I set the RadTextBox's cssclass to be "hidden" (Which actually sets the ID_Text class to hidden, not the wrapper).

It would be nice if an API of sorts was provided that allowed ease of Extensibility.   I have my own "Hack" version to do this that I'll show you, but it'd be nice if the makers of the controls hooked up something that made all of this a little easier.

Here's my TelerikExtender.js

function TelerikExtender() {
    this._namespaces = [];
    this._methods = [];
    this._methodNames = [];
    this.AddExtension = _registerExtension;
    this.Init = init;

    function _registerExtension(namespace, methodName, registration) {
        if (namespace == "")
            return;

        if (methodName == "")
            return;

        if (typeof (registration) != "function")
            return;

        Array.add(this._namespaces, namespace);
        Array.add(this._methods, registration);
        Array.add(this._methodNames, methodName);
    }

    function init() {

        if (this._namespaces) {
            for (var i = 0; i < this._namespaces.length; i++) {
                initMethod(this._namespaces[i], this._methodNames[i], this._methods[i]);
            }
        }
    }

    function initMethod(namespace, methodName, method) {
        if (!namespaceLoaded(namespace)) {
            setTimeout(function() {
                initMethod(namespace, methodName, method);
            }, 0);
            return;
        }
        if (typeof (eval(namespace + '.' + methodName)) == "undefined") {
            eval('(' + namespace + '.prototype.' + methodName + ' = ' + method + ');');
        }
    }

    function namespaceLoaded(namespace) {
        var pieces = namespace.split(".");
        var piece = "";
        for (var i = 0; i < pieces.length; i++) {
            if (piece != "") piece += ".";
            piece += pieces[i];
            if (eval('(typeof(' + piece + ') == "undefined");'))
                return false;
        }
        return true;
    }
}
var telerikExtender = new TelerikExtender();

And inside of the JavaScript files I need to extend methods, I do something like this at the top:

telerikExtender.AddExtension("Telerik.Web.UI.RadInputControl", "Show", function() {
    alert("Hey, Show() was called!");
});

telerikExtender.Init();

So then if I have a RadTextBox named someTextBox, I can simply call someTextBox.Show(); and it does its thing!

I'm sure what I'm doing isn't the smoothest or flat out wrong in some regards, but it works for my current scenario.   Anyway, thought I'd share that and see if anyone else had any ideas for a better solution, or if you Telerik guys had or will have some method of easilly extending the client side code.

-Jeff

[Missing User]

Hello Jeff Sheldon,


To see more information on the requested functionality, please refer to the following article.

• Extending JavaScript with ASP.NET AJAX

I hope this information helps.

All the best,
Plamen
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Jay]

That's not exactly what I was looking for.  I was referring to the ability to extend the client side code of the Telerik Controls directly.  But since the demand for this kind of feature probably isn't very high, I can just modify the Telerik Controls myself.