What's New?

GridPanel, ComboBox in a column dynamically changing dropdown values depending on the sell contents

  1. #1
    Feb 15, 2012, 4:27 PM

    GridPanel, ComboBox in a column dynamically changing dropdown values depending on the sell contents

    Hi, Is it possible to dynamically change dropdown values in a combobox in a gridpanel, depending on the cell contents?
    I have a combo box that disaplays data from a table. If a column value is empty, I enable a dropdown. I need to be able to display the values from a table in a cell with combo box, but when cell is empty, display different set of values that values in that column.
    Thanks.
  2. #2
    Feb 16, 2012, 2:28 PM
    Hi,

    Please look at this example.
    http://forums.ext.net/showthread.php...ll=1#post73887
  3. #3
    Feb 18, 2012, 9:41 PM
    Thanks, I looked at that example. I don't want to replace the editor. I just need to reset the store source to new values and rebind before the dropdown is expanded. I made the following changes and now when I click the dropdown, the old list shows up first and them the new one.

    I added 
            [DirectMethod]
        public void LoadComboBoxesWithNewAccChoices(string colName)
        {
            BusinessLogic bl = new BusinessLogic();
            if ( colName == "MyId" )
            {
                StoreCombo.DataSource = bl.GetAllNewCBMyId();
                StoreCombo.DataBind();
            }
        }
    In GridPanel I have 
    <Listeners>
        <BeforeEdit Fn="onBeforeEdit" />
    <\Listeners>
    where 
    var onBeforeEdit = function (e) {
            var column = e.grid.getColumnModel().columns[e.column],
                                ed = column.getCellEditor(e.row);
            if (ed && (e.value != -1 && e.value != '' && e.value != undefined)) {
                return false;
            }
            Ext.net.DirectMethods.LoadComboBoxesWithNewAccChoices(column.id);
        }
    Quote Originally Posted by Daniil View Post
    Hi,

    Please look at this example.
    http://forums.ext.net/showthread.php...ll=1#post73887
    Last edited by Daniil; Feb 21, 2012 at 6:28 AM. Reason: Please use [CODE] tags
  4. #4
    Feb 21, 2012, 6:40 AM
    Yes, it was just an example, not exactly that you need. Unfortunately, we have no exact examples for all cases.

    Hope the following suites your requirement.

    Example
    <%@ Page Language="C#" %>
  
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
  
<script runat="server">
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!X.IsAjaxRequest)
        {
            Store store = this.GridPanel1.GetStore();
            store.DataSource = new object[] 
            { 
                new object[] { "id1", "" },
                new object[] { "id2", "" },
                new object[] { "id3", "" },
                new object[] { "id4", "" },
            };
            store.DataBind();
        }
    }
 
    protected void ComboBoxStore_RefreshData(object sender, StoreRefreshDataEventArgs e)
    {
        Store store = sender as Store;
        string id = e.Parameters["id"];
        store.DataSource = new object[] 
        { 
            new object[] { id + "_" + DateTime.Now.Second, "1" },
            new object[] { id + "_" + (DateTime.Now.Second + 1), "2" }
        };
        store.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>
  
    <script type="text/javascript">
        var onBeforeEdit = function (e) {
            var column = e.grid.getColumnModel().columns[e.column];

            if (column.dataIndex === "test") {
                ComboBoxStore.on(
                    "beforeload", 
                    function (store, options) {
                        options.params = {
                            id : e.record.data.id
                        }
                    }, 
                    null,
                    {
                        single : true
                    });
            }
        };
 
        var testRenderer = function (value) {
            var record = ComboBoxStore.getById(value);
 
            if (record) {
                value = record.data.text;
            }
 
            return value;
        };
    </script>
</head>
<body>
    <form runat="server">
        <ext:ResourceManager runat="server" />
        <ext:GridPanel
            ID="GridPanel1"
            runat="server"
            AutoHeight="true"
            Width="200">
            <Store>
                <ext:Store runat="server">
                    <Reader>
                        <ext:ArrayReader>
                            <Fields>
                                <ext:RecordField Name="id" />
                                <ext:RecordField Name="test" />
                            </Fields>
                        </ext:ArrayReader>
                    </Reader>
                </ext:Store>
            </Store>
            <ColumnModel runat="server">
                <Columns>
                    <ext:Column Header="ID" DataIndex="id" />
                    <ext:Column Header="Test" DataIndex="test">
                        <Renderer Fn="testRenderer" />
                        <Editor>
                            <ext:ComboBox runat="server">
                                <Store>
                                    <ext:Store
                                        ID="ComboBoxStore"
                                        runat="server"
                                        OnRefreshData="ComboBoxStore_RefreshData"
                                        AutoLoad="false">
                                        <Proxy>
                                            <ext:PageProxy />
                                        </Proxy>
                                        <Reader>
                                            <ext:ArrayReader IDProperty="value">
                                                <Fields>
                                                    <ext:RecordField Name="text" />
                                                    <ext:RecordField Name="value" />
                                                </Fields>
                                            </ext:ArrayReader>
                                        </Reader>
                                    </ext:Store>
                                </Store>
                                <Listeners>
                                    <BeforeQuery Handler="delete queryEvent.combo.lastQuery;" />
                                </Listeners>
                            </ext:ComboBox>
                        </Editor>
                    </ext:Column>
                </Columns>
            </ColumnModel>
            <Listeners>
                <BeforeEdit Fn="onBeforeEdit" />
            </Listeners>
        </ext:GridPanel>
    </form>
</body>
</html>

Similar Threads

  1. [CLOSED] How to dynamically add either Combobox or DateField to Gridpanel Column Editor from code behind
    By ISI in forum 1.x Legacy Premium Help
    Replies: 14
    Last Post: Aug 18, 2016, 1:57 AM
  2. GridPanel dropdown column show dropdown on single click and expand at the same time
    By jboroda in forum 1.x Help
    Replies: 6
    Last Post: Jan 28, 2012, 1:14 AM
  3. [CLOSED] Change color in ComboBox, depending on values
    By Jurke in forum 1.x Legacy Premium Help
    Replies: 4
    Last Post: Feb 16, 2011, 12:42 PM
  4. [CLOSED] Render gridpanel column depending on value other field store
    By CarWise in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Oct 21, 2010, 2:50 PM
  5. [CLOSED] How to change grid column values dynamically?
    By Etisbew in forum 1.x Legacy Premium Help
    Replies: 11
    Last Post: Oct 19, 2009, 2:49 PM

Tags for this Thread

Posting Permissions