What's New?

[CLOSED] GridView cell editor with custom controls?

Hybrid View

Previous Post Previous Post   Next Post Next Post
  1. #1
    Oct 26, 2012, 5:45 PM

    [CLOSED] GridView cell editor with custom controls?

    Hi,

    I'm looking at the example at https://examples1.ext.net/#/GridPane..._DirectMethod/. My requirement is to present a custom control, e.g. a little form to edit the address, when the user starts editing a GridView cell value. I'm curious what would be the best way to achieve it if it's at all possible. Ideally, this control should appear beside the cell being edited just like a date time picker does in the example. Please let me know if more info is needed.
    Last edited by Daniil; Nov 08, 2012 at 8:29 AM. Reason: [CLOSED]
  2. #2
    Oct 26, 2012, 6:35 PM
    Hi Vadym,

    Maybe, a DropDownField as an Editor? And expand it on start editing.
  3. #3
    Oct 26, 2012, 7:23 PM
    Quote Originally Posted by Daniil View Post
    Hi Vadym,

    Maybe, a DropDownField as an Editor? And expand it on start editing.
    Hi Daniil,

    Thanks for your response! Could you provide a link to an example to look at please?

    Edit in: I believe this thread has a couple of DropDownField examples. I'm trying to locate an example dealing with a GridView.

    http://forums.ext.net/showthread.php...xt-net-control
  4. #4
    Oct 29, 2012, 8:40 AM
    I was also unable to to find an example and wrote this simple one.

    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)
        {
            this.Store1.DataSource = new object[] 
            { 
                new object[] { "test1" },
                new object[] { "test2" },
                new object[] { "test3" }
            };
            this.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:Store ID="Store1" runat="server">
            <Reader>
                <ext:ArrayReader>
                    <Fields>
                        <ext:RecordField Name="test" />
                    </Fields>
                </ext:ArrayReader>
            </Reader>
        </ext:Store>

        <ext:GridPanel runat="server" StoreID="Store1" AutoHeight="true">
            <ColumnModel runat="server">
                <Columns>
                    <ext:Column Header="Test" DataIndex="test" Width="200">
                        <Editor>
                            <ext:DropDownField runat="server">
                                <Component>
                                    <ext:GridPanel runat="server" StoreID="Store1" AutoHeight="true">
                                        <ColumnModel runat="server">
                                            <Columns>
                                                <ext:Column Header="Test" DataIndex="test" />
                                                <ext:CommandColumn Width="25">
                                                    <Commands>
                                                        <ext:GridCommand Icon="Accept" CommandName="Pick" />
                                                    </Commands>
                                                </ext:CommandColumn>
                                            </Columns>
                                        </ColumnModel>
                                        <Listeners>
                                            <Command Handler="this.dropDownField.setValue(record.data.test);" />
                                        </Listeners>
                                    </ext:GridPanel>
                                </Component>
                            </ext:DropDownField>
                        </Editor>
                    </ext:Column>
                </Columns>
            </ColumnModel>
        </ext:GridPanel>
    </form>
</body>
</html>
  5. #5
    Oct 29, 2012, 1:00 PM
    Thanks for the example Daniil! Is it possible to attach different DropDownField editor controls to different rows in runtime? I have a requirement whereby the user is presented with an editable vertical list of attributes of different types. For example, there's a Data of Birth attribute whose value is obviously of DateTime type, or email address of String type. Then, there're more complex attributes like Phone Number with area code and extension or Mailing Address with multiple fields.
    The attribute type becomes known when the GridPanel is populated from the Store.

    Please advise if this kind of functionality is attainable.
  6. #6
    Oct 29, 2012, 6:30 PM
    I think it is possible.

    Please look at this example.
    http://forums.ext.net/showthread.php...ll=1#post73887

Similar Threads

  1. [CLOSED] Cell editing with complex editor
    By Leonid_Veriga in forum 2.x Legacy Premium Help
    Replies: 3
    Last Post: Sep 21, 2012, 5:21 PM
  2. v2.0 Gridview Cell Conditional formatting
    By pyro in forum 2.x Help
    Replies: 5
    Last Post: Mar 27, 2012, 2:11 PM
  3. [CLOSED] How to Loop through each headercolumn editor in gridview clientside
    By KorsG in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Nov 12, 2010, 7:17 PM
  4. [CLOSED] [1.0] Gridview Editor Column handler
    By ljankowski in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Jan 27, 2010, 7:49 AM
  5. Editor cell shapeShifter
    By BrunoC in forum 1.x Help
    Replies: 1
    Last Post: Apr 24, 2009, 5:25 AM

Tags for this Thread

Posting Permissions