[CLOSED] Ext.NET 2.1.1: Editable ComboBox Missing HiddenState If Query Equals Value

  1. #1

    [CLOSED] Ext.NET 2.1.1: Editable ComboBox Missing HiddenState If Query Equals Value

    Version: 2.1.1
    Not sure if this was fixed in 2.2, but since I don't have access to the SVN can't really check. ;)

    To reproduce:
    1. Run test page included below
    2. Type in "WA" into ComboBox
    3. Select "WASHINGTON" either via Tab key or mouse click
    4. Click "Show Selection"
    Result: "Warning Error Occurred: WASHINGTON"

    To use potential fix:
    1. Uncomment override script tag
    2. Repeat steps above
    Result: "Selected: WA"

    Problem:
    The getHiddenState logic is attached to the change event on the field.
    The oldValue and newValue matches as oldValue is what the user typed in but not selected and the selected/new value is the value of the store record.
    The reason it's failing to postback hidden state is because setValue called by select event does not fire change if the oldValue and newValue matches.

    <%@ Page Language="C#" AutoEventWireup="true" %>
    
    <!DOCTYPE html>
    
    <script runat="server">
    
        public class State
        {
            public string StateID { get; set; }
            public string StateName { get; set; }
        }
    
        protected void Page_Load(Object sender, EventArgs e)
        {
            if (!X.IsAjaxRequest)
            {
                List<State> states = new List<State>() 
                { 
                    new State(){ StateID = "AK", StateName="ALASKA" },
                    new State(){ StateID = "AL", StateName="ALABAMA" },
                    new State(){ StateID = "AR", StateName="ARKANSAS" },
                    new State(){ StateID = "AZ", StateName="ARIZONA " },
                    new State(){ StateID = "CA", StateName="CALIFORNIA " },
                    new State(){ StateID = "CO", StateName="COLORADO " },
                    new State(){ StateID = "CT", StateName="CONNECTICUT" },
                    new State(){ StateID = "DC", StateName="DISTRICT OF COLUMBIA" },
                    new State(){ StateID = "DE", StateName="DELAWARE" },
                    new State(){ StateID = "FL", StateName="FLORIDA" },
                    new State(){ StateID = "GA", StateName="GEORGIA" },
                    new State(){ StateID = "HI", StateName="HAWAII" },
                    new State(){ StateID = "IA", StateName="IOWA" },
                    new State(){ StateID = "ID", StateName="IDAHO" },
                    new State(){ StateID = "IL", StateName="ILLINOIS" },
                    new State(){ StateID = "IN", StateName="INDIANA" },
                    new State(){ StateID = "KS", StateName="KANSAS" },
                    new State(){ StateID = "KY", StateName="KENTUCKY" },
                    new State(){ StateID = "LA", StateName="LOUISIANA" },
                    new State(){ StateID = "MA", StateName="MASSACHUSETTS" },
                    new State(){ StateID = "MD", StateName="MARYLAND" },
                    new State(){ StateID = "ME", StateName="MAINE" },
                    new State(){ StateID = "MI", StateName="MICHIGAN" },
                    new State(){ StateID = "MN", StateName="MINNESOTA" },
                    new State(){ StateID = "MO", StateName="MISSOURI" },
                    new State(){ StateID = "MS", StateName="MISSISSIPPI" },
                    new State(){ StateID = "MT", StateName="MONTANA" },
                    new State(){ StateID = "NC", StateName="NORTH CAROLINA" },
                    new State(){ StateID = "ND", StateName="NORTH DAKOTA" },
                    new State(){ StateID = "NE", StateName="NEBRASKA" },
                    new State(){ StateID = "NH", StateName="NEW HAMPSHIRE" },
                    new State(){ StateID = "NJ", StateName="NEW JERSEY" },
                    new State(){ StateID = "NM", StateName="NEW MEXICO" },
                    new State(){ StateID = "NV", StateName="NEVADA" },
                    new State(){ StateID = "NY", StateName="NEW YORK" },
                    new State(){ StateID = "OH", StateName="OHIO" },
                    new State(){ StateID = "OK", StateName="OKLAHOMA" },
                    new State(){ StateID = "OR", StateName="OREGON" },
                    new State(){ StateID = "PA", StateName="PENNSYLVANIA" },
                    new State(){ StateID = "RI", StateName="RHODE ISLAND" },
                    new State(){ StateID = "SC", StateName="SOUTH CAROLINA" },
                    new State(){ StateID = "SD", StateName="SOUTH DAKOTA" },
                    new State(){ StateID = "TN", StateName="TENNESSEE" },
                    new State(){ StateID = "TX", StateName="TEXAS" },
                    new State(){ StateID = "UT", StateName="UTAH" },
                    new State(){ StateID = "VA", StateName="VIRGINIA " },
                    new State(){ StateID = "VT", StateName="VERMONT" },
                    new State(){ StateID = "WA", StateName="WASHINGTON" },
                    new State(){ StateID = "WI", StateName="WISCONSIN" },
                    new State(){ StateID = "WV", StateName="WEST VIRGINIA" },
                    new State(){ StateID = "WY", StateName="WYOMING" }
                };
                strStateList.DataSource = states;
                strStateList.DataBind();
            }
        }
    
        protected void btnShowSelection_DirectClick(object sender, DirectEventArgs e)
        {
            string value = cmbState.SelectedItem.Value;
            if (value != null && value.Length != 2)
                lblResult.Text = "Warning Error Occurred: " + cmbState.SelectedItem.Value;
            else
                lblResult.Text = "Selected: " + cmbState.SelectedItem.Value;
        }
    </script>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>State Selection Test</title>
    
        <%-- 
        <script type="text/javascript">
            Ext.form.field.ComboBox.override({
    
                initHiddenFieldState: function () {
                    if (this.useHiddenField) {
                        this.on("select", function () { //do on select, cause change only fires if value is different
                            if (this.hiddenField) {
                                var val = this.getHiddenState(this.getValue());
    
                                this.hiddenField.dom.value = val !== null ? val : "";
    
                                this.checkHiddenStateName();
                            }
                            else {
                                this.hiddenValue = this.getHiddenState(this.getValue());
                            }
                        });
                    }
                },
    
                initComponent: Ext.Function.createSequence(Ext.form.field.ComboBox.prototype.initComponent, function () {
                    this.initMerge();
    
                    if (Ext.net.ResourceMgr.isMVC) {
                        this.includeHiddenStateToSubmitData = !this.simpleSubmit;
                    }
    
                    if (!Ext.isEmpty(this.selectedItems) && this.store) {
                        this.setInitValue(this.selectedItems);
                    }
    
                    this.initHiddenFieldState();
                })
    
            });
        </script>
        --%>
    
    </head>
    <body>
        <form id="frm" runat="server">
    
            <ext:ResourceManager ID="rsMan" runat="server">
                <Listeners>
                    <AjaxRequestException Handler="Ext.net.Mask.hide();" />
                    <BeforeAjaxRequest Handler="Ext.net.Mask.show({msg:'Please Wait'});" />
                    <AjaxRequestComplete Handler="Ext.net.Mask.hide();" />
                </Listeners>
            </ext:ResourceManager>
    
            <ext:FormPanel ID="fp" runat="server" Title="Select State" Width="500">
                <Items>
    
                    <ext:ComboBox runat="server" ID="cmbState"
                        FieldLabel="State" Editable="true" SelectOnFocus="false" ForceSelection="true"
                        QueryMode="Local" DisplayField="StateName" ValueField="StateID" AllowBlank="false" IndicatorText="*">
                        <Store>
                            <ext:Store ID="strStateList" runat="server">
                                <Reader>
                                    <ext:JsonReader />
                                </Reader>
                                <Model>
                                    <ext:Model ID="mdlStateList" runat="server" IDProperty="StateID">
                                        <Fields>
                                            <ext:ModelField Name="StateID" />
                                            <ext:ModelField Name="StateName" />
                                        </Fields>
                                    </ext:Model>
                                </Model>
                            </ext:Store>
                        </Store>
                    </ext:ComboBox>
    
                    <ext:Button ID="btnShowSelection" runat="server" OnDirectClick="btnShowSelection_DirectClick" Text="Show Selection" />
    
                    <ext:Label ID="lblResult" runat="server" />
    
                </Items>
            </ext:FormPanel>
    
        </form>
    </body>
    </html>
    Last edited by Daniil; Apr 30, 2013 at 9:39 AM. Reason: [CLOSED]
  2. #2
    I tested your sample with v2.2 (without the fix) and all works fine (i see "Selected: WA")

Similar Threads

  1. ComboBox AutoComplete with Fuzzy query
    By Johnnywwh in forum 2.x Help
    Replies: 0
    Last Post: Nov 22, 2012, 2:54 AM
  2. Replies: 1
    Last Post: Jul 26, 2012, 1:18 PM
  3. [CLOSED] Force remote reloading of ComboBox on each query
    By r_honey in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Apr 05, 2010, 3:59 PM
  4. ComboBox bug Value equals Text
    By jjakob in forum 1.x Help
    Replies: 2
    Last Post: Feb 11, 2010, 12:44 PM
  5. Hello, ComboBox Remote Query Question
    By bruce in forum 1.x Help
    Replies: 0
    Last Post: Mar 12, 2009, 10:55 PM

Posting Permissions