troubleshooting Question

asp.net updatepanel causing unintended postbacks

Avatar of toddpotter
toddpotter asked on
ASP.NETMicrosoft DevelopmentAJAX
4 Comments1 Solution867 ViewsLast Modified:
I am working on a web page in asp.net (I am new to asp.net).  I have a script manager and two update panels (UpdatePanelCustomers and UpdatePanelItems) on my page, but I am experiencing a problem on post backs.  I have an image button (ibtnFilterCustomers) in the UpdatePanelCustomers panel, but when I click it, my UpdatePanelItems attempts to refresh and I get an exception (pasted below).  I cannot figure out how to resolve this.  I have set updatemode="conditional" for each panel, but that does not solve it.  However, if I move the button outside of the UpdatePanelCustomers and click it then UpdatePanelItems does not refresh (which is the intended action).  I would like to keep the button inside of the panel.  Please help me understand why this is happing and how to resolve it.    Maybe it would be best to handle all activity from the Click_Event and avoid the postback - but I don't know how to do that either.  Thanks in advance for your help.


Exception:
JavaScript runtime error: Sys.WebForms.PageRequestManagerServerErrorException: Input string was not in a correct format.

Code:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="OrderEntry._Default" %>

<!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> SBS Order Entry </title>
    
    <style type="text/css">
        .style1
        {
            width: 960px;
        }
        .style2
        {
            width: 144px;
            color: White;
            text-align: right;
            font-size: small;
        }
        .style3
        {
            color: #FFFFFF;
            font-size: smaller;
        }
        h1
        {
            font-family: Impact;
            font-size: xx-large;
            font-variant: small-caps;
            color: #FFFFFF;
        }
        h2
        {
            font-family: Impact;
            font-size: x-large;
            font-variant: small-caps;
            color: #FFFFFF;
        }
        #banner
        {
            height: 4
            0px;
            width: 960px;
            color: #FFFFFF;
            z-index: 1;
            left: 10px;
            top: 15px;
            position: absolute;
            background-color: #000000;
        }
       
        form
        {
            background-color: #000000;
            color: #FFFFFF;
            width: 958px;
            height: 1044px;
        }
       
        .style7
        {
            height: 25px;
        }
       
        .style8
        {
            width: 550px;
        }
        .style9
        {
        }
        .style10
        {
            width: 785px;
        }
       
        .style11
        {
        }
       
        .style12
        {
            width: 151px;
        }
       
        .style13
        {
            width: 150px;
        }
               
        .style15
        {
            font-family: Impact;
            font-size:xx-large;
            font-variant: small-caps;
            color: #FFFFFF;
            width: 250px;
        }
       
        .style16
        {
            font-family: "Accord SF";
            font-weight: bold;
        }
        .style17
        {
            width: 144px;
            color: White;
            text-align: right;
            font-size: small;
            height: 21px;
        }
        .style18
        {
            height: 21px;
        }
        .style19
        {
            color: #FFFFFF;
            font-size: smaller;
            width: 134px;
        }
        .style20
        {
            height: 25px;
            width: 134px;
        }
        .style21
        {
            color: #FFFFFF;
            font-size: smaller;
            width: 92px;
        }
        .style22
        {
            height: 25px;
            width: 92px;
        }
        .style23
        {
            color: #FFFFFF;
            font-size: smaller;
            width: 189px;
        }
        .style24
        {
            height: 25px;
            width: 189px;
        }
       
    </style>
