[CLOSED] UpdatePanel and SelectionModel

**Timothy** · Sep 28, 2008, 1:37 PM

Hello,

I've found a problem with the SelectionModel and remembering between postbacks (fixed in this URL: http://forums.ext.net/showthread.php...2186-16-1.aspx) while looking for a bigger problem I'm having with the UpdatePanel.

Example.aspx:

<%@ Page Language="C#" %>
<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
    protected override void OnInit(EventArgs e)
    {
        Control control = Page.LoadControl("Example-Control.ascx");

        UserControl.Controls.Add(control);
        
        base.OnInit(e);
    }
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>Example</title>
</head>
<body>
    <p><a href="Example.aspx">Reload</a></p>
    <form id="form1" runat="server">
        <asp:ScriptManager runat="server" EnablePartialRendering="True" />
        <ext:ScriptManager runat="server" StateProvider="PostBack" />
        <asp:UpdatePanel runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                <asp:PlaceHolder ID="UserControl" runat="server" />
            </ContentTemplate>
        </asp:UpdatePanel>
    </form>
</body>
</html>

Example-Control.ascx:

<%@ Control Language="C#" ClassName="Example_Control" %>
<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
<script runat="server">
    protected void Page_Load(object sender, EventArgs e)
    {
        Permissions.DataSource = new object[] {
            new object[] { 1, "Permission", "Permission 1" },
            new object[] { 2, "Permission", "Permission 2" },
            new object[] { 3, "Permission", "Permission 3" },
            new object[] { 4, "Permission", "Permission 4" },
            new object[] { 5, "Permission", "Permission 5" },
            new object[] { 6, "Permission", "Permission 6" }
        };
        Permissions.DataBind();
    }
</script>
<ext:Store ID="Permissions"
    runat="server"
    AutoLoad="True"
    GroupField="GroupingName">
    <Reader>
        <ext:ArrayReader ReaderID="PermissionId">
            <Fields>
                <ext:RecordField Name="PermissionId" />
                <ext:RecordField Name="GroupingName" />
                <ext:RecordField Name="DisplayName" />
            </Fields>
        </ext:ArrayReader>
    </Reader>
    <SortInfo Field="DisplayName" />
</ext:Store>
<ext:TabPanel ID="TabPanel1" runat="server" AutoPostBack="True" DeferredRender="True">
    <Tabs>
        <ext:Tab ID="Tab1" runat="server" Title="Tab 1" AutoHeight="True">
            <Content>
                Tab 1
            </Content>
        </ext:Tab>
        <ext:Tab ID="Tab2" runat="server" Title="Tab 2" AutoHeight="True">
            <Content>
                <ext:GridPanel ID="GridPanel"
                    runat="server"
                    StoreID="Permissions"
                    AutoExpandColumn="DisplayName"
                    AutoHeight="True"
                    StripeRows="True"
                    Width="300">
                    <ColumnModel>
                        <Columns>
                            <ext:Column ColumnID="GroupingName" DataIndex="GroupingName" Header="Group" />
                            <ext:Column ColumnID="DisplayName" DataIndex="DisplayName" Header="Permission" />
                        </Columns>
                    </ColumnModel>
                    <SelectionModel>
                        <ext:CheckboxSelectionModel ID="PermissionSelection" runat="server" />
                    </SelectionModel>
                </ext:GridPanel>
                Tab 2
            </Content>
        </ext:Tab>
    </Tabs>
</ext:TabPanel>

Replication steps:

1. Load page, click Tab 2
2. Check a row
3. Switch to Tab 1
4. Switch back to Tab 2
5. The selection was forgotten

6. Now remove the update panel, repeat steps 1 to 5 and it works

Cheers,
Timothy

**Vladimir** · Sep 28, 2008, 2:40 PM

Hi Timothy,

I didn't test your example but it seems that you call DataBind on every request (even on async). Try to add to Page_Load Async postback checking (after every DataBinding the selection will be lost)

Please let me know if it is not working for you

**Timothy** · Sep 28, 2008, 2:46 PM

Thanks vlad, still fails with:

Example-Control.ascx

