[CLOSED] How to restrict the Change listener event from firing in page load.

[arjunrvasisht]

Hi,

In my requirement I have 4 multicombo box and a button. If any one of the multicombos is completely unselected, then the button shud be disabled.

Below is the code am using:

<ext:MultiCombo ID="mltcmbWaterlineUnfunded" runat="server" LabelAlign="Left"
    DisplayField="Name"
    EmptyText="<%$ Resources:WebResource,WaterMark_Select%>" Resizable="false" Width="150">
    <Items>
        <ext:ListItem Text="Above" Value="1" />
        <ext:ListItem Text="Below" Value="2" />
        <ext:ListItem Text="Closed" Value="3" />
    </Items>
    <SelectedItems>
        <ext:ListItem Text="Above" Value="1" />
    </SelectedItems>
    <Listeners>
        <Change Fn="CheckForSelections" />
    </Listeners>
</ext:MultiCombo>

    var CheckForSelections = function () {
        debugger;
        var WaterlineFunded = #{mlcmbWaterlineFunded};  //Multi combo 1
        var WaterlineUnfunded = #{mltcmbWaterlineUnfunded};  //Multi combo 2              
        var ProbabilityFunded = #{mltcmbProbabilityFunded}; //Multi combo 3
        var ProbabilityUnfunded = #{mltcmbProbabilityUnfunded}; //Multi combo 4
       
        if (WaterlineFunded.getSelectedValues().length == 0 ||
            WaterlineUnfunded.getSelectedValues().length == 0 ||
            ProbabilityFunded.getSelectedValues().length == 0 ||
            ProbabilityUnfunded.getSelectedValues().length == 0)
        {
            #{btnFillRateView}.disable();
        }
        else
        {
            #{btnFillRateView}.enable();
        }
        //disable button
    }

Currently I have applied the change listener to 'Multi combo 3', Since the change event fires during the page load, the multicombo 4 is undefined.
So I want to restrict the change event from firing at page load.

[EnZo]

Hi arjunrvasisht

Page_Load occurs when all the controls have been loaded, therefore I don't believe your fourth MultiCombo should be undefined. Unless you are creating it dynamically and triggering the event on the third MultiCombo before that.

I think a sample that reproduces the issue would be good so the problem can be tracked as to why the fourth MultiCombo is undefined.

In any case, my suggestion is that you can check if an object has been defined or not through the following useful JavaScript function

if (Ext.isDefined(App.mltcmbProbabilityUnfunded))
    //returns true if defined. false if not defined

and then you can handle it accordingly.

Edit: On second thought, the reason the fourth MultiCombo is undefined is because as the controls in the page are being loaded in order via how they are defined in the markup, the third MultiCombo control is loaded, and the event is fired since

<SelectedItems>
    <ext:ListItem Text="Above" Value="1" />
</SelectedItems>

is being used before the fourth MultiCombo has been loaded yet.

The first solution is still viable. Or you can simply choose to set the selected item in Page_Load through code-behind.