</head>
<body bgcolor="#000000">
    <form id="form" runat="server" title="SBS Order Entry" >
      
    <div id="banner">
            <h1 style="width: 960px">
                <asp:Image ID="Image1" runat="server" 
                    ImageUrl="~/Images/Page_Header.png" Height="56px" Width="960px" /></h1>
        <h2 style="width: 960px"></h2>
    </div>
    
    <div id="main">
        <br />
        <br />
        <br />
        <br />
        <br />
        <br />
         <asp:ScriptManager ID="sm" runat="server" ScriptMode="Release" >
                        </asp:ScriptManager>
         
    <asp:UpdatePanel ID="UpdatePanelCustomers" runat="server" updatemode="conditional" > <%--AJAX Control that will allow partial postbacks (instead of full page post back) --%>
                <ContentTemplate> <%--Content Template for the Update Panel --%>               
         <asp:MultiView ID="mvCustomer" runat="server" ActiveViewIndex="0">
           
                       
        <asp:View ID="vSelectedCustomer" runat="server">
        <table class="style1">
        <tr>
            <td class="style2" valign="middle">
                Customer:</td>
            <td headers=" " class="style7">
                <asp:DropDownList ID="ddlCustomers" runat="server" AppendDataBoundItems="True" borderstyle="None" 
                    AutoPostBack="True" Height="17px" Width="250px" BackColor="Black" ForeColor="White" 
                    onselectedindexchanged="ddlCustomers_SelectedIndexChanged" 
                    CssClass="style3">
                    <asp:ListItem Value="" Text="Select a Customer..." />
                </asp:DropDownList>
               
                <asp:TextBox ID="txtCustomer" runat="server" BackColor="White" 
                    BorderStyle="None" ForeColor="Black"></asp:TextBox>
                <asp:ImageButton ID="ibtnFilterCustomers" runat="server" BorderStyle="None" 
                    ImageUrl="~/Images/BookOpen.gif" onclick="ibtnFilterCustomers_Click" 
                    Width="16px" />
            </td>
        </tr>
        <tr>
            <td class="style17">
                Address:</td>
            <td class="style18">
                <asp:Label ID="lblAddress" runat="server" CssClass="style3"></asp:Label>
            </td>
        </tr>
        <tr>
            <td class="style2">
                City, State Zip:</td>
            <td>
                <asp:Label ID="lblCity" runat="server" CssClass="style3"></asp:Label>
                <span class="style3">,
                </span>
                <asp:Label ID="lblState" runat="server" CssClass="style3"></asp:Label>
                &nbsp;<asp:Label ID="lblZip" runat="server" CssClass="style3"></asp:Label>
            </td>
        </tr>
        <tr style="height:10px" >
            <td class="style2">
                </td>
            <td>
            </td>
        </tr>
        </table>
       
        <table class="style1">
        <tr>
            <td class="style2">
                Contact:</td>
            <td class="style19">
                <asp:TextBox ID="txtContact" runat="server" BackColor="White" 
                    BorderStyle="None" ForeColor="Black"></asp:TextBox>
            </td>
            <td class="style21">
                &nbsp;</td>
            <td class="style23">
                &nbsp;</td>
            <td class="style3">
                &nbsp;</td>
        </tr>
        <tr>
            <td class="style2">
                Phone:</td>
            <td class="style19">
                <asp:TextBox ID="txtPhone" runat="server" BackColor="White" BorderStyle="None" 
                    ForeColor="Black"></asp:TextBox>
            </td>
            <td class="style21">
                &nbsp;</td>
            <td class="style23">
                &nbsp;</td>
            <td class="style3">
                &nbsp;</td>
        </tr>
        <tr>
            <td class="style2">
                &nbsp;</td>
            <td class="style20">
                &nbsp;</td>
            <td class="style22">
                &nbsp;</td>
            <td class="style24">
                &nbsp;</td>
            <td class="style7">
                &nbsp;</td>
        </tr>
    </table>
    
    </asp:View>
        
          
        <asp:View ID="vFilteredCustomers" runat="server">
            <asp:GridView ID="GridView1" runat="server">
            </asp:GridView>
        
        </asp:View>
    </asp:MultiView>
    </ContentTemplate>
            </asp:UpdatePanel>
    </div>
    
   
    <asp:UpdatePanel ID="UpdatePanelItems" runat="server" updatemode="Conditional"> <%--AJAX Control that will allow partial postbacks (instead of full page post back) --%>
                <ContentTemplate> <%--Content Template for the Update Panel --%>
    
    
    <asp:MultiView ID="mvConfigurations" runat="server" ActiveViewIndex="0">
           
                       
        <asp:View ID="vHardware" runat="server">
            
            <table class="style8">
                <tr>
                    <td class="style2">
                        Segment:</td>
                    <td class="style11" colspan="2">
                        <asp:DropDownList ID="ddlSegments" runat="server" AppendDataBoundItems="True" 
                            BackColor="Black" borderstyle="None" CssClass="style3" ForeColor="White" 
                            Height="21px" onselectedindexchanged="ddlSegments_SelectedIndexChanged" 
                            Width="431px" AutoPostBack="True">
                            <asp:ListItem Text="Choose a Segment..." Value="" />
                        </asp:DropDownList>
                    </td>
                </tr>
                <tr>
                    <td class="style12">
                        <asp:RadioButtonList ID="rblItemManf" runat="server" CellSpacing="0" 
                            Font-Size="10pt" ForeColor="White" Height="47px" 
                            onselectedindexchanged="rblItemManf_SelectedIndexChanged" Width="160px" 
                            AutoPostBack="True">
                            <asp:ListItem>All Manufactures</asp:ListItem>
                            <asp:ListItem>XXXXX Only</asp:ListItem>
                            <asp:ListItem>Non-XXXXX Only</asp:ListItem>
                        </asp:RadioButtonList>
                    </td>
                    <td class="style11">
                        <asp:RadioButtonList ID="rblItemType" runat="server" CellSpacing="0" 
                            Font-Size="10pt" ForeColor="White" 
                            onselectedindexchanged="rblItemType_SelectedIndexChanged" Width="111px" 
                            AutoPostBack="True">
                            <asp:ListItem>All</asp:ListItem>
                            <asp:ListItem>B\W</asp:ListItem>
                            <asp:ListItem>Color</asp:ListItem>
                        </asp:RadioButtonList>
                    </td>
                    <td class="style10" valign="bottom">
                        <asp:Button ID="btnFetch" runat="server" BackColor="Black" BorderStyle="None" 
                            ForeColor="#0080FF" Height="21px" onclick="btnFetch_Click" 
                            Text="Fetch Items &gt;" Width="91px" />
                    </td>
                </tr>
                <tr>
                    <td class="style9" colspan="3">
                        
                    </td>
                </tr>
            </table>
            
            <asp:ObjectDataSource ID="odsHardwareItems" runat="server" 
                SelectMethod="GetFilteredHardwareList" TypeName="SBS_OrderEntry.DAL">
                <SelectParameters>
                    <asp:ControlParameter ControlID="ddlSegments" DefaultValue="null" Name="s" 
                        PropertyName="SelectedValue" Type="String" />
                    <asp:ControlParameter ControlID="rblItemManf" DefaultValue="null" Name="m" 
                        PropertyName="SelectedValue" Type="String" />
                    <asp:ControlParameter ControlID="rblItemType" DefaultValue="null" Name="t" 
                        PropertyName="SelectedValue" Type="String" />
                </SelectParameters>
            </asp:ObjectDataSource>
            <%--Since my button is outside of the UpdatePanel I need to set the Trigger on the Update Panel
            If the button was inside the update panel then there is no need to do a trigger because it is wrapped in the update panel
            If I did not set the trigger on the update panel with an AsyncPostBackTrigger (controlID = button, event = click) then the full page would post back (not using AJAX)
            
             --%>
            <asp:UpdateProgress ID="progress" runat="server" DisplayAfter="300" DynamicLayout="false" >
                <ProgressTemplate>
                   
                    <table class="style8">
                        <tr>
                            <td class="style13" align="right">
                            <img alt="Data Loading Please Wait..." src="Images/Progress_Clock_Red_Black.gif" />
                                &nbsp;</td>
                            <td class="style15" align="center" >
                                <span class="style16"><i>Loading... </i></span>&nbsp;</td>
                            <td class="style13" align="left">
                            <img alt="Data Loading Please Wait..." src="Images/Progress_Clock_Red_Black.gif" />
                                &nbsp;</td>
                        </tr>
                    </table>
                </ProgressTemplate>
            </asp:UpdateProgress>
                <asp:GridView ID="gvHardwareItems" runat="server" AllowPaging="True" 
                AllowSorting="True" AutoGenerateColumns="False" BackColor="#CCCCCC" 
                BorderColor="#999999" BorderStyle="Solid" BorderWidth="3px" CellPadding="4" 
                CellSpacing="2" DataSourceID="odsHardwareItems" ForeColor="Black" 
                onselectedindexchanged="gvHardwareItems_SelectedIndexChanged" 
                Width="550px">
                <RowStyle BackColor="White" />
                <Columns>
                    <asp:CommandField ButtonType="Image" SelectImageUrl="~/Images/Book.gif" 
                        SelectText="" ShowSelectButton="True" />
                    <asp:BoundField DataField="ItemID" HeaderText="ItemID" SortExpression="ItemID" 
                        Visible="False" />
                    <asp:BoundField DataField="Item" HeaderText="Item" SortExpression="Item" />
                    <asp:BoundField DataField="BW_Color" HeaderText="Type" 
                        SortExpression="BW_Color" />
                    <asp:BoundField DataField="Make" HeaderText="Make" SortExpression="Make" />
                    <asp:BoundField DataField="Segment" HeaderText="Segment" 
                        SortExpression="Segment" />
                    <asp:BoundField DataField="SegmentDescription" HeaderText="Segment Description" 
                        SortExpression="SegmentDescription" />
                </Columns>
                <FooterStyle BackColor="#CCCCCC" />
                <PagerStyle BackColor="#CCCCCC" ForeColor="Black" HorizontalAlign="Left" />
                <SelectedRowStyle BackColor="#000099" Font-Bold="True" ForeColor="White" />
                <HeaderStyle BackColor="Black" Font-Bold="True" ForeColor="White" 
                        Font-Underline="False" />
            </asp:GridView>
                
            <%--<asp:GridView ID="gvHardwareItems" runat="server" 
                BackColor="#CCCCCC" BorderColor="#999999" BorderStyle="Solid" BorderWidth="3px" 
                CellPadding="4" CellSpacing="2" ForeColor="Black" AllowPaging="True" 
                AllowSorting="True" AutoGenerateColumns="False" 
                >
                <RowStyle BackColor="White" />
                <FooterStyle BackColor="#CCCCCC" />
                <PagerStyle BackColor="#CCCCCC" ForeColor="Black" HorizontalAlign="Left" />
                <SelectedRowStyle BackColor="#000099" Font-Bold="True" ForeColor="White" />
                <HeaderStyle BackColor="Black" Font-Bold="True" ForeColor="White" />
                <Columns>
                            <asp:CommandField ShowSelectButton="True" 
                               SelectText="" SelectImageUrl ="~/Images/Book.gif" ButtonType="Image"></asp:CommandField>
                            <asp:BoundField HeaderText="ItemID" 
                               DataField="ItemID" 
                               SortExpression="ItemID"
                               Visible="False">
                            </asp:BoundField>
                            <asp:BoundField HeaderText="Item" 
                               DataField="Item" 
                               SortExpression="Item">
                            </asp:BoundField>
                            <asp:BoundField HeaderText="Type" 
                                DataField="BW_Color" 
                                SortExpression="BW_Color">
                            </asp:BoundField>
                            <asp:BoundField HeaderText="Make" 
                                DataField="Make" 
                                SortExpression="Make">
                            </asp:BoundField>
                            <asp:BoundField HeaderText="Segment" 
                                DataField="Segment" 
                                SortExpression="Segment">
                            </asp:BoundField>
                            <asp:BoundField HeaderText="SegmentDescription" 
                                DataField="SegmentDescription" 
                                SortExpression="SegmentDescription">
                            </asp:BoundField>                
                
               </Columns>

            </asp:GridView>--%>
            
        </asp:View>
        
          
        <asp:View ID="vAccessories" runat="server">
        </asp:View>
    </asp:MultiView>
          </ContentTemplate>
            </asp:UpdatePanel>
    </form>
</body>
</html>
ASKER CERTIFIED SOLUTION
Kelvin McDaniel
Owner/Consultant/Sr. Engineer

Our community of experts have been thoroughly vetted for their expertise and industry experience.

Join our community to see this answer!
Unlock 1 Answer and 4 Comments.
Start Free Trial
Learn from the best

Network and collaborate with thousands of CTOs, CISOs, and IT Pros rooting for you and your success.

Andrew Hancock - VMware vExpert
See if this solution works for you by signing up for a 7 day free trial.
Unlock 1 Answer and 4 Comments.
Try for 7 days

”The time we save is the biggest benefit of E-E to our team. What could take multiple guys 2 hours or more each to find is accessed in around 15 minutes on Experts Exchange.

-Mike Kapnisakis, Warner Bros