<script runat="server">
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!Page.IsAsync)
        {
            Permissions.DataSource = new object[] {
                new object[] { 1, "Permission", "Permission 1" },
                new object[] { 2, "Permission", "Permission 2" },
                new object[] { 3, "Permission", "Permission 3" },
                new object[] { 4, "Permission", "Permission 4" },
                new object[] { 5, "Permission", "Permission 5" },
                new object[] { 6, "Permission", "Permission 6" }
            };
            Permissions.DataBind();
        }
    }
</script>

Cheers,
Timothy

**Timothy** · Sep 28, 2008, 2:47 PM

Also fails with:

<script runat="server">
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!Ext.IsMicrosoftAjaxRequest)
        {
            Permissions.DataSource = new object[] {
                new object[] { 1, "Permission", "Permission 1" },
                new object[] { 2, "Permission", "Permission 2" },
                new object[] { 3, "Permission", "Permission 3" },
                new object[] { 4, "Permission", "Permission 4" },
                new object[] { 5, "Permission", "Permission 5" },
                new object[] { 6, "Permission", "Permission 6" }
            };
            Permissions.DataBind();
        }
    }
</script>

Timothy

**Vladimir** · Sep 28, 2008, 4:32 PM

The fix in SVN

**Timothy** · Sep 28, 2008, 6:34 PM

Thanks, so what is the proper way to handle this solution? You said I was databinding on each page load, can you give me an alternate recommended solution?

**Timothy** · Sep 29, 2008, 9:36 AM

This example appears to also fail with the SelectionModel:

Example.aspx:

<%@ Page Language="C#" %>
<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
    protected override void OnInit(EventArgs e)
    {
        Control control = Page.LoadControl("Example-Control.ascx");

        UserControl.Controls.Add(control);
        
        base.OnInit(e);
    }
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>Example</title>
</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="True" />
        <ext:ScriptManager ID="ScriptManager2" runat="server" StateProvider="PostBack" />
        <ext:ViewPort ID="ViewPort1" runat="server" Stateful="True">
            <Content>
                <ext:BorderLayout ID="BorderLayout1" runat="server" RenderHidden="True">
                    <North Collapsible="True" Split="True">
                        <ext:Panel ID="North" runat="server" Border="False" Height="173px">
                            <Content>
                                <p><a href="Example.aspx">Reload</a></p>
                            </Content>
                        </ext:Panel>
                    </North>
                    <West Split="True">
                        <ext:Panel ID="West" runat="server" Title="Menu" Width="300">
                            <Content>
                                West
                            </Content>
                        </ext:Panel>
                    </West>
                    <Center Split="True">
                        <ext:Panel ID="Center" runat="server" Border="False">
                            <Content>
                                <ext:Panel ID="pnlControl" runat="server" AutoScroll="True">
                                    <Content>
                                        <asp:UpdatePanel ID="UpdatePanel" runat="server" UpdateMode="Conditional">
                                            <ContentTemplate>
                                                <asp:PlaceHolder ID="UserControl" runat="server" />
                                            </ContentTemplate>
                                        </asp:UpdatePanel>
                                    </Content>
                                </ext:Panel>
                            </Content>
                        </ext:Panel>
                    </Center>
                </ext:BorderLayout>
            </Content>
        </ext:ViewPort>
    </form>
</body>
</html>

Example-Control.ascx:

<%@ Control Language="C#" ClassName="Example_Control" %>
<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
<script runat="server">
    protected void Page_Load(object sender, EventArgs e)
    {
        Permissions.DataSource = new object[] {
            new object[] { 1, "Permission", "Permission 1" },
            new object[] { 2, "Permission", "Permission 2" },
            new object[] { 3, "Permission", "Permission 3" },
            new object[] { 4, "Permission", "Permission 4" },
            new object[] { 5, "Permission", "Permission 5" },
            new object[] { 6, "Permission", "Permission 6" }
        };
        Permissions.DataBind();
    }
</script>
<ext:Store ID="Permissions"
    runat="server"
    AutoLoad="True"
    GroupField="GroupingName">
    <Reader>
        <ext:ArrayReader ReaderID="PermissionId">
            <Fields>
                <ext:RecordField Name="PermissionId" />
                <ext:RecordField Name="GroupingName" />
                <ext:RecordField Name="DisplayName" />
            </Fields>
        </ext:ArrayReader>
    </Reader>
    <SortInfo Field="DisplayName" />
