ASP.NET: UpdatePanel not displaying even when Visible set to True - c#

I have two Update Panels in an aspx page and one ModalPopupExtender inside each of them. The problem I am facing is that, I have set the Visible property to false in the aspx page and set it to True when it needs to be displayed. But the UpdatePanel is not showing up even though I have set Visible=True property.
aspx code:
<%--Request closed --%>
<asp:UpdatePanel ID="udpModalReqClose" runat="server" Visible="false">
<ContentTemplate>
<div style="display:none">
<asp:Button ID="btnDummyButton_ReqClose" UseSubmitBehavior="true" runat="server" Text="DummyButton" Style="display: none;" />
</div>
<asp:Panel ID="pnlCloseReq" runat="server" BackColor="White" BorderStyle="Solid" BorderColor="Black" BorderWidth="1px">
<div>
<table id="Table24" runat="server" border="0" cellpadding="4" cellspacing="10" width="400px">
<tr>
<td align="center">
<asp:Label ID="lblcloseSuccessOPR" runat="server" Font-Bold="true" ForeColor="Red" />
</td>
</tr>
<tr>
<td style="height: 5px;"></td>
</tr>
<tr>
<td align="center">
<asp:Button ID="btn_okclose" runat="server" SkinID="btnSearch" CssClass="btnSearch" OnClick="btnPOCPIRedirect_Click"
CausesValidation="false" align="center" Text="OK" Width="65px" />
</td>
</tr>
<tr>
<td style="height: 5px;"></td>
</tr>
</table>
</div>
</asp:Panel>
<cc1:ModalPopupExtender ID="mpeClosedSuccess" runat="server" PopupControlID="pnlCloseReq" TargetControlID="btnDummyButton_ReqClose"
BackgroundCssClass="modalPopup1" DropShadow="true" BehaviorID="mpe">
</cc1:ModalPopupExtender>
</ContentTemplate>
</asp:UpdatePanel>
<%--Request declined --%>
<asp:UpdatePanel ID="udpModalReqDecline" runat="server" Visible="false">
<ContentTemplate>
<div style="display:none">
<asp:Button ID="btnDummyButton_ReqDecline" UseSubmitBehavior="true" runat="server" Text="DummyButton" Style="display: none;" />
</div>
<asp:Panel ID="pnlRequestDecline" runat="server" BackColor="White" BorderStyle="Solid" BorderColor="Black" BorderWidth="1px">
<div>
<table id="Table17" runat="server" border="0" cellpadding="4" cellspacing="10" width="400px">
<tr>
<td align="center">
<asp:Label ID="lblRequestDecline" runat="server" Font-Bold="true" ForeColor="Red" />
</td>
</tr>
<tr>
<td style="height: 5px;"></td>
</tr>
<tr>
<td align="center">
<asp:Button ID="Button4" runat="server" SkinID="btnSearch" CssClass="btnSearch" OnClick="btnPOCPIRedirect_Click"
CausesValidation="false" align="center" Text="OK" Width="65px" />
</td>
</tr>
<tr>
<td style="height: 5px;"></td>
</tr>
</table>
</div>
</asp:Panel>
<cc1:ModalPopupExtender ID="mpeRequestDecline" runat="server" PopupControlID="pnlRequestDecline" TargetControlID="btnDummyButton_ReqDecline"
BackgroundCssClass="modalPopup1" DropShadow="true" BehaviorID="mpe">
</cc1:ModalPopupExtender>
</ContentTemplate>
</asp:UpdatePanel>
Link buttons which triggers the modalpopup in aspx:
<ItemTemplate>
<asp:LinkButton ID="LinkButton3" OnClick="lnkCloseReleaseHL" runat="server"
Text="Close"></asp:LinkButton>
</ItemTemplate>
<asp:TemplateColumn HeaderText="Decline">
<ItemTemplate>
<asp:LinkButton ID="lnkDeclineHLRelease" runat="server" OnClick="lnkDeclineHLRelease_Click">Decline All</asp:LinkButton>
</ItemTemplate>
Code behind:
public void lnkCloseReleaseHL(object sender, System.EventArgs e)
{
udpModalReqClose.Visible = true;
string successMsg = "Request has been closed Succesfully.";
lblcloseSuccessOPR.Text = successMsg;
mpeClosedSuccess.Show();
}
protected void lnkDeclineHLRelease_Click(object sender, EventArgs e)
{
udpModalReqDecline.Visible = true;
string successMsg = "Request has been declined.";
lblRequestDecline.Text = successMsg;
mpeRequestDecline.Show();
}
If I do not set the Visible=False property in the aspx page, one of the ModalPopup is shown on the webpage, blank with the 'OK' button I have inserted in the popup.
Also, if I have just one UpdatePanel in my aspx page, the popup works perfectly fine without setting Visible property. Once I add another UpdatePanel below it, this problem occurs(screenshot in the link), where the panel with 'OK' button is displayed on page load.
Panel appearing on page with the 'OK' button
I tried searching for every possible solutions on the web but nothing has helped me. If someone can please guide me how I can resolve this, it would be of great help. I just want to know how I can make multiple UpdatePanels work without having this issue.

