MicrosoftAjax中的Custom Control是怎么和Sys.UI.Control联系起来的?

首先假设有如下的继承于Sys.UI.Control的JS代码,我们期望将其封装在一个Custom Control里面,即以DLL的形式在多个application里面使用:

///<reference name="MicrosoftAjax.js"/>

Type.registerNamespace("AjaxEnabled");

AjaxEnabled.PassTextBox = function (element) {
    AjaxEnabled.PassTextBox.initializeBase(this, [element]);
    this._weakCssClass = null;
    this._mediumCssClass = null;
    this._strongCssClass = null;
};

AjaxEnabled.PassTextBox.prototype = {
    initialize: function () {
        AjaxEnabled.PassTextBox.callBaseMethod(this, 'initialize');
        $addHandlers(this.get_element(), { 'keyup': this.keyup }, this);
    },
    dispose: function () {
        AjaxEnabled.PassTextBox.callBaseMethod(this, 'dispose');
    },
    keyup: function () {
        var pass = this.get_element().value;
        this.get_element().className = this.calculate(pass);
    },
    calculate: function (password) {
        var str = new String(password.toString());
        if (str.length < 5)
            return "Weak";
        else if (str.length < 8)
            return "Medium";
        else
            return "Strong";
    },
    get_weakCssClass: function () {
        return this._weakCssClass;
    },
    set_weakCssClass: function (value) {
        this._weakCssClass = value;
    },
    get_mediumCssClass: function () {
        return this._mediumCssClass;
    },
    set_mediumCssClass: function (value) {
        this._mediumCssClass = value;
    },
    get_strongCssClass: function () {
        return this._strongCssClass;
    },
    set_strongCssClass: function (value) {
        this._strongCssClass = value;
    }
};

AjaxEnabled.PassTextBox.registerClass("AjaxEnabled.PassTextBox", Sys.UI.Control);
if (typeof Sys !== "undefined")
    Sys.Application.notifyScriptLoaded();

这里我们需要解决的问题是,如何将ASP.NET的控件的property和Sys.UI.Control的property联系起来,从而传入值?

1. 首先我们在实现Custom Control的时候,定义public的C#的property,名字任意。

2. 其次,在实现IScriptControl接口的时候,在GetScriptDescriptors()方法里面,通过AddProperty的方法,将JS里面的property和C#的property联系起来。这样我们在控件property赋值的时候,就可以将值传入到Sys.UI.Control的JS对象里面。

posted on 2012-05-03 00:44  李志鹏  阅读(302)  评论(0)    收藏  举报

导航