</ext:Store>
<ext:TabPanel ID="TabPanel1" runat="server" AutoPostBack="True" DeferredRender="True">
    <Tabs>
        <ext:Tab ID="Tab1" runat="server" Title="Tab 1" AutoHeight="True">
            <Content>
                Tab 1
            </Content>
        </ext:Tab>
        <ext:Tab ID="Tab2" runat="server" Title="Tab 2" AutoHeight="True">
            <Content>
                <ext:FitLayout runat="server">
                <ext:GridPanel ID="GridPanel"
                    runat="server"
                    StoreID="Permissions"
                    AutoExpandColumn="DisplayName"
                    Height="400"
                    StripeRows="True"
                    Width="300">
                    <ColumnModel>
                        <Columns>
                            <ext:Column ColumnID="GroupingName" DataIndex="GroupingName" Header="Group" />
                            <ext:Column ColumnID="DisplayName" DataIndex="DisplayName" Header="Permission" />
                        </Columns>
                    </ColumnModel>
                    <SelectionModel>
                        <ext:CheckboxSelectionModel ID="PermissionSelection" runat="server" />
                    </SelectionModel>
                </ext:GridPanel>
                </ext:FitLayout>
            </Content>
        </ext:Tab>
    </Tabs>
</ext:TabPanel>

Replication steps:

1. Load page
2. Click on Tab 2
3. Select any row (multiple if you like)
4. Switch to Tab 1
5. Switch back to Tab 2

Cheers,
Timothy

**geoffrey.mcgill** · Sep 30, 2008, 2:22 PM

You said I was databinding on each page load, can you give me an alternate recommended solution?

I think because you are using DeferredRender on the TabPanel, you probably only need to DataBind when the ActiveTab is the Tab with the GridPanel. That way, you will not be running the DataBinding on every Page_Load.*

Hope this helps.

**geoffrey.mcgill** · Sep 30, 2008, 2:23 PM

Hi Timothy,

Please svn update. I have confirmed that the latest sample you posted above is working with the latest code.

**geoffrey.mcgill** · Sep 30, 2008, 2:27 PM

oops... one moment... I need to change something in your code sample. I will repost shortly.

Thread: [CLOSED] UpdatePanel and SelectionModel

Thread Tools

Search Thread

Display

[CLOSED] UpdatePanel and SelectionModel

RE: [CLOSED] UpdatePanel and SelectionModel

RE: [CLOSED] UpdatePanel and SelectionModel

RE: [CLOSED] UpdatePanel and SelectionModel

RE: [CLOSED] UpdatePanel and SelectionModel

RE: [CLOSED] UpdatePanel and SelectionModel

RE: [CLOSED] UpdatePanel and SelectionModel

RE: [CLOSED] UpdatePanel and SelectionModel

RE: [CLOSED] UpdatePanel and SelectionModel

RE: [CLOSED] UpdatePanel and SelectionModel

Similar Threads

SelectionModel with end row

[CLOSED] GridPanel: selectionModel

[CLOSED] GridPanel and SelectionModel

[CLOSED] Can SelectionModel have two model

[CLOSED] GridPanel SelectionModel

Posting Permissions

Sitemap

Downloads

Resources

Thread: [CLOSED] UpdatePanel and SelectionModel

[CLOSED] UpdatePanel and SelectionModel

RE: [CLOSED] UpdatePanel and SelectionModel

RE: [CLOSED] UpdatePanel and SelectionModel

RE: [CLOSED] UpdatePanel and SelectionModel

RE: [CLOSED] UpdatePanel and SelectionModel

RE: [CLOSED] UpdatePanel and SelectionModel

RE: [CLOSED] UpdatePanel and SelectionModel

RE: [CLOSED] UpdatePanel and SelectionModel

RE: [CLOSED] UpdatePanel and SelectionModel

RE: [CLOSED] UpdatePanel and SelectionModel

Similar Threads

Posting Permissions

Sitemap

Downloads

Resources

Stay connected with us