I'm not sure, but you can try using
style="display:none"
instead of
Visible="false"

Related

Refreshing ListView in asp:webform using UpdatePanel

I have a listview that I want to update every 5 seconds or so, the update panel does refresh but to no effect.
<asp:Timer runat="server" ID="UP_Timer" Interval="5000" />
<asp:UpdatePanel runat="server" ID="Proc_UpdatePanel">
<ContentTemplate>
<asp:ListView ID="ListView1" runat="server"
DataKeyNames="procName"
ItemType="SerMon.RemoteProcess" SelectMethod="fetchFromQueue">
<EmptyDataTemplate>
<table>
<tr>
<td>No data was returned.</td>
</tr>
</table>
</EmptyDataTemplate>
<EmptyItemTemplate>
<td />
</EmptyItemTemplate>
<LayoutTemplate>
<table runat="server" id="table1" class="table table-striped table-hover ">
<thead>
<tr runat="server">
<th>#</th>
<th>Process</th>
<th>Status</th>
<th>Machine</th>
</tr>
<tr id="itemPlaceholder" runat="server"></tr>
</thead>
</table>
</LayoutTemplate>
<ItemTemplate>
<tr runat="server">
<td>1</td>
<td>
<asp:Label runat="server" ID="lblId"><%#: Item.ProcName%></asp:Label></td>
<td>
<asp:Label runat="server" ID="Label1"><%#: Item.Procstatus%></asp:Label></td>
<td>
<asp:Label runat="server" ID="Label2"><%#: Item.mcName%></asp:Label></td>
</tr>
</ItemTemplate>
</asp:ListView>
</ContentTemplate>
</asp:UpdatePanel>
The whole page refreshes, yet the method to be called for populating the listview is not called. Where am I going wrong?
There are 2 different issues here.
First of all the Timer is outside the UpdatePanel, so of course it will do a full PostBack. Move the timer inside the UpdatePanel.
Second, you did not specify an OnTick event for the timer. Without it the Timer will just refresh the page.
<asp:UpdatePanel runat="server" ID="Proc_UpdatePanel">
<ContentTemplate>
<asp:Timer runat="server" ID="UP_Timer" Interval="5000" OnTick="UP_Timer_Tick" />
</ContentTemplate>
</asp:UpdatePanel>
Code behind:
protected void UP_Timer_Tick(object sender, EventArgs e)
{
//update the ListView
}

Migrating a web form to web-form with Master

