I have this piece of code in my aspx page open a modal popup. I found this code online but for some reason the page refreshes and the popup does not appear. I tried several code snippets but the issue keeps on occurring. It must be an issue with my page.
This is my .aspx code
<%# Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<asp:Content runat="server" ID="BodyContent" ContentPlaceHolderID="MainContent">
<style type="text/css">
.ModalPopupBG
{
background-color: Gray;
filter: alpha(opacity=70);
opacity: 0.7;
}
.popup
{
background:white;
}
</style>
<script>
function onAgree() {
alert("Thank you for your approval")
}
function onDisagree() {
alert("I appreciate your feedback; i will work harder next time")
}
</script>
<div>
<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server"></asp:ToolkitScriptManager>
<p>This is a paragraph.</p>
<p>This is a paragraph.</p>
<p>This is a paragraph.</p>
<asp:Button ID="Button1" runat="server" Text="feedback"/>
<asp:Panel ID="Panel1" runat="server" CssClass ="popup">
please give me your feedback about the paragraph above?
<hr />
<asp:Button ID="btnagree" runat="server" Text="Agree" />
<asp:Button ID="btndisagree" runat="server" Text="Disagree" />
</asp:Panel>
<asp:ModalPopupExtender ID="ModalPopupExtender1"
runat="server"
TargetControlID ="Button1"
PopupControlID="Panel1"
BackgroundCssClass="modalBackground"
DropShadow="true"
OkControlID="btnagree"
CancelControlID="btndisagree"
OnOkScript="onAgree()"
OnCancelScript ="onDisagree()">
<Animations>
<OnShown>
<Fadein />
</OnShown>
<OnHiding>
<Fadeout />
</OnHiding>
</Animations>
</asp:ModalPopupExtender>
</div>
</asp:Content>
Related
i want that on button click it check first validator then print command is executed
here is my ASPX Code:
<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" Runat="Server">
<style type="text/css">
.style1
{
}
#media print
{
.header, .style1, .footer,.hide
{
display:none
}
}
</style>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" Runat="Server">
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="TextBox1"
ErrorMessage="RequiredFieldValidator" style="color: #FF0000"></asp:RequiredFieldValidator>
<br />
<asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="window.print();" />
</asp:Content>
problem is that when i click on button it execute the print function and dont check validator.
The JavaScript OnClientClick will fire before your page is validated. You could try validating the page before printing it.
function Validate() {
if(Page_ClientValidate())
window.print();
}
Then call it like so.
<asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="Validate();" />
Set the CausesValidation Property of the button to true!
I was trying differents ways to make this work but any success. I am trying to integrate mootools with an asp.net application. I just want to use it to add some effects to my site. I am also ussing update panels, scriptmanager because dont want full postbacks. On the console raise an error TypeError: clientID.startsWith is not a function and when make an update the brwoser reset....
This is the whole code. Hope help me and thanks agan!
<%# Master Language="C#" AutoEventWireup="true" CodeFile="Default.master.cs" Inherits="guiaEscoles" %>
<!DOCTYPE html>
<html>
<head runat="server">
<title>Title go here</title>
<link href="~/css/main.css" rel="stylesheet" type="text/css" />
</head>
<body>
<form runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" LoadScriptsBeforeUI="true" EnablePartialRendering="true" >
<Scripts>
<asp:ScriptReference Path="~/scripts/mootools-core-1.4.5-full-compat-yc.js"></asp:ScriptReference>
<asp:ScriptReference Path="~/scripts/mootools-more-1.4.0.1-yc.js" ></asp:ScriptReference>
<asp:ScriptReference Path="~/scripts/jsecoles.js"></asp:ScriptReference>
</Scripts>
</asp:ScriptManager>
<asp:Panel runat="server" DefaultButton="" >
<asp:UpdatePanel runat="server" UpdateMode="Always">
<ContentTemplate>
<asp:DropDownList runat="server" ID="DropDownListCountries" >
</asp:DropDownList>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Panel>
<asp:ContentPlaceHolder ID="MainContent" runat="server" />
</form>
</body>
</html>
<%# Page Title="" Language="C#" MasterPageFile="~/Default.master" AutoEventWireup="true" CodeFile="search.aspx.cs" Inherits="searchschool" %>
<%# MasterType VirtualPath="~/Default.master" %>
<asp:Content ID="ContentSearch" ContentPlaceHolderID="MainContent" runat="Server">
<div id="PlaceItem" runat="server">
<div id="ulLugar" class="">
<ul>
<li>
<asp:DropDownList runat="server" ID="DropDownListCountryBottom" AutoPostBack="true" OnSelectedIndexChanged="DropDownListCountryBottom_SelectedIndexChanged" EnableViewState="true">
</asp:DropDownList>
</li>
<li>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<Triggers>
<asp:AsyncPostBackTrigger ControlID="DropDownListCountryBottom" EventName="SelectedIndexChanged" />
</Triggers>
<ContentTemplate>
<asp:DropDownList runat="server" ID="DropDownListCounty" OnDataBound="DropDownListCounty_DataBound" AutoPostBack="true" OnSelectedIndexChanged="DropDownListCounty_SelectedIndexChanged" EnableViewState="true">
</asp:DropDownList>
</ContentTemplate>
</asp:UpdatePanel>
</li>
<li>
<asp:DropDownList runat="server" ID="DropDownListDistrict" OnSelectedIndexChanged="DropDownListDistrict_SelectedIndexChanged" AutoPostBack="true" EnableViewState="true">
</asp:DropDownList>
</li>
</ul>
</div>
<div id="divStudies" >
<asp:CheckBox ID="CheckBoxStudies" runat="server" Text="<%$ Resources:Escoles, CheckBoxPQPILabel %>" OnCheckedChanged="CheckBoxStudies_CheckedChanged" AutoPostBack="true" />
</div>
<asp:Repeater ID="RepeaterThemes" runat="server" OnItemDataBound="RepeaterThemes_ItemDataBound">
<HeaderTemplate>
<ul>
</HeaderTemplate>
<FooterTemplate></ul></FooterTemplate>
<ItemTemplate>
<li class="liTema">
<asp:CheckBox ID="CheckBoxTheme" runat="server" OnCheckedChanged="CheckBoxTheme_CheckedChanged" AutoPostBack="true" EnableViewState="false" /></li>
</ItemTemplate>
</asp:Repeater>
<asp:UpdatePanel runat="server" UpdateMode="Always">
<ContentTemplate>
<asp:GridView runat="server" ID="GridViewEscoles" CellPadding="0" CellSpacing="0" BorderStyle="None">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<asp:Label Text='<%# Eval("Field_1") %>' runat="server" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Content>
here is the myjs file:
window.addEvent('domready', function () {
alert("Hello");
//var countTotal = $$('.liTema').length;
//alert(countTotal);
});
That is due to a conflict between mootools & Microsoft Ajax code, According to mootools they blamed the error on microsoft's code. I was looking for a solution but didn't find till now
I have the below Place holder between the head tags on a master page which all pages at some stage inherit from:
<asp:ContentPlaceHolder ID="cphHead" runat="server" />
I then have the below content on a page that inherits from the master page:
<asp:Content ID="Content1" ContentPlaceHolderID="cphHead" Runat="Server">
<asp:Literal ID="litMetaTitle" runat="server" />
<asp:Literal ID="litMetaDescription" runat="server" />
<asp:Literal ID="litMetaKeywords" runat="server" />
<asp:ContentPlaceHolder ID="CphHeaderContent" runat="server" />
</asp:Content>
As you can see this has another place holder in it, from this page inherits another page with the below content:
<asp:Content ID="ContentHeader" runat="server" ContentPlaceHolderID="CphHeaderContent">
<asp:Literal ID="TheId" runat="server" />
</asp:Content>
The literal is being built with a string builder in the code behind:
private void xxx(Order order)
{
//...Building string with string builder
TheId.Text = xxx.ToString();
}
This literal is not appearing in the head of this page when I view it in the browser? Does anyone have any idea as to why? If I add something like below between the content tags:
<asp:Content ID="ContentHeader" runat="server" ContentPlaceHolderID="CphHeaderContent">
<asp:Literal ID="TheId" runat="server" />
<script src="/Media/Javascript/xxx.js"></script><--ADDED!
</asp:Content>
The <script src="/Media/Javascript/xxx.js"></script> will appear in the head? Its just the literal that wont? Why is this?
I have an ajax toolkit calendar extender attached to my textbox and i a trying to fire the OnTextChanged after the date was entered into the textbox.
The thing is i don't want the user to enter data manually so i disabled the textbox but the event won't fire for a disabled text box.
is there anyway around it? i thought about changing to a label but is doesn't have OnTextChanged event.
Thanks
<asp:TableCell CssClass="cssWidth" Width="150px">
<asp:CalendarExtender ID="CalendarExtender1" PopupButtonID="Image1" runat="server" TargetControlID="TextBoxAddDate" Format="dd/MM/yyyy"></asp:CalendarExtender>
<asp:TextBox ID="TextBoxAddDate" ReadOnly="true" CssClass="cssWidth" ToolTip="תאריך הוספה" runat="server" Style="font-size: large;background-color:aliceblue;" AutoPostBack="true" AutoCompleteType="Search" MaxLength="0" TextMode="SingleLine" OnTextChanged="txtSearch_TextChanged" ViewStateMode="Enabled" autocomplete="off" >
</asp:TextBox> 
<asp:ImageButton runat="Server" ID="Image1"
ImageUrl="~/Calendar_scheduleHS.png" AlternateText="Click to show calendar" /><br />
</asp:TableCell>
Can you use ReadOnly instead of Enabled = false?
UPDATE:
Ok, this is the complete solution that worked for me:
<%# Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
CodeBehind="Default.aspx.cs" Inherits="WebApplication1._Default" %>
<%# Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
<script type="text/javascript">
function dateSelectionChanged(x) {
debugger;
javascript: __doPostBack('TextBoxAddDate', '')
}
</script>
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<h2>
Welcome to ASP.NET!
</h2>
<p>
To learn more about ASP.NET visit www.asp.net.
</p>
<p>
You can also find <a href="http://go.microsoft.com/fwlink/?LinkID=152368&clcid=0x409"
title="MSDN ASP.NET Docs">documentation on ASP.NET at MSDN</a>.
</p>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:CalendarExtender ID="CalendarExtender1" PopupButtonID="Image1" runat="server" TargetControlID="TextBoxAddDate" Format="dd/MM/yyyy" OnClientDateSelectionChanged="dateSelectionChanged" ></asp:CalendarExtender>
<asp:TextBox ID="TextBoxAddDate" CssClass="cssWidth" ToolTip="תאריך הוספה" runat="server" Style="font-size: large;background-color:aliceblue;" AutoCompleteType="Search" MaxLength="0" TextMode="SingleLine" OnTextChanged="txtSearch_TextChanged" ViewStateMode="Enabled">
</asp:TextBox> 
<asp:ImageButton runat="Server" ID="Image1"
ImageUrl="~/Calendar_scheduleHS.png" AlternateText="Click to show calendar" /><br />
</ContentTemplate>
</asp:UpdatePanel>
</asp:Content>
It seems that the CalendarExtender "steals" away the events from the texbox it uses.
Using this approach I managed to fire up the OnTextChanged event and the handler txtSearch_TextChanged gets executed.
Did you make the textbox ReadOnly?
I have spent hours Googling and searching past questions but have struggled to get anywhere with those answers (be it I can't get it into my solution correctly or it isn't suitable for me as they don't have master pages).
My question is, I have a couple of asp.net pages which can take a while to load (sometimes 5 seconds+) as there is a lot of data being requested from a database on the Page_Load method. To stop users from thinking that the page has crashed and either refreshing the page or doing something else, I want to put up a Loading message hiding everything else on the page (apart from the menu) while it loads.
I am using ASP.Net 4.0 with master pages and coding in C#.
The one where I get the most success is using the UpdatePanel on my master page where the content template covers the contentplaceholder, however I know this is not the best way to go about it and anyway it only shows up once, i.e. The user logs in, the loading message appears and once all the data has loaded on the home page (dashboard.aspx) the loading message disappears, which is kind of what I want. However if the user goes away from that page and then clicks home the loading message never appears again, just takes a while to load. It also never appears for any other page that takes a noticeable time to load.
Below is the body of the master.aspx
<body>
<form runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<div class="page">
<div class="header">
<div class="title">
<h1>
Header
</h1>
</div>
<div class="loginDisplay">
<asp:LoginView ID="HeadLoginView" runat="server" EnableViewState="false">
<AnonymousTemplate>
[ Log In
]
</AnonymousTemplate>
<LoggedInTemplate>
Welcome <span class="bold">
<asp:LoginName ID="HeadLoginName" runat="server" />
</span>! [
<asp:LoginStatus ID="HeadLoginStatus" runat="server" LogoutAction="Redirect" LogoutText="Log Out"
LogoutPageUrl="~/Default.aspx" />
]
</LoggedInTemplate>
</asp:LoginView>
</div>
<div class="clear hideSkiplink">
<asp:Menu ID="NavigationMenu" runat="server" CssClass="menu" EnableViewState="false"
IncludeStyleBlock="false" Orientation="Horizontal" OnMenuItemClick="NavigationMenu_MenuItemClick">
<Items>
<asp:MenuItem Text="Home" />
<asp:MenuItem Text="About" />
</Items>
</asp:Menu>
</div>
</div>
<div class="main">
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:ContentPlaceHolder ID="MainContent" runat="server" />
<asp:UpdateProgress ID="UpdateProgress1" runat="server">
<ProgressTemplate>
<asp:Panel ID="Panel1" runat="server" HorizontalAlign="Center">
<asp:Image ID="Image1" runat="server" ImageUrl="~/Images/loader.gif" />
</asp:Panel>
</ProgressTemplate>
</asp:UpdateProgress>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanelAnimationExtender ID="UpdatePanel1_UpdatePanelAnimationExtender"
runat="server" Enabled="True" TargetControlID="UpdatePanel1">
</asp:UpdatePanelAnimationExtender>
</div>
<div class="clear">
</div>
</div>
<div class="footer">
</div>
</form>
And below is the page for the dashboard.aspx (a page which has a long loading time)
<asp:Panel ID="PanelWelcome" runat="server">
<h1>
Welcome
<asp:Label ID="LabelUserName" runat="server" Text="[User Name]" /> to your
personal Dashboard.</h1>
<table width="100%" cellpadding="5px">
<tr>
<td style="width: 70%" valign="top">
<asp:Panel ID="Panel2" runat="server">
<p>
</p>
<h4>
Up and Coming </h4>
<br />
<asp:GridView ID="GridViewItin" runat="server" Width="100%" HorizontalAlign="Left"
OnRowDataBound="GridViewItin_RowDataBound">
</asp:GridView>
</asp:Panel>
</td>
<td style="width: 30%">
<asp:Panel ID="PanelProfile" runat="server">
<asp:ImageButton ID="ImageButtonProfile" runat="server" ImageUrl="~/Images/BlankProfile.jpg"
Width="150px" /><br />
<h4>
Name:</h4>
<asp:Label ID="LabelPARname" runat="server" Text="[Person Name]"></asp:Label>
<h4>
Company:</h4>
<asp:Label ID="LabelBARname" runat="server" Text="[Company Name]"></asp:Label>
<h4>
Date of Birth:</h4>
<asp:Label ID="LabelPARdob" runat="server" Text="[DOB]"></asp:Label><br />
<asp:LinkButton ID="LinkButtonProfilePage" runat="server" OnClick="LinkButtonProfilePage_Click">More details...</asp:LinkButton>
</asp:Panel>
</td>
</tr>
</table>
</asp:Panel>
Could you please show me the best way to go about it and where I am going wrong? Also how I can hide the ContentTemplate when the UpdateProgress template is showing that would be great?
Thanks.
Okay so I figured it out what I was doing wrong, I thought I would post what I did to hopefully help someone else who might end up with the same issues...
Basically I hadn't thought about it logically. There are controls outside the update panel such as a NavigationMenu which would never fire the update progress because they had nothing to do with the Panel! I had to add triggers to the update panel to deal with all the things that happen outside the panel.
So, in my master page I had the following code
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:ContentPlaceHolder ID="MainContent" runat="server" />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="NavigationMenu" />
</Triggers>
</asp:UpdatePanel>
<asp:UpdateProgress ID="progress" runat="server" DynamicLayout="true" DisplayAfter="0">
<ProgressTemplate>
<div id="overlay">
<div id="modalprogress">
<div id="theprogress">
<asp:Image ID="loader" runat="server" ImageAlign="AbsMiddle" ImageUrl="~/images/loader.gif" />
Please wait...
</div>
</div>
</div>
</ProgressTemplate>
</asp:UpdateProgress>
<asp:UpdatePanelAnimationExtender ID="UpdatePanel1_UpdatePanelAnimationExtender"
runat="server" Enabled="True" TargetControlID="UpdatePanel1">
</asp:UpdatePanelAnimationExtender>
Hopefully that will help someone else!
You can use UpdateProgress control. You can get it From Toll box under Ajax Extensions Tab.
I am describing you a scenario:
Suppose I have One Upadate Panel name UpdatePnl1 , In that I have a Button Say GO.when we hit on go it should redirect to another page. before that it will promt you please wait.
Now my Code will be like that
<asp:UpdatePanel ID="UpdatePnl1" runat="server">
<ContentTemplate>
<asp:Button ID="BtnGO" runat="server" Text="GO" onclick="BtnGO_Click"/>
</ContentTemplate>
</asp:Updatepanel>
Button click code:
protected void BtnGO_Click(object sender, EventArgs e)
{
Response.Redirect("Example.aspx");
}
Now here is the code for UpdateProgress what you need to add
<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePnl1" >
<ProgressTemplate>
<asp:Label ID="LblWaitMsg" runat="server" Text="Processing Request, Please Wait..."></asp:Label>
</ProgressTemplate>
</asp:UpdateProgress>
Note: Your page Should contain ScriptManager.