GridView events w/ UpdatePanel and Coolite TabPanel v0.51

  1. #1

    GridView events w/ UpdatePanel and Coolite TabPanel v0.51

    Dear Coolite team,

    Last week I was investigatigating another issue. For some reason, the GridView RowCommand event seems not to be firing in my project when I simply change the old Coolite TabPanel v0.4.1 for the new one v0.5.1.


    I am posting the code here, but sorry if I haven't got enough info to explain, but unfortunatelly I could not reproduce the issue in a simple scenario. May be some conflict with UpdatePanel I guess.

    Obviously is very hard to find a error if you cannot reproduce it, but what I am expecting here is to see if you fellas can me point some clue to why it may be happening.

    My project is pretty much like the one I posted here. Both my grid and the tabpanel are inside the update panel. When a row in the grid is clicked it does a roundtrip through the server via callback.
    It is working absolutely fine with Coolite v.041 and I spent a lot of time to make sure of it. At the end, I could noticed that just by replacing the the TabPanel 0.41 to the TabPanel 0.51 the roundtrip continues working but the event RowCommand is not firing.
    I ended up giving up and continuing using the old one, but obviously it bangs in my head what would be the problem here.

    Unfortunatelly I can't send you the project exactly as it is, and I could not reproduce the error as I said. Maybe because I haven't setup the old coolite in my test project at all.

    Any help would be very appreciated. Believe me I spent a long time trying to solve it before post this thread.

    Any clue? Anything I can try?

    Best regards,

    Leonardo.

    <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Always">
    <ContentTemplate>
    <asp:GridView ID="GridView1" runat="server" OnRowCommand="GridView1_RowCommand" DataKeyNames="id,a">
        <Columns>
            <asp:TemplateField ItemStyle-Width="2%">
                <ItemTemplate>
                    <asp:Button ID="imgEdit" runat="server" CommandName="Select" Text="Select" ImageUrl="~/images/edit.gif" CommandArgument='<%# Bind("id") %>' ToolTip="Select" CausesValidation="false" />
                </ItemTemplate>
            </asp:TemplateField>
        </Columns>
    </asp:GridView>
    
    <ext:TabPanel ID="TabPanel2" runat="server" ActiveTab="0" Title="TabPanel2">
        <Tabs>
            <ext:Tab ID="TabDetails" runat="server" Title="Details" IconCls="tabs">
                <Content>
                    <table width="100%">
                        <tr>
                            <td style="width: 5%">
                            </td>
                            <td>
                                <asp:DetailsView ID="DetailsView1" runat="server" Height="50px" Width="125px">
                                </asp:DetailsView>
                            </td>
                            <td style="width: 5%">
                            </td>
                        </tr>
                    </table>
                </Content>
            </ext:Tab>
            <ext:Tab ID="Tab1" runat="server" Title="Tab1" AutoScroll="true">
                <Content>
                    Tab1
                </Content>
            </ext:Tab>
            <ext:Tab ID="Tab2" runat="server" Title="Tab2">
                <Content>
                    Tab2
                </Content>
            </ext:Tab>
            <ext:Tab ID="Tab3" runat="server" Title="Tab3">
                <Content>
                    Tab3
                </Content>
            </ext:Tab>
            <ext:Tab ID="Tab4" runat="server" Title="Tab4" AutoScroll="true">
                <Content>
                    Tab4
                </Content>
            </ext:Tab>
        </Tabs>
    </ext:TabPanel>
    
            </ContentTemplate>
        </asp:UpdatePanel>
    protected void Page_Load(object sender, EventArgs e)
    {
        DataTable dt = new DataTable();
        dt.Columns.Add("id", typeof(int));
        dt.Columns.Add("a", typeof(string));
        dt.Columns.Add("b", typeof(string));
        dt.Columns.Add("c", typeof(bool));
        dt.Columns.Add("d", typeof(int));
        dt.Columns.Add("e", typeof(float));
        dt.Columns.Add("f", typeof(decimal));
        dt.PrimaryKey = new DataColumn[] { dt.Columns["id"] };
        for (int i = 1; i < 10; ++i)
        {
            dt.Rows.Add(new object[] { i, "a" + i, "b" + (10 - i), i % 2 == 0, i * 2, i * 1.14159, i * 3.14 });
        }
        GridView1.DataSource = dt;
        GridView1.DataBind();
    }
    Last edited by geoffrey.mcgill; Feb 21, 2011 at 7:47 PM.
  2. #2

    RE: GridView events w/ UpdatePanel and Coolite TabPanel v0.51

    Hi Leonardo,

    When I remove all the Coolite controls from your sample page, then click the "Select" button, I get a 500 error when inspecting with FireBug.

    Here's the full response from the error.

    505|error|500|Invalid postback or callback argument.  Event validation is enabled using <pages enableEventValidation="true"/> in configuration or <%@ Page EnableEventValidation="true" %> in a page.  For security purposes, this feature verifies that arguments to postback or callback events originate from the server control that originally rendered them.  If the data is valid and expected, use the ClientScriptManager.RegisterForEventValidation method in order to register the postback or callback data for validation.|
    Here's the full code sample I was testing with.

    Example

    <%@ Page Language="C#" %>
    <%@ Import Namespace="System.Data" %>
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" 
        "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
        {
            DataTable dt = new DataTable();
            dt.Columns.Add("id", typeof(int));
            dt.Columns.Add("a", typeof(string));
            dt.Columns.Add("b", typeof(string));
            dt.Columns.Add("c", typeof(bool));
            dt.Columns.Add("d", typeof(int));
            dt.Columns.Add("e", typeof(float));
            dt.Columns.Add("f", typeof(decimal));
            dt.PrimaryKey = new DataColumn[] { dt.Columns["id"] };
            for (int i = 1; i < 10; ++i)
            {
                dt.Rows.Add(new object[] { i, "a" + i, "b" + (10 - i), i % 2 == 0, i * 2, i * 1.14159, i * 3.14 });
            }
            GridView1.DataSource = dt;
            GridView1.DataBind();
        }
    
        protected void GridView1_RowCommand(object sender, GridViewCommandEventArgs e)
        {
            // do something...
        }
    </script>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head id="Head1" runat="server">
        <title>RowCommand</title>
    </head>
    <body>
        <p><a href="RowCommand.aspx">Reload</a></p>
        <form id="form1" runat="server">
        
        <asp:ScriptManager ID="ScriptManager2" LoadScriptsBeforeUI="true" runat="server" />
        
        <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Always">
            <ContentTemplate>
                <asp:GridView ID="GridView1" runat="server" OnRowCommand="GridView1_RowCommand" DataKeyNames="id,a">
                    <Columns>
                        <asp:TemplateField ItemStyle-Width="2%">
                            <ItemTemplate>
                                <asp:Button 
                                    ID="imgEdit" 
                                    runat="server" 
                                    CommandName="Select" 
                                    Text="Select" 
                                    ImageUrl="~/images/edit.gif" 
                                    CommandArgument='<%# Bind("id") %>' 
                                    ToolTip="Select" 
                                    CausesValidation="false" 
                                    />
                            </ItemTemplate>
                        </asp:TemplateField>
                    </Columns>
                </asp:GridView>
               
                <asp:DetailsView ID="DetailsView1" runat="server" Height="50px" Width="125px">
                </asp:DetailsView>
                                        
            </ContentTemplate>
        </asp:UpdatePanel>
                                            
        </form>
    </body>
    </html>
    Geoffrey McGill
    Founder
  3. #3

    RE: GridView events w/ UpdatePanel and Coolite TabPanel v0.51



    Hi Geoffrey McGill,

    Thanks for your anwser. Actually this thread is the priority for me at the moment.
    Sorry about the code not been working. I simplified the example and put it in a single-file.
    The reason I sent the code is just to explain the scenario, but as I said before, here what I need works fine.
    In my real project the only difference I could see is that I have there both version of Coolite setup in the same project. v0.41 &amp; v0.51.

    On that project I migrating from 0.41 to the new version. For some reason, the GridView RowCommand event seems not to be firing in my project when I simply change the old Coolite TabPanel v0.4.1 for the new one v0.5.1.

    I was wondering if have you found any problems with updatepanel and the new tabpanel version? Or do you believe that may be some incompatibility with both versions in the same project. I don't know.. it all very weird.

    Any clue, any tip I could use to investigate would be very appreciated.

    Best regards,

    Leonardo.

    <%@ Page Language="C#" %>
    
    
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
        {
            System.Data.DataTable dt = new System.Data.DataTable();
            dt.Columns.Add("id", typeof(int));
            dt.Columns.Add("a", typeof(string));
            dt.Columns.Add("b", typeof(string));
            dt.Columns.Add("c", typeof(bool));
            dt.Columns.Add("d", typeof(int));
            dt.Columns.Add("e", typeof(float));
            dt.Columns.Add("f", typeof(decimal));
            dt.PrimaryKey = new System.Data.DataColumn[] { dt.Columns["id"] };
    
    
            for (int i = 1; i < 10; ++i)
            {
                dt.Rows.Add(new object[] { i, "a" + i, "b" + (10 - i), i % 2 == 0, i * 2, i * 1.14159, i * 3.14 });
            }
    
    
            GridView1.DataSource = dt;
    
    
            GridView1.DataBind();
    
    
            ChangeTrStyle(false);
        }
    
    
        private void ChangeTrStyle(Boolean type)
        {
            if (type)
            {
                trList.Visible = false;
                trDetail.Visible = true;
            }
            else
            {
                trList.Visible = true;
                trDetail.Visible = false;
            }
        }
    
    
        protected void GridView1_RowCommand(object sender, GridViewCommandEventArgs e)
        {
            if (e.CommandName.Trim().Equals("Select"))
            {
                GridViewRow row = (GridViewRow)((Control)e.CommandSource).NamingContainer;
                this.Label2.Text = "id: " + GridView1.DataKeys[row.RowIndex].Values["id"].ToString();
                this.lblDescription.Text = "Description: " + GridView1.DataKeys[row.RowIndex].Values["a"].ToString();
    
    
                ChangeTrStyle(true);
            }
        }  
    </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 id="Head1" runat="server">
        <title>RowCommand is not been fired</title>
        <style type="text/css">
            .auto-width-tab-strip ul.x-tab-strip
            {
                width: auto;
            }
        </style>
    </head>
    <body>
        <form id="form1" runat="server">
        
            <ext:ScriptManager ID="ScriptManager2" runat="server">
            </ext:ScriptManager>
            <asp:ScriptManager ID="ScriptManager1" runat="server">
            </asp:ScriptManager>
            <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Always">
                <ContentTemplate>
                    <table width="100%" cellpadding="0" cellspacing="0">
                        <tr runat="server" id="trList" visible="false">
                            <td>
                                <table width="100%">
                                    <tr>
                                        <td>
                                            <table width="100%">
                                                <tr>
                                                    <td>
                                                        <h2>
                                                            List</h2>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>
                                                        <asp:GridView ID="GridView1" runat="server" OnRowCommand="GridView1_RowCommand" DataKeyNames="id,a">
                                                            <Columns>
                                                                <asp:TemplateField ItemStyle-Width="2%">
                                                                    <ItemTemplate>
                                                                        <asp:Button ID="imgEdit" runat="server" CommandName="Select" Text="Select" ImageUrl="~/images/edit.gif"
                                                                            CommandArgument='<%# Bind("id") %>' ToolTip="Select" CausesValidation="false" /></ItemTemplate>
                                                                </asp:TemplateField>
                                                            </Columns>
                                                        </asp:GridView>
                                                    </td>
                                                </tr>
                                            </table>
                                        </td>
                                    </tr>
                                </table>
                            </td>
                        </tr>
                        <tr id="trDetail" runat="server" visible="true">
                            <td>
                                <table width="100%">
                                    <tr>
                                        <td>
                                            <h2>
                                                Information</h2>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td valign="top">
                                            <ext:TabPanel ID="TabPanel2" runat="server" Cls="auto-width-tab-strip" ActiveTab="0"
                                                Title="TabPanel2">
                                                <Tabs>
                                                    <ext:Tab ID="TabDetails" runat="server" Title="Details" IconCls="tabs">
                                                        <Content>
                                                            <table width="100%">
                                                                <tr>
                                                                    <td width="7%">
                                                                    </td>
                                                                    <td width="30%">
                                                                        <asp:Label ID="Label2" runat="server"></asp:Label>
                                                                    </td>
                                                                    <td width="7%">
                                                                    </td>
                                                                    <td>
                                                                        <asp:Label ID="lblDescription" runat="server"></asp:Label>
                                                                    </td>
                                                                </tr>
                                                            </table>
                                                        </Content>
                                                    </ext:Tab>
                                                    <ext:Tab ID="Tab1" runat="server" Title="Tab1" AutoScroll="true">
                                                        <Content>
                                                            Tab1
                                                        </Content>
                                                    </ext:Tab>
                                                    <ext:Tab ID="Tab2" runat="server" Title="Tab2">
                                                        <Content>
                                                            Tab2
                                                        </Content>
                                                    </ext:Tab>
                                                    <ext:Tab ID="Tab3" runat="server" Title="Tab3">
                                                        <Content>
                                                            Tab3
                                                        </Content>
                                                    </ext:Tab>
                                                    <ext:Tab ID="Tab4" runat="server" Title="Tab4" AutoScroll="true">
                                                        <Content>
                                                            Tab4
                                                        </Content>
                                                    </ext:Tab>
                                                </Tabs>
                                            </ext:TabPanel>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td align="center">
                                            <asp:Button ID="btnBack" runat="server" Text="Back" CausesValidation="false" />
                                        </td>
                                    </tr>
                                </table>
                            </td>
                        </tr>
                    </table>
                </ContentTemplate>
            </asp:UpdatePanel>
        
    
        </form>
    </body>
    </html>
  4. #4

    RE: GridView events w/ UpdatePanel and Coolite TabPanel v0.51

    Hi Leonardo,

    I pasted your sample and uploaded to the sandbox. It appears to be working fine?

    You might also want to check that you are using the latest ASP.NET AJAX code. I know a couple others fixed UpdatePanel problems by installing the latest ASP.NET AJAX build. The following forum post might be helpful.

    http://forums.ext.net/showthread.php?83#post348
    Last edited by geoffrey.mcgill; Feb 21, 2011 at 7:49 PM.
    Geoffrey McGill
    Founder
  5. #5

    RE: GridView events w/ UpdatePanel and Coolite TabPanel v0.51



    Hi Geoffrey McGill,

    Yes, I confirm the sample I sent you was working fine.
    It was just to explain the scenario.

    Ok, I narrowed down the problem as much as I could.

    The problem: GridView RowCommand event is not fired.

    When:
    1 - Using Coolite v0.51.
    2 - Using GridView DataSourceID property to bind it.

    The problem does not happen:
    1 - Using Coolite v0.41
    2 - Using GridView DataSourceID property to bind it.
    3 - Using the new v0.51, but using DataSource property (exactly the example I sent you before and you could see that works).

    To show both scenarios I am sending the code using a ObjectDataSource, but it happens doesn't matter the Datasource you use. I tried with CSLADataSource and SqlDatasource.
    To demonstrate this I have to create a class to use with objectdatasource and I don't know if is possible put it in a single-file. So, could you please just copy the class source to an file called DataSource.cs.

    Please, note that the code is exactly the same, apart for the Coolite dlls I am using.

    Code 1 (does NOT work - using Coolite v0.5.1):

    <%@ Page Language="C#" %>
    <%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
    
    
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
        {
            ChangeTrStyle(false);
        }
    
    
        private void ChangeTrStyle(Boolean type)
        {
            if (type)
            {
                trList.Visible = false;
                trDetail.Visible = true;
            }
            else
            {
                trList.Visible = true;
                trDetail.Visible = false;
            }
        }
    
    
        protected void GridView1_RowCommand(object sender, GridViewCommandEventArgs e)
        {
            if (e.CommandName.Trim().Equals("Select"))
            {
                GridViewRow row = (GridViewRow)((Control)e.CommandSource).NamingContainer;
                this.Label2.Text = "id: " + GridView1.DataKeys[row.RowIndex].Values["id"].ToString();
                this.lblDescription.Text = "Description: " + GridView1.DataKeys[row.RowIndex].Values["a"].ToString();
    
    
                ChangeTrStyle(true);
            }
        }
    </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 id="Head1" runat="server">
        <script type="text/C#" language="cs" runat="server" src= "DataSource.cs"/>
        <title>RowCommand is not been fired</title>
        <style type="text/css">
            .auto-width-tab-strip ul.x-tab-strip
            {
                width: auto;
            }
        </style>
    </head>
    <body>
        <form id="form1" runat="server">
        
            <ext:ScriptManager ID="ScriptManager2" runat="server">
            </ext:ScriptManager>
            <asp:ScriptManager ID="ScriptManager1" runat="server">
            </asp:ScriptManager>
            <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Always">
                <ContentTemplate>
                    <table width="100%" cellpadding="0" cellspacing="0">
                        <tr runat="server" id="trList" visible="false">
                            <td>
                                <table width="100%">
                                    <tr>
                                        <td>
                                            <table width="100%">
                                                <tr>
                                                    <td>
                                                        <h2>
                                                            List</h2>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>
                                                        <asp:GridView ID="GridView1" runat="server" OnRowCommand="GridView1_RowCommand" DataKeyNames="id, a" DataSourceID="DataSource1">
                                                            <Columns>
                                                                <asp:TemplateField ItemStyle-Width="2%">
                                                                    <ItemTemplate>
                                                                        <asp:Button ID="imgEdit" runat="server" CommandName="Select" Text="Select" ImageUrl="~/images/edit.gif"
                                                                            CommandArgument='<%# Bind("id") %>' ToolTip="Select" CausesValidation="false" /></ItemTemplate>
                                                                </asp:TemplateField>
                                                            </Columns>
                                                        </asp:GridView>
                                                    </td>
                                                </tr>
                                            </table>
                                        </td>
                                    </tr>
                                </table>
                            </td>
                        </tr>
                        <tr id="trDetail" runat="server" visible="true">
                            <td>
                                <table width="100%">
                                    <tr>
                                        <td>
                                            <h2>
                                                Information</h2>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td valign="top">
                                            <ext:TabPanel ID="TabPanel2" runat="server" Cls="auto-width-tab-strip" ActiveTab="0"
                                                Title="TabPanel2">
                                                <Tabs>
                                                    <ext:Tab ID="TabDetails" runat="server" Title="Details" IconCls="tabs">
                                                        <Content>
                                                            <table width="100%">
                                                                <tr>
                                                                    <td>
                                                                        <asp:Label ID="Label2" runat="server"></asp:Label>
                                                                    </td>
                                                                    <td>
                                                                        <asp:Label ID="lblDescription" runat="server"></asp:Label>
                                                                    </td>
                                                                </tr>
                                                            </table>
                                                        </Content>
                                                    </ext:Tab>
                                                    <ext:Tab ID="Tab1" runat="server" Title="Tab1" AutoScroll="true">
                                                        <Content>
                                                            Tab1
                                                        </Content>
                                                    </ext:Tab>
                                                    <ext:Tab ID="Tab2" runat="server" Title="Tab2">
                                                        <Content>
                                                            Tab2
                                                        </Content>
                                                    </ext:Tab>
                                                    <ext:Tab ID="Tab3" runat="server" Title="Tab3">
                                                        <Content>
                                                            Tab3
                                                        </Content>
                                                    </ext:Tab>
                                                    <ext:Tab ID="Tab4" runat="server" Title="Tab4" AutoScroll="true">
                                                        <Content>
                                                            Tab4
                                                        </Content>
                                                    </ext:Tab>
                                                </Tabs>
                                            </ext:TabPanel>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td align="center">
                                            <asp:Button ID="btnBack" runat="server" Text="Back" CausesValidation="false" />
                                        </td>
                                    </tr>
                                </table>
                            </td>
                        </tr>
                    </table>
                </ContentTemplate>
            </asp:UpdatePanel>
        
    
        <asp:ObjectDataSource ID="DataSource1" runat="server" TypeName="DataSource" SelectMethod="Select"
            UpdateMethod="Update" DeleteMethod="Delete">
        </asp:ObjectDataSource>
        </form>
    </body>
    </html>
    Code 2 (does work - using Coolite v0.4.1):

    <%@ Page Language="C#" %>
    <%@ Register Assembly="Coolite.Web.UI" Namespace="Coolite.Web.UI" TagPrefix="cool" %>
    
    
    <script runat="server">
    protected void Page_Load(object sender, EventArgs e)
    {
        ChangeTrStyle(false);
    }
    
    
    private void ChangeTrStyle(Boolean type)
    {
        if (type)
        {
            trList.Visible = false;
            trDetail.Visible = true;
        }
        else
        {
            trList.Visible = true;
            trDetail.Visible = false;
        }
    }
    
    
    protected void GridView1_RowCommand(object sender, GridViewCommandEventArgs e)
    {
        if (e.CommandName.Trim().Equals("Select"))
        {
            GridViewRow row = (GridViewRow)((Control)e.CommandSource).NamingContainer;
            this.Label2.Text = "id: " + GridView1.DataKeys[row.RowIndex].Values["id"].ToString();
            this.lblDescription.Text = "Description: " + GridView1.DataKeys[row.RowIndex].Values["a"].ToString();
    
    
            ChangeTrStyle(true);
        }
    }
        
    </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 id="Head1" runat="server">
        <script type="text/C#" language="cs" runat="server" src= "DataSource.cs"/>
        <title>RowCommand is not been fired</title>
        <style type="text/css">
            .auto-width-tab-strip ul.x-tab-strip
            {
                width: auto;
            }
        </style>
    </head>
    <body>
        <form id="form1" runat="server">
        
            <cool:ScriptManager ID="ScriptManager2" runat="server">
            </cool:ScriptManager>
            <asp:ScriptManager ID="ScriptManager1" runat="server">
            </asp:ScriptManager>
            <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Always">
                <ContentTemplate>
                    <table width="100%" cellpadding="0" cellspacing="0">
                        <tr runat="server" id="trList" visible="false">
                            <td>
                                <table width="100%">
                                    <tr>
                                        <td>
                                            <table width="100%">
                                                <tr>
                                                    <td>
                                                        <h2>
                                                            List</h2>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>
                                                        <asp:GridView ID="GridView1" runat="server" OnRowCommand="GridView1_RowCommand" DataKeyNames="id, a" DataSourceID="DataSource1">
                                                            <Columns>
                                                                <asp:TemplateField ItemStyle-Width="2%">
                                                                    <ItemTemplate>
                                                                        <asp:Button ID="imgEdit" runat="server" CommandName="Select" Text="Select" ImageUrl="~/images/edit.gif"
                                                                            CommandArgument='<%# Bind("id") %>' ToolTip="Select" CausesValidation="false" /></ItemTemplate>
                                                                </asp:TemplateField>
                                                            </Columns>
                                                        </asp:GridView>
                                                    </td>
                                                </tr>
                                            </table>
                                        </td>
                                    </tr>
                                </table>
                            </td>
                        </tr>
                        <tr id="trDetail" runat="server" visible="true">
                            <td>
                                <table width="100%">
                                    <tr>
                                        <td>
                                            <h2>
                                                Information</h2>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td valign="top">
                                            <cool:TabPanel ID="TabPanel2" runat="server" Cls="auto-width-tab-strip" ActiveTab="0"
                                                Title="TabPanel2">
                                                <Items>
                                                    <cool:Tab ID="TabDetails" runat="server" Title="Details" IconCls="tabs">
                                                        <Content>
                                                            <table width="100%">
                                                                <tr>
                                                                    <td>
                                                                        <asp:Label ID="Label2" runat="server"></asp:Label>
                                                                    </td>
                                                                    <td>
                                                                        <asp:Label ID="lblDescription" runat="server"></asp:Label>
                                                                    </td>
                                                                </tr>
                                                            </table>
                                                        </Content>
                                                    </cool:Tab>
                                                    <cool:Tab ID="Tab1" runat="server" Title="Tab1" AutoScroll="true">
                                                        <Content>
                                                            Tab1
                                                        </Content>
                                                    </cool:Tab>
                                                    <cool:Tab ID="Tab2" runat="server" Title="Tab2">
                                                        <Content>
                                                            Tab2
                                                        </Content>
                                                    </cool:Tab>
                                                    <cool:Tab ID="Tab3" runat="server" Title="Tab3">
                                                        <Content>
                                                            Tab3
                                                        </Content>
                                                    </cool:Tab>
                                                    <cool:Tab ID="Tab4" runat="server" Title="Tab4" AutoScroll="true">
                                                        <Content>
                                                            Tab4
                                                        </Content>
                                                    </cool:Tab>
                                                </Items>
                                            </cool:TabPanel>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td align="center">
                                            <asp:Button ID="btnBack" runat="server" Text="Back" CausesValidation="false" />
                                        </td>
                                    </tr>
                                </table>
                            </td>
                        </tr>
                    </table>
                </ContentTemplate>
            </asp:UpdatePanel>
        
    
        <asp:ObjectDataSource ID="DataSource1" runat="server" TypeName="DataSource" SelectMethod="Select"
            UpdateMethod="Update" DeleteMethod="Delete">
        </asp:ObjectDataSource>
        </form>
    </body>
    </html>

    Class used by both examples: DataSource.cs:

    public class DataSource
    {
        private System.Data.DataTable GetDataTable()
        {
            System.Data.DataTable dt = new System.Data.DataTable();
            dt.Columns.Add("id", typeof(int));
            dt.Columns.Add("a", typeof(string));
            dt.Columns.Add("b", typeof(string));
            dt.Columns.Add("c", typeof(bool));
            dt.Columns.Add("d", typeof(int));
            dt.Columns.Add("e", typeof(float));
            dt.Columns.Add("f", typeof(decimal));
            dt.PrimaryKey = new System.Data.DataColumn[] { dt.Columns["id"] };
    
    
            for (int i = 1; i < 10; ++i)
            {
                dt.Rows.Add(new object[] { i, "a" + i, "b" + (10 - i), i % 2 == 0, i * 2, i * 1.14159, i * 3.14 });
            }
    
    
            return dt;
        }
    
    
        public System.Data.DataTable Select()
        {
            return GetDataTable();
        }
    }

    Pleeeeease, can you help me to solve this problem ASAP?

    Best Regards

    Leonardo.
  6. #6

    RE: GridView events w/ UpdatePanel and Coolite TabPanel v0.51

    Hi Leonardo,

    Thanks for the sample. I was able to reproduce the problem and I located the bug. After a little spelunking I was also able to fix. I will update the 0.5.2 build on the Download page with the new code.

    Please test with the new 0.5.2 build and let me know either way if it works for you.
    Geoffrey McGill
    Founder
  7. #7

    RE: GridView events w/ UpdatePanel and Coolite TabPanel v0.51

    The new 0.5.2 is now available on the download page.
    Geoffrey McGill
    Founder
  8. #8

    RE: GridView events w/ UpdatePanel and Coolite TabPanel v0.51



    Hi Geoffrey McGill,

    Thank you very much for all the support and fix.
    That solved the problem, indeed!

    With that, I could convert my pages to use the new version. And with the new version I am now testing the issues related to TabPanel sizing.

    I'll give you an answer for it on the right thread.

    Once again, thanks for your time and quick answer.

    Leonardo.
  9. #9

    RE: GridView events w/ UpdatePanel and Coolite TabPanel v0.51

    I would like populate a GridPanel with DataTable is possible?

    Ex:
    <head runat="server">
        <title></title>
        <script runat="server">
            
            protected void carregaGrid()
            {
                DataTable dtMedicos = DataExtractor.GetDataTable("MyProcedure");
                Store1.DataSource = dtMedicos;
                Store1.DataBind();
                
            }
            
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
        
            <ext:ScriptManager ID="ScriptManager1" runat="server" />
            
            <ext:Store ID="Store1" runat="server">
                <Reader>
                    <ext:JsonReader ReaderID="camposID">
                        <Fields>
                            <ext:RecordField Name="Nome"></ext:RecordField> 
                            <ext:RecordField Name="Idade"></ext:RecordField>
                            <ext:RecordField Name="Endereco"></ext:RecordField>
                        </Fields>
                    </ext:JsonReader>
                </Reader>
            </ext:Store> 
            
            <ext:TableGrid ID="TableGrid1" runat="server">
                <Columns>
                    <ext:Column DataIndex="Nome" Header="Nome"></ext:Column>
                    <ext:Column DataIndex="Idade" Header="Idade"></ext:Column>
                    <ext:Column DataIndex="Endereco" Header="Endereco"></ext:Column>
                </Columns>
            </ext:TableGrid>
           
        
    
        </form>

Similar Threads

  1. ComboBox Key Events in GridView
    By mj.daly in forum 1.x Help
    Replies: 2
    Last Post: Dec 03, 2010, 9:48 AM
  2. Replies: 0
    Last Post: Jul 14, 2010, 3:33 PM
  3. [CLOSED] UpdatePanel and TabPanel
    By Timothy in forum 1.x Legacy Premium Help
    Replies: 25
    Last Post: Sep 21, 2009, 5:30 PM
  4. [CLOSED] UpdatePanel and TabPanel
    By Timothy in forum 1.x Legacy Premium Help
    Replies: 16
    Last Post: Oct 03, 2008, 8:28 AM
  5. UpdatePanel in TabPanel
    By Timothy in forum 1.x Legacy Premium Help
    Replies: 16
    Last Post: Aug 08, 2008, 4:10 PM

Posting Permissions