I have a web form up.
Later on, I realized I need a Master Page with a navigation that other web forms should follow.
I am in the process of manually migrating.
Taking this approach, Create Master Page -> Cut from web form -> Paste to web form with master -> erase the old web form.
As following. (I didn't create a navigation control yet, to not complicate the process further).
[New Master Page]
</asp:ContentPlaceHolder>
</div>
</form>
[Old Web Form]
<asp:EntityDataSource ID="entityDataSource" runat="server" ConnectionString="name=VideoLibraryEntities" DefaultContainerName="VideoLibraryEntities" EnableDelete="True" EnableFlattening="False" EnableInsert="True" EnableUpdate="True" EntitySetName="Clips" EntityTypeFilter="Clipo" OnSelecting="EntityDataSource_Selecting">
</asp:EntityDataSource>
<asp:GridView ID="GridView1" runat="server" AllowPaging="True" AllowSorting="True" DataSourceID="entityDataSource">
<Columns>
<asp:CommandField ShowDeleteButton="True" ShowEditButton="True" ShowSelectButton="True" />
</Columns>
</asp:GridView>
<div>
<h1>Sending Email</h1>
<table>
<tr>
<td>From:</td>
<td>
<asp:TextBox ID="txtFrom" runat="server" Width="250px"></asp:TextBox>
</td>
</tr>
<tr>
<td>From EMail:</td>
<td>
<asp:TextBox ID="txtFromEmail" runat="server" Width="250px"></asp:TextBox>
</td>
</tr>
<tr>
<td>To:</td>
<td>
<asp:TextBox ID="txtTo" runat="server" Width="250px"></asp:TextBox>
</td>
</tr>
<tr>
<td>To Email:</td>
<td>
<asp:TextBox ID="txtToEmail" runat="server" Width="250px"></asp:TextBox>
</td>
</tr>
<tr>
<td>Subject:</td>
<td>
<asp:TextBox ID="txtSubject" runat="server" Width="250px"></asp:TextBox>
</td>
</tr>
<tr>
<td>Message:</td>
<td>
<asp:TextBox ID="txtMessage" runat="server" TextMode="MultiLine" Height="138px"
Width="467px"></asp:TextBox>
</td>
</tr>
<tr>
<td colspan="2" align="right">
<asp:Button ID="btnSend" runat="server" Text="Send Email"
onclick="btnSend_Click" />
</td>
</tr>
</table>
<asp:Label ID="Label1" runat="server" ForeColor="Blue" />
</div>
</form>
Now shall I create a Master page with navigation and just paste the old web form into the new one?
Thanks.

Ajaxtabcontrol is not showing in web page

I am using Ajax tabcontrol ...Here is my code
<table id="tblajaxtab">
<tr>
<td>
<asp:UpdatePanel ID="updatetabcontrol" runat="server">
<ContentTemplate>
<cc1:TabContainer ID="tabcontainer" runat="server" ActiveTabIndex="0" AutoPostBack="false"
OnDemand="true" ScrollBars="None" UseVerticalStripPlacement="true" Height="250px"
Width="500px" VerticalStripWidth="120px" TabStripPlacement="Top">
<cc1:TabPanel ID="SQlServer" runat="server" HeaderText="SQL Server" Enabled="true"
OnDemandMode="Once" ScrollBars="Auto">
<ContentTemplate>
<table id="tblsqlserver">
<tr>
<td>
Database table name
</td>
<td>
<asp:TextBox ID="txttablename" runat="server" Width="180"></asp:TextBox>
</td>
</tr>
</table>
</ContentTemplate>
</cc1:TabPanel>
<cc1:TabPanel ID="csv" runat="server" Enabled="true" OnDemandMode="Once" HeaderText="CSV">
<ContentTemplate>
</ContentTemplate>
</cc1:TabPanel>
</cc1:TabContainer>
</ContentTemplate>
</asp:UpdatePanel>
</td>
</tr>
</table>
when I run this. Nothing is displaying. Please can you tell we whats wrong with me.
I don't see a ToolkitScriptManager in your code.
Please refer this link below.
http://www.aspdotnet-suresh.com/2011/11/ajax-tabcontainer-sample-or-how-to.html
Hope it help.

Toggle visibility of specific elements in a ListView

I have a list view on a page and am trying emulate the toggling effect of a tree view. When first bound the detail elements (LBL_ActionTitle, LBL_Action, LBL_UrlTitle, LBL_Url) are set to visibility = false. I would like to have the click event of the element (LB_ExpandCollapse) toggle the visibility of detail elements directly related to it. IE not all the elements of that type on the page. I am not sure how to accomplish this, or if it can be done, and was hoping that someone could point me in the right direction. Here is the control for reference.
<div id="logContainer">
<asp:ListView ID=LV_Logs runat="server">
<LayoutTemplate>
<table border="0" cellpadding="0" cellspacing="0" style="width:100%">
<tr>
<td></td>
<td style="width:85%" />
</tr>
<asp:PlaceHolder ID="itemPlaceholder" runat="server" />
</table>
</LayoutTemplate>
<ItemTemplate>
<tr>
<td>
<hr />
<asp:LinkButton ID="LB_ExpandCollapse" runat="server" CausesValidation="false" OnClick="expandCollapse_Click">+</asp:LinkButton>
<asp:Label ID="LBL_MessageType" runat="server" Text='<%# Eval("messageType") %>'></asp:Label>
<hr />
</td>
<td style="text-align: right">
<hr />
<asp:Label ID="LBL_Message" runat="server" Text='<%# Eval("messageTime") %>'></asp:Label>
<hr />
</td>
</tr>
<tr style="text-align: left">
<td style="padding-left: 65px">
<asp:Label ID="LBL_ActionTitle" Visibility="false" runat="server" Text="User Action:"></asp:Label>
</td>
<td style="padding-left: 10px">
<asp:Label ID="LBL_Action" Visibility="false" runat="server" Text='<%# Eval("action") %>'></asp:Label>
</td>
</tr>
<tr style="text-align: left">
<td style="padding-left: 65px">
<asp:Label ID="LBL_UrlTitle" Visibility="false" runat="server" Text="URL:"></asp:Label>
</td>
<td style="padding-left: 10px">
<asp:Label ID="LBL_Url" runat="server" Visibility="false" Text='<%# Eval("url") %>'></asp:Label>
</td>
</tr>
</ItemTemplate>
</asp:ListView>
<asp:DataPager ID="DataPagerProducts" runat="server" PagedControlID="LV_Logs"
PageSize="20" OnPreRender="DataPagerProducts_PreRender">
<Fields>
<asp:NextPreviousPagerField ShowFirstPageButton="True" ShowNextPageButton="False" />
<asp:NumericPagerField />
<asp:NextPreviousPagerField ShowLastPageButton="True" ShowPreviousPageButton="False" />
</Fields>
</asp:DataPager>
I suggest you put the ID of the record as an ID on the TR containing the fields you want toggled. Then in your expandCollapseClick also pass the ID, so that you can set the row's style to display:block. Of course this assumes that all the rows start out at display:none. ie.
<tr id='<%# Eval("recordId") %>' style='display:none'>
and then in Javascript (pseudo-code)
function expandCollapseClick(row)
{
document.getElementById(row).style.display = 'block';
}
Then change your button to execute client-side as in:
<button onclick='expandCollapse(<%# Eval("recordId") %>)'>+</button>
This will call the code to display the row, passing in the id of the correct row. Of course this assumes that the table is fully populated when the page is retrieved and all you want to do is hide/show detail.

FileUpload not working in update panel(modal popup extender)

i am developing web application and contain modal popup extender in which update panel made and it contain file upload control but file upload control not working in it.
This is my modal popup which contain fileupload control
and my modal popup source code
<cc1:ModalPopupExtender ID="AddNews" runat="server" PopupControlID="pnlPopUp1" BehaviorID="AddNews"
TargetControlID="btnNews" BackgroundCssClass="modalBackground">
</cc1:ModalPopupExtender>
<asp:Panel ID="pnlPopUp1" runat="server" CssClass="modalPopup" Height="450px" Width="660px"
Style="display:none; z-index: 100000">
<asp:UpdatePanel ID="Upanel1" runat="server">
<ContentTemplate>
<div>
<table cellpadding="0" cellspacing="0" width="100%">
<tr style="height: 35px;">
<td style="width:170px">
</td>
<td style="text-align: center">
<h1>
Add News</h1>
</td>
<td style="text-align: right">
<asp:ImageButton ID="ImageButton2" AlternateText="Close Image" runat="server" ImageUrl="~/images/delete_32i.GIF"
OnClientClick="return closePopup('News')" />
</td>
</tr>
<tr>
<td colspan="2">
<asp:Label ID="lblAddNewsError" runat="server" Text="" ForeColor="Red"></asp:Label>
</td>
</tr>
<tr>
<td>News Title:</td><td>
<asp:TextBox ID="txtNewTitle" Width="250px" runat="server" MaxLength="500"></asp:TextBox>
</td><td>
<asp:RequiredFieldValidator ID="rfvNewsTitle" runat="server"
ControlToValidate="txtNewTitle" ErrorMessage="*" ToolTip="Enter news title"
ValidationGroup="AddNews"></asp:RequiredFieldValidator>
</td>
</tr>
<tr>
<td>Upload News Video</td><td>
<asp:FileUpload ID="FileUpload1" runat="server" />
</td><td><asp:RegularExpressionValidator ID="RegularExpressionValidator1"
runat="server" ControlToValidate="FileUpload1"
ErrorMessage="Invalid video File"
ValidationExpression="^([0-9a-zA-Z_\-~ :\\])+(.avi|.AVI|.wmv|.WMV|.flv|.FLV|.mpg|.MPG|.mp4|.MP4)$"
ToolTip="Only allow avi, wmv, flv, mpg, mp4 formats video files"
ValidationGroup="AddNews"></asp:RegularExpressionValidator></td>
</tr>
<tr style="height: 5px">
<td>
</td>
</tr>
</table>
<div>
<table cellpadding="0" cellspacing="0" width="100%">
<tr>
<td style="width: 675px">
<FCKeditorV2:FCKeditor ID="FCKAddNewsContent" basepath="~/fckeditor/" runat="server" Height="300px"></FCKeditorV2:FCKeditor>
</td>
<td valign="top">
</td>
</tr>
<tr>
<td style="text-align:right">
<asp:Button ID="btnAddNews" runat="server" Text="Add News"
onclick="btnAddNews_Click" ValidationGroup="AddNews" />
<asp:Button ID="btnClose"
runat="server" Text="Close" OnClientClick="return closePopup('News')"
CausesValidation="False" /></td><td></td>
</tr>
</table>
</div>
</div>
</ContentTemplate>
<Triggers>
<asp:PostBackTrigger ControlID="btnAddNews" />
</Triggers>
</asp:UpdatePanel>
</asp:Panel>
as you see my one button also mentioned in postback trigger as i click on this button the result which i got is
can anyone help me out from this problem.
only one thing i just need in web.config and make it working
<httpRuntime executionTimeout="90" maxRequestLength="2000000" useFullyQualifiedRedirectUrl="false" requestLengthDiskThreshold="8192"/>
Point up my answer if you got your solution.
You can set Triggers on update panel. After that you can get file at server side.
<Triggers>
<ajax:PostBackTrigger ControlID="btnAddNews" />
</Triggers>
Hope it will help.

Categories