Solved

Image refresh chrome asynchronous request (asp.net)

Posted on 2013-12-07
2
381 Views
Last Modified: 2013-12-11
Hello, I have a problem with google Chrome, not happening in Firefox/IE.
In an user evaluation page, when selecting proper answer for a question (checking ckAnswer checkbox from gvAnswers gridview) , there is generated an asynchronous request. But, during this asynchronous request, the image from code below (imgGroup2) is reloaded with visible refresh gap (like a wink), which makes it annoying for end user
The issue is only in Chrome.....

The code below.
Any suggestions?
Thanks!

<asp:UpdatePanel ID="up" runat="server" ChildrenAsTriggers="true">
                <ContentTemplate>
                <asp:Panel ID="pnlChapter" runat="server" CssClass="TestChapter">
                    <asp:Label ID="lblGroup1" runat="server" Text=""></asp:Label>
                </asp:Panel>
                
                <asp:Panel ID="pnlWrap2" runat="server" CssClass="TestWrap2">
                    <asp:Panel ID="pnlWrap3" runat="server" CssClass="TestWrap3">
                        
                        <asp:Panel ID="pnlSubChapter" runat="server" CssClass="TestSubchapter">
                            <asp:Label ID="lblGroup2" runat="server" Text=""></asp:Label>
                        </asp:Panel>
                        <br />
                        <asp:Panel ID="pnlDomain" runat="server" CssClass="TestDomain">
                            <asp:Label ID="lblGroup3" runat="server" Text=""></asp:Label>
                        </asp:Panel>
                        
                    </asp:Panel>                
                    <asp:Panel ID="pnlImage" runat="server" CssClass="TestImage">
                        <asp:Image ID="imgGroup2" runat="server" AlternateText="No image found." CssClass="TestImage" />
                    </asp:Panel>          
                </asp:Panel>
            
                <asp:Panel ID="pnlQuestion" runat="server" CssClass="TestQuestionText">
                    <asp:Label ID="lblQuestion" runat="server" Text=""></asp:Label>
                </asp:Panel>
<asp:Panel ID="pnlAnswer" runat="server" CssClass="TestAnswerText">
                    <asp:GridView ID="gvAnswers" runat="server" AutoGenerateColumns="false" 
                         ShowHeader="false" GridLines="None">
                        <RowStyle CssClass="gridviewRowTest" />
                        <Columns>
                            <asp:TemplateField ItemStyle-Wrap="true">
                                <ItemTemplate>
                                    <asp:CheckBox ID="ckAnswer" runat="server" TextAlign="Left" AutoPostBack="true" 
                                        Checked="false" OnCheckedChanged="ckAnswer_CheckedChanged" />                                                               
                                </ItemTemplate>
                            </asp:TemplateField>
                            <asp:BoundField DataField="AnswerText" HeaderText="" />                                                        
                        </Columns>
                    </asp:GridView>
                    <asp:TextBox ID="tbAnswerArea" runat="server" TextMode="MultiLine" Rows="5" Width="200">
                    </asp:TextBox>
                </asp:Panel>

<asp:Button ID="btValidate" runat="server" Text="Valideaza" Enabled="false" CssClass="buttonStandard" OnClick="btValidate_Click"/>
</ContentTemplate>
            </asp:UpdatePanel>     

Open in new window

0
Comment
Question by:danielivanov2
  • 2
2 Comments
 

Accepted Solution

