0

私の JavaScript ライブラリ全体は、オブジェクト リテラルの名前空間で構築されています。これには、init() から一般的な関数、コントロール、検証などまでの各ページのロジックが含まれています。ページの init() 関数は、ページのボディ ID に基づいて起動されます。

私が抱えている問題は、コントロール セクションにあります。AddressEntry という名前のオブジェクト リテラルがあります。このオブジェクト リテラルには、AddressEntry ASP.NET UserControl を処理する機能が含まれています。ページ上の 1 つの AddressEntry コントロールで問題なく動作しますが、複数ある場合は、ページの最後のコントロールのみが意図したとおりに動作します。

これが私のAddressEntry オブジェクト リテラルです(関連情報に切り詰められています)。

SFAIC.ctrls.AddressEntry = {

    inputs : {

        city        : undefined,
        cityState   : undefined,

        hidden : {

            city    : undefined,
            state   : undefined

        },  

    },

    fn : {

        root : undefined,

        citySelected : function($ddl) {

            var $selected = $ddl.find(":selected");

            this.root.inputs.hidden.city.val($selected.val());          
            this.root.inputs.hidden.state.val($selected.text().split(", ")[1]);

        }

    },

    init : function(addressId) { 

        var self    = this,
            fn      = self.fn,
            inputs  = self.inputs,
            hidden  = inputs.hidden;

            inputs.city         = SFAIC.fn.getContentElement(addressId + "_ddlCity",                SFAIC.$updatePanel);
            inputs.cityState    = SFAIC.fn.getContentElement(addressId + "_ddlCityStateLocked",     SFAIC.$updatePanel);
            hidden.city         = SFAIC.fn.getContentElement(addressId + "_txtCity",                SFAIC.$updatePanel);
            hidden.state        = SFAIC.fn.getContentElement(addressId + "_txtState",               SFAIC.$updatePanel);

            fn.root = this;

        inputs.city.change(function() { fn.citySelected($(this)); });
        inputs.cityState.change(function() { fn.citySelected($(this)); });

    }

};

次に、ページ オブジェクト リテラルは次のようになります (ここでも省略されています)。

SFAIC.pages.salesProcess.Applicant = {

    init : function() {         

        SFAIC.ctrls.AddressEntry.init("AddressGarage");
        SFAIC.ctrls.AddressEntry.init("AddressMailing");

    }

};

AddressMailing init がAddressGarage init をオーバーライドすることは明らかです。SFAIC.ctrls.AddressEntryオブジェクト リテラルをオブジェクト化して、ページ上にある可能性のある多くの AddressEntry UserControls を互いにオーバーライドせずに処理できるようにするにはどうすればよいですか?

4

3 に答える 3

1

オブジェクト リテラルは、定義上、オブジェクトの単一のインスタンスです。おそらく、同じオブジェクトの複数のインスタンスを作成できるように、プロトタイプを使用してオブジェクトを作成する必要があります。

HACK は、ほぼ同じであるが名前が異なる 2 番目のオブジェクト リテラルを作成することです。

于 2012-02-06T21:09:36.397 に答える
0

これが私が思いついた解決策です：

SFAIC.ctrls.AddressEntry = function(addressId) {

    var ctrl = {

            inputs : {

                city        : undefined,
                cityState   : undefined,

                hidden : {

                    city    : undefined,
                    state   : undefined

                },  

            },

            fn : {

                root : undefined,

                citySelected : function($ddl) {

                    var $selected = $ddl.find(":selected");

                    this.root.inputs.hidden.city.val($selected.val());          
                    this.root.inputs.hidden.state.val($selected.text().split(", ")[1]);

                }

            },

            init : function(addressId) { 

                var self    = this,
                    fn      = self.fn,
                    inputs  = self.inputs,
                    hidden  = inputs.hidden;

                    inputs.city         = SFAIC.fn.getContentElement(addressId + "_ddlCity",                SFAIC.$updatePanel);
                    inputs.cityState    = SFAIC.fn.getContentElement(addressId + "_ddlCityStateLocked",     SFAIC.$updatePanel);
                    hidden.city         = SFAIC.fn.getContentElement(addressId + "_txtCity",                SFAIC.$updatePanel);
                    hidden.state        = SFAIC.fn.getContentElement(addressId + "_txtState",               SFAIC.$updatePanel);

                    fn.root = this;

                inputs.city.change(function() { fn.citySelected($(this)); });
                inputs.cityState.change(function() { fn.citySelected($(this)); });

            }

    };

    ctrl.init();

    return ctrl;    

};          

SFAIC.pages.salesProcess.Applicant = {

    init : function() {         

        var garage, mailing;

        garage = SFAIC.ctrls.AddressEntry("AddressGarage");
        mailing = SFAIC.ctrls.AddressEntry("AddressMailing");

    }

};
于 2012-02-06T21:43:33.310 に答える
0

まあ、私は可能な解決策を投稿するのに遅れているかどうかはわかりませんが、とにかくここに行きます。

あなたのDOM構造やJSオブジェクトはわかりませんが、次のようにします。

  1. クラスまたは特別な属性によって、AddressEntryタイプのすべてのDOM要素またはJSオブジェクトを取得します。これを実現するには、おそらく他の場所で何かを変更する必要があります。
  2. 各要素を循環させ、「Call」を使用して「init」関数を呼び出します。そうすれば、各オブジェクトまたは要素は、実行している初期化にバインドされます。

これは次のようになります（テストされていません!!）：

SFAIC.pages.salesProcess.Applicant = {

    init : function() {         

        $('.addresses').each(function (i) {
            SFAIC.ctrls.AddressEntry.init.call(this, this.attr('id'); });
    }
};

コードにバグがあるか、動作させるための行が数行不足している可能性がありますが、アイデアは明確だと思います。それがお役に立てば幸いです、そしてあなたはそれをあなたのケースに適用することができます。

于 2012-02-06T22:14:51.790 に答える