[CLOSED] Refresh ComboBox after changing Store

**ljcorreia** · Jul 18, 2011, 10:31 AM

Hi,

How would I refresh the items in a ComboBox after I have changed the store of that ComboBox?

Example:

<%@ Page Language="C#" %><%@ Import Namespace="System.Collections.Generic" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>


<script runat="server">
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!X.IsAjaxRequest)
        {
            List<object> list = new List<object>
            {
                new {Text = "1", Value = 1},
                new {Text = "2", Value = 2},
                new {Text = "3", Value = 3}
            };
            
            Store1.DataSource = list;
            Store1.DataBind();


            List<object> list2 = new List<object>
            {
                new {Text = "4", Value = 4},
                new {Text = "5", Value = 5},
                new {Text = "6", Value = 6}
            };


            Store2.DataSource = list2;
            Store2.DataBind();
        }
    }
</script>


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>
    <script type="text/javascript">
        var buttonClick = function () {
            ComboBox1.store = Store2;
        }
    </script>
</head>
<body>
    <form id="Form1" runat="server">
        <ext:ResourceManager ID="ResourceManager1" runat="server" />
        
        <ext:Store runat="server" ID="Store1">          
            <Reader>
                <ext:JsonReader IDProperty="Value">
                    <Fields>
                        <ext:RecordField Name="Text" />
                        <ext:RecordField Name="Value" />
                    </Fields>
                </ext:JsonReader>
            </Reader>
        </ext:Store>
        
        <ext:Store runat="server" ID="Store2">          
            <Reader>
                <ext:JsonReader IDProperty="Value">
                    <Fields>
                        <ext:RecordField Name="Text" />
                        <ext:RecordField Name="Value" />
                    </Fields>
                </ext:JsonReader>
            </Reader>
        </ext:Store>
        
        <ext:ComboBox ID="ComboBox1" runat="server" StoreID="Store1" DisplayField="Text" ValueField="Value" />


        <ext:Button runat="server" Text="Change Store">
            <Listeners>
                <Click Fn="buttonClick" />
            </Listeners>
        </ext:Button>
    </form>
</body>
</html>

The button should change the items in the ComboBox to be 4, 5 & 6. It changes the store successfully but the items in the ComboBox don't change.

**Daniil** · Jul 18, 2011, 11:10 AM

Hi,

Well, yes, just setting .store property doesn't make any sense in JavaScript.

Please clarify why do you need two stores?

What about to bind new data from a server side? Please see the example below.

Example

<%@ Page Language="C#" %>

<%@ Import Namespace="System.Collections.Generic" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<script runat="server">
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!X.IsAjaxRequest)
        {
            List<object> list = new List<object>
            {
                new {Text = "1", Value = 1},
                new {Text = "2", Value = 2},
                new {Text = "3", Value = 3}
            };

            Store1.DataSource = list;
            Store1.DataBind();
        }
    }

    protected void BindNewData(object sender, DirectEventArgs e)
    {
        Store1.DataSource = new List<object>()
        {
            new {Text = "4", Value = 4},
            new {Text = "5", Value = 5},
            new {Text = "6", Value = 6}
        }; ;
        Store1.DataBind();
    }
</script>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Ext.Net Example</title>
</head>
<body>
    <form runat="server">
        <ext:ResourceManager runat="server" />
        <ext:ComboBox runat="server" DisplayField="Text" ValueField="Value">
            <Store>
                <ext:Store runat="server" ID="Store1">
                    <Reader>
                        <ext:JsonReader IDProperty="Value">
                            <Fields>
                                <ext:RecordField Name="Text" />
                                <ext:RecordField Name="Value" />
                            </Fields>
                        </ext:JsonReader>
                    </Reader>
                </ext:Store>
            </Store>
        </ext:ComboBox>
        <ext:Button runat="server" Text="Bind new data" OnDirectClick="BindNewData" />
    </form>
</body>
</html>

**ljcorreia** · Jul 18, 2011, 11:21 AM

Hi Daniil,

I basically have 2 ComboBoxes. The options of the second depend on what item they have selected in the first. I need to make the code all client side as the ComboBox items will be changing very frequently and I don't want to have to go back to the server every time.

Thanks

**Daniil** · Jul 18, 2011, 11:35 AM

Please try this:

var buttonClick = function () {
    ComboBox1.store = Store2;
    ComboBox1.view.bindStore(Store2);
}

**ljcorreia** · Jul 18, 2011, 11:42 AM

Thanks Daniil, this is now working perfectly.

