'insertAdjacentHTML is null or not defined' error when trying to tie a Listview on a grid

  1. #1

    'insertAdjacentHTML is null or not defined' error when trying to tie a Listview on a grid

    Hi,

    I was following this sample to make a custom gridview with a listview inside (pretty much like the link) when I got this error. I barely customized the Grid (added a PagingToolbar and added more columns) and I dont know where I may be wrong. Help plz?

    Grid and Store
    <!-- Store para a GridView -->
                    <ext:Store ID="Store1" runat="server">
                        <Reader>
                            <ext:JsonReader IDProperty="iPedido">
                                <Fields>
                                    <ext:RecordField Name="iPedido" />
                                    <ext:RecordField Name="dtEmissao" />
                                    <ext:RecordField Name="vlLiquido" />
                                    <ext:RecordField Name="strNome" />
                                    <ext:RecordField Name="strApelido" />
                                    <ext:RecordField Name="strApelidoRep" />
                                </Fields>
                            </ext:JsonReader>
                        </Reader>
                    </ext:Store>
                    <!-- Aqui termina o Store -->
                    <!-- Aqui vem a Grid  -->
                    <ext:GridPanel ID="gdpPedidos" runat="server" TrackMouseOver="true" Collapsible="true"
                        StoreID="Store1" AnimCollapse="true" Height="500px">
                        <ColumnModel ID="ColumnModel1" runat="server">
                            <Columns>
                                <ext:RowNumbererColumn Header="Seq" />
                                <ext:Column Header="Pedido" DataIndex="iPedido" />
                                <ext:Column Header="Emissão" DataIndex="dtEmissao" />
                                <ext:Column Header="Situação" DataIndex="indiSituacao" />
                                <ext:Column Header="Valor Líquido" DataIndex="vlLiquido" />
                                <ext:Column Header="Nome Fantasia Cliente" DataIndex="strNome" />
                                <ext:Column Header="Apelido Representante" DataIndex="strApelidoRep" />
                                <ext:Column Header="Apelido Vendedor" DataIndex="strApelido" />
                            </Columns>
                        </ColumnModel>
                        <View>
                            <ext:GridView ID="GridView1" runat="server" ForceFit="true">
                                <Listeners>
                                    <BeforeRefresh Fn="clean" />
                                </Listeners>
                            </ext:GridView>
                        </View>
                        <SelectionModel>
                            <ext:RowSelectionModel ID="RowSelectionModel1" runat="server" />
                        </SelectionModel>
                        <BottomBar>
                            <ext:PagingToolbar runat="server" ID="pgnToolbar" PageSize="20">
                            </ext:PagingToolbar>
                        </BottomBar>
                        <Plugins>
                            <ext:RowExpander ID="RowExpander1" runat="server">
                                <Template ID="Template1" runat="server">
                                    <Html>
                                        <div id="row-{ID}" style="background-color: White;"></div>
                                    </Html>
                                </Template>
                                <DirectEvents>
                                    <BeforeExpand OnEvent="BeforeExpand">
                                        <EventMask ShowMask="true" Target="CustomTarget" CustomTarget="={gdpPedidos.body}" />
                                        <ExtraParams>
                                            <ext:Parameter Name="id" Value="record.id" Mode="Raw" />
                                        </ExtraParams>
                                    </BeforeExpand>
                                </DirectEvents>
                            </ext:RowExpander>
                        </Plugins>
                    </ext:GridPanel>
                    <!-- Aqui termina a Grid -->
    My Code-behind

    private void RemoveFromCache(string id)
            {
                ResourceManager1.AddScript("removeFromCache({0});", JSON.Serialize(id));
            }
    
            private void AddToCache(string id)
            {
                ResourceManager1.AddScript("addToCache({0});", JSON.Serialize(id));
            }
    
            protected void BeforeExpand(object sender, DirectEventArgs e)
            {
                string id = e.ExtraParams["id"];
    
                Store store = new Store { ID = "StoreRow_" + id };
    
                JsonReader reader = new JsonReader();
                reader.IDProperty = "ID";
                reader.Fields.Add("ID", "Name");
                store.Reader.Add(reader);
    
                List<object> data = new List<object>();
    
                for (int i = 1; i <= 10; i++)
                {
                    data.Add(new { ID = "P" + i, Name = "Product " + i });
                }
    
                store.DataSource = data;
    
                this.RemoveFromCache(store.ID);
                store.Render();
                this.AddToCache(store.ID);
    
                Ext.Net.ListView list = new Ext.Net.ListView
                {
                    ID = "ListViewRow_" + id,
                    MultiSelect = true,
                    StoreID = "{raw}StoreRow_" + id,
                    Height = 200
                };
    
                list.Columns.AddRange(new ListViewColumn[] { 
                new ListViewColumn {
                    Header = "Products's Name",
                    DataIndex = "Name"
                }
            });
    
                this.RemoveFromCache(list.ID);
                list.Render("row-" + id, RenderMode.RenderTo);
                this.AddToCache(list.ID);
            }
    Thanks for your Attention,
    André Custódio
  2. #2
    Hi,

    I don't see any troubles in your code
    Please post test sample which can be run localy
  3. #3
    Thanks for the quick reply.
    Here's the sample you asked.

    I'm getting the same error in this code (its not the full code because the original one has many db interactions, so I would waste too much time trying to populate dropdownlists that have nothing to do with the error i'm getting -or so I believe-. But if you find it necessary I can send it too).

    Regards,
    André Custódio
    Attached Files
  4. #4
    You have to change template of RowExpander
    You don't have ID field, you have to use iPedido
    <div id="row-{iPedido}" style="background-color: White;"></div>
  5. #5
    Quote Originally Posted by Vladimir View Post
    You have to change template of RowExpander
    You don't have ID field, you have to use iPedido
    <div id="row-{iPedido}" style="background-color: White;"></div>
    It worked! Thanks for the trouble and the quick reply.

    Regards,
    André Custódio

Similar Threads

  1. Replies: 3
    Last Post: Mar 22, 2012, 7:46 AM
  2. Replies: 0
    Last Post: Sep 29, 2011, 4:46 PM
  3. Replies: 7
    Last Post: Aug 12, 2011, 9:39 AM
  4. Replies: 6
    Last Post: Nov 13, 2009, 10:15 PM
  5. 'insertAdjacentHTML' is null or not an object
    By Tbaseflug in forum 1.x Help
    Replies: 6
    Last Post: Jun 29, 2009, 5:00 PM

Posting Permissions