What's New?

[CLOSED] Add a MultiCombo box as a column in a grid panel

  1. #1
    Jun 17, 2014, 4:54 PM

    [CLOSED] Add a MultiCombo box as a column in a grid panel

    Hello,

    I am struggling with the concept of adding a multi combo box as a column in an Ext.Net grid panel. I can add a simple multi combo box, but my requirement here is that every multi combo (separate rows) should have a different store (add separate items).

    My grid should look like this:

    TextField | TextField | CheckBox | CheckBox | MultiCombo
    Rec.UqId | Rec.Name | Rec.Sea | Rec.Adv | Rec.FieldCollection

    And since the FieldCollection for every record will be diff, hence separate store for every multi combo box.

    I have done the first 4 columns, having trouble in he multi combo box column.

    Thanks in advance,
    Ankit
    Last edited by Daniil; Jun 24, 2014 at 2:15 PM. Reason: [CLOSED]
  2. #2
    Jun 17, 2014, 8:48 PM
    Hi @jainanki,

    Do you use a ComponentColumn?
  3. #3
    Jun 17, 2014, 8:52 PM
    Yes, Daniil. I do use a ComponentColumn.
  4. #4
    Jun 17, 2014, 9:03 PM
    This is how my aspx declaration looks like:

    <ColumnModel ID="ColumnModel1" runat="server">
	<Columns>
		<Ext:Column ID="colId" runat="server" DataIndex="LookupId" Visible="false" />
                <Ext:Column ID="colFeatLayerName" runat="server" Text="Feature Layer" DataIndex="LookupDesc" Width="150"/>
                <Ext:CheckColumn ID="colFLSelected" runat="server" Text="Selected" DataIndex="LookupSelected" Width="75" Editable="true"/>
                <Ext:CheckColumn ID="colSearch" runat="server" Text="Search" DataIndex="Search" Width="75" Editable="true"/>
                <Ext:CheckColumn ID="colAdvSearch" runat="server" Text="Advanced Search" DataIndex="AdvSearch" Width="100" Editable="true"/>
                <Ext:ComponentColumn ID="colFields" runat="server" Text="Fields" Width="200">
					<Component>
						<Infra:EpicMultiCombo runat="server" ID="propDataSourceMultiCombo"/>
					</Component>
		</Ext:ComponentColumn>
        </Columns>
</ColumnModel>
    And this is what I am doing to link the data source for the grid:

             this.sliderStore.DataSource = _propertyValues;
        this.sliderStore.DataBind();
  5. #5
    Jun 18, 2014, 9:19 AM
    You can configure a ComponentColumn's Component in its BeforeBind listener. Please look at the example.

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

<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[] { "test", "test" },
                new object[] { "test", "test" },
                new object[] { "test", "test" }
            };
        }
    }
</script>

<!DOCTYPE html>

<html>
<head runat="server">
    <title>Ext.NET v2 Example</title>

    <script>
        var onBeforeBind = function(column, e) { // "e" contains "config", "grid", "record", "rowIndex".
            e.config = {
                xtype: "netmulticombo",
                queryMode: "local",
                displayField: "text",
                store: {                     
                    /* configure a store as needed */ 
                    model: Ext.define("Model" + e.rowIndex, {
                        extend: "Ext.data.Model",
                        fields: [ "text" ]
                    }),
                    data: [{
                        text: "Item1"
                    }, {
                        text: "Item2"
                    }]
                }
            };
        };
    </script>
</head>
<body>
    <form runat="server">
        <ext:ResourceManager runat="server" />

        <ext:GridPanel ID="GridPanel1" runat="server">
            <Store>
                <ext:Store runat="server">
                    <Model>
                        <ext:Model runat="server">
                            <Fields>
                                <ext:ModelField Name="test1" />
                                <ext:ModelField Name="test2" />
                            </Fields>
                        </ext:Model>
                    </Model>
                </ext:Store>
            </Store>
            <ColumnModel runat="server">
                <Columns>
                    <ext:Column runat="server" Text="Test 1" DataIndex="test1" />
                    <ext:Column runat="server" Text="Test 2" DataIndex="test2" />
                    <ext:ComponentColumn
                        runat="server"
                        Text="MultiCombo"
                        Editor="true">
                        <Listeners>
                            <BeforeBind Fn="onBeforeBind" />
                        </Listeners>
                    </ext:ComponentColumn>
                </Columns>
            </ColumnModel>
        </ext:GridPanel>
    </form>
</body>
</html>

Similar Threads

  1. Checkbox Column in Grid Panel
    By Rajesh in forum 2.x Help
    Replies: 2
    Last Post: Dec 26, 2012, 11:21 AM
  2. Grid Panel Summary Column
    By Mina in forum 1.x Help
    Replies: 3
    Last Post: Jan 02, 2012, 9:03 AM
  3. [CLOSED] Enable/disable checkbox column in grid panel (grid using editablegrid plugin)
    By AnulekhaK in forum 1.x Legacy Premium Help
    Replies: 5
    Last Post: Dec 26, 2011, 5:39 AM
  4. How to save grid panel layout (save column order, column positions etc.) ?
    By teo80 in forum 1.x Help
    Replies: 1
    Last Post: Jul 27, 2011, 10:19 AM
  5. [CLOSED] switch column data within a grid panel using grid header filters
    By rnachman in forum 1.x Legacy Premium Help
    Replies: 16
    Last Post: Feb 23, 2011, 10:03 AM

Tags for this Thread

Posting Permissions