**hemantpatil** · Sep 26, 2013, 12:55 PM

Hi Daniil,

I've same requirement as this thread, in one of my application. what i want to do is, on selection of any value from first combobox, i want to populate filtered data from database to Second combobox.

i've tried one sample but no luck. i m attaching the sample for your reference too.

i m not getting any error while binding filtered data to the Store of Second comboBox, but the data is not getting populated in the second combobox.

i m using Ext.net V2.2 (Latest SVN Build)

ComboBox.aspx

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="ComboBox.aspx.vb" Inherits="ComboBox" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<!DOCTYPE html>

<html>
<head id="Head1" runat="server">
    <title>Linked ComboBoxes - Ext.NET Examples</title>
    <link href="/resources/css/examples.css" rel="stylesheet" />
    <ext:ResourcePlaceHolder ID="ResourcePlaceHolder1" runat="server" Mode="Script" />
</head>
<body>
    <form id="Form1" runat="server">
        <ext:ResourceManager ID="ResourceManager1" runat="server" />                
            <ext:Store ID="Combo2Store" runat="server"  >
                <Model>
                    <ext:Model ID="Model1" runat="server">
                        <Fields>
                            <ext:ModelField Name="CODE" />
                            <ext:ModelField Name="NAME" /> 
                        </Fields>
                    </ext:Model>
                </Model>
            </ext:Store>
        
            <ext:ComboBox ID="ComboBox1" 
                runat="server"
                ValueField="CODE"
                DisplayField="NAME"
                Width="600"
                QueryMode="Local"               
                TypeAhead="true">
                <Store>
                    <ext:Store ID="Combo1Store" runat="server">
                        <Model>
                            <ext:Model ID="Model2" runat="server">
                                <Fields>
                                    <ext:ModelField Name="CODE" />
                                    <ext:ModelField Name="NAME" /> 
                                </Fields>
                            </ext:Model>
                        </Model>
                    </ext:Store>
                </Store>
                <DirectEvents>
                    <Select OnEvent="RefreshCompbobox2" />
                </DirectEvents> 
            </ext:ComboBox>
        
            <ext:ComboBox 
                ID="ComboBox2"
                runat="server" 
                StoreID="Combo2Store"
                Editable="false"
                TypeAhead="true" 
                QueryMode="Local"
                Width="600"
                ForceSelection="true"
                TriggerAction="All"            
                DisplayField="NAME"
                ValueField="CODE"
                EmptyText="Loading..."
                ValueNotFoundText="Loading..."/>
    </form>
</body>
</html>

ComboBox.aspx.vb

Imports Ext.Net

Partial Class LinkedCombo
    Inherits System.Web.UI.Page

    Private ReadOnly Property DeptData() As Object()
        Get
            Return New Object() {New Object() {1, "Dept. 1"}, New Object() {2, "Dept. 2"}, New Object() {3, "Dept. 3"}, New Object() {4, "Dept. 4"}}
        End Get
    End Property

    Private ReadOnly Property NameData() As Object()
        Get
            Return New Object() {New Object() {1, "Hemant"}, New Object() {2, "Rahul"}, New Object() {3, "Vijay"}, New Object() {4, "Pramod"}}
        End Get
    End Property

    <DirectMethod()> _
    Public Sub RefreshCompbobox2()
        Combo2Store = ComboBox2.GetStore
        If Ext.Net.X.IsAjaxRequest Then
            Combo2Store.DataSource = NameData
        End If
        Combo2Store.DataBind()
    End Sub

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        Combo1Store.DataSource = DeptData
        Combo1Store.DataBind()
    End Sub
End Class

**Daniil** · Sep 27, 2013, 3:42 PM

Hi @hemantpatil,

You should define an ArrayReader.

<ext:Store ID="Combo2Store" runat="server">
    <Reader>
        <ext:ArrayReader />
    </Reader>
</ext:Store>

Thread: [CLOSED] Refresh ComboBox after changing Store

Thread Tools

Search Thread

Display

[CLOSED] Refresh ComboBox after changing Store

Similar Threads

combobox expand on store refresh

Changing store runtime for gridpanel

Combobox store refresh on iconclick

Problem with combobox - On store refresh

[CLOSED] Changing color of a combobox label

Posting Permissions

Sitemap

Downloads

Resources

Thread: [CLOSED] Refresh ComboBox after changing Store

[CLOSED] Refresh ComboBox after changing Store

Similar Threads

Posting Permissions

Sitemap

Downloads

Resources

Stay connected with us