by:
danielivanov2 earned 0 total points
Comment Utility
Solved by putting image in a separate UpdatePanel and associating btValidate button with a Postback Trigger for updating second UpdatePanel, as below:
<asp:UpdatePanel ID="up" runat="server" ChildrenAsTriggers="true">
            <ContentTemplate>
                <asp:Panel ID="pnlAnswer" runat="server" CssClass="TestAnswerPanel">
                    <asp:GridView ID="gvAnswers" runat="server" AutoGenerateColumns="false" 
                         ShowHeader="false" GridLines="None">
                        <RowStyle CssClass="gridviewRowTest" />
                        <Columns>
                            <asp:TemplateField>
                                <ItemStyle CssClass="TestAnswerText"/>
                                <ItemTemplate>                                    
                                    <asp:CheckBox ID="ckAnswer" runat="server" TextAlign="Left" AutoPostBack="true"  
                                        Checked="false" OnCheckedChanged="ckAnswer_CheckedChanged" />                                                                                                   
                                </ItemTemplate>
                            </asp:TemplateField>
                            <asp:BoundField DataField="AnswerText" HeaderText="" />                                                        
                        </Columns>
                    </asp:GridView>
                    <asp:TextBox ID="tbAnswerArea" runat="server" TextMode="MultiLine" Rows="5" Width="200">
                    </asp:TextBox>
                </asp:Panel>                
                </ContentTemplate>
            </asp:UpdatePanel>

<asp:UpdatePanel ID="upValidate" runat="server" UpdateMode="Conditional">
                <ContentTemplate>
                    <asp:Button ID="btValidate" runat="server" Text="Valideaza" Enabled="false" CssClass="buttonStandard" OnClick="btValidate_Click"/>
                    <asp:Panel ID="pnlProgress" runat="server" CssClass="TestProgress">
                        <asp:DataList ID="dtListGroup1" runat="server" RepeatDirection="Horizontal" OnItemDataBound="dtListGroup1_ItemDataBound">                    
                            <ItemTemplate>                            
                                <asp:Panel ID="pnlGroupDesc" runat="server" Cssclass="TestGroup1Block">
                                    <asp:Label ID="lblGroupDesc" runat="server" Text='<%# Eval("GroupDesc")%>'></asp:Label>                                
                                </asp:Panel>
                                <asp:Literal ID="ltGroup1Id" runat="server" Text='<%# Eval("GroupId")%>' Visible="false"></asp:Literal>
                                <asp:Literal ID="ltBackColor" runat="server" Text='<%# Eval("BackColor")%>' Visible="false"></asp:Literal>
                                <asp:Literal ID="ltForeColor" runat="server" Text='<%# Eval("ForeColor")%>' Visible="false"></asp:Literal>
                                <ajaxToolKit:RoundedCornersExtender ID="RoundedCornersExtender2" runat="server" TargetControlID="pnlGroupDesc" Radius="10" Corners="All">
                                </ajaxToolKit:RoundedCornersExtender>                           
                            </ItemTemplate>
                        </asp:DataList>
                    </asp:Panel>                                                                                                    
                </ContentTemplate>
                <Triggers>
                    <asp:PostBackTrigger ControlID="btValidate" />
                </Triggers>
            </asp:UpdatePanel>

Open in new window


if (ck)
            {
                btValidate.Enabled = true;
                btValidate.CssClass = "buttonValidateOk";
                upValidate.Update();
            }
            else
            {
                btValidate.Enabled = false;
                btValidate.CssClass = "buttonValidateNotOk";
                upValidate.Update();
            }

Open in new window

0
 

Author Closing Comment

by:danielivanov2
Comment Utility
no answer received, I had to find the answer myself
0

Featured Post

Why You Should Analyze Threat Actor TTPs

After years of analyzing threat actor behavior, it’s become clear that at any given time there are specific tactics, techniques, and procedures (TTPs) that are particularly prevalent. By analyzing and understanding these TTPs, you can dramatically enhance your security program.

Join & Write a Comment

The Confluence of Individual Knowledge and the Collective Intelligence At this writing (summer 2013) the term API (http://dictionary.reference.com/browse/API?s=t) has made its way into the popular lexicon of the English language.  A few years ago, …
Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
This Micro Tutorial will demonstrate how nuggets on the Web are formatted by using Chrome Developer Tools. These tools would not only view the site's CSS but it can also modify it and save the CSS to use on your own site.
Shows how to create a shortcut to site-search Experts Exchange using Google in the Chrome browser. This eliminates the need to type out site:experts-exchange.com whenever you want to search the site. Launch the Search Engine Menu: In chrome, via you…

772 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

10 Experts available now in Live!

Get 1:1 Help Now