I'm having surprisingly bad luck finding a decent resource for this. But What I'm doing is creating a list of tickets using a ListView. One of the controls in the item template is a link button that shows the header of the ticket. When the user clicks the link button, I want to open a modal window that shows the ticket in readable format. To get the ticket, I'll be passing that page a variable and it'll do the rest; nothing complicated. The page will have 3 buttons and the windows needs to close when you click one of them.
Now, I figured out how to use the ModalPopupExtender from the Ajax tookit more or less. You create the panel in it's own div which stays hidden. I created a click event that basically uses a webclient to download the html from the page and insert it into that div's innerHtml. This seems to work the first time. But as soon as you click a different link, the page pukes and says something about it being in an illegal state.
I'm not sure if I'm going about this wrong, and I can't find any decent examples of how to do this. Well there's one, but the english is hard to understand and it's in VB instead of C#. Any help?
<%# Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<form id="form1" runat="server">
<div>
<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
</asp:ToolkitScriptManager>
<br />
<asp:ModalPopupExtender
DropShadow="true"
OkControlID="btnOk"
CancelControlID="btnClose"
runat="server"
PopupControlID="Panel1"
id="ModalPopupExtender1"
TargetControlID="Button1" />
<asp:Panel ID="Panel1" runat="server" CssClass="modalPopup" style="display:none;">
This is basic modal popup.
<br /><br />
<asp:Button ID="btnOk" runat="server" Text="Ok" />
<asp:Button ID="btnClose" runat="server" Text="Close Me" />
<iframe src="http://www.google.com"></iframe>
</asp:Panel>
<asp:Button ID="Button1" runat="server" Text="First Modal Popup" />
</div>
</form>
Try this it should work.
Related
Right now I have an application that is currently using PrinceXML to make PDFs in our application, but we would like to move towards using Telerik as a solution. The only problem I could foresee is that it expects all the rendering to be done on the markup prior to calling it. For example, a form might have some JavaScript on the page that needs to run when the page loads to fully layout the form correctly. If Telerik's component can't handle that (meaning the form has to be fully rendered server-side prior to) then that's going to be a problem. I'm having a hard time finding documentation on whether the Telerik Document Processing Library handles this.
Telerik offers another solution for client-side export, e.g.
<telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
<telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
<div class="demo-container size-medium">
<div class="buttonsContainer">
<telerik:RadButton RenderMode="Lightweight" runat="server" OnClientClicked="exportPDF" Text="Export page to PDF" AutoPostBack="false" UseSubmitBehavior="false"></telerik:RadButton>
<telerik:RadButton RenderMode="Lightweight" runat="server" OnClientClicked="exportImage" Text="Export page to Image" AutoPostBack="false" UseSubmitBehavior="false"></telerik:RadButton>
<telerik:RadButton RenderMode="Lightweight" runat="server" OnClientClicked="exportSVG" Text="Export page to SVG" AutoPostBack="false" UseSubmitBehavior="false"></telerik:RadButton>
</div>
<telerik:RadClientExportManager runat="server" ID="RadClientExportManager1">
</telerik:RadClientExportManager>
</div>
<script>
var $ = $telerik.$;
function exportPDF() {
$find('<%=RadClientExportManager1.ClientID%>').exportPDF($("#main"));
}
function exportImage() {
$find('<%=RadClientExportManager1.ClientID%>').exportImage($("#main"));
}
function exportSVG() {
$find('<%=RadClientExportManager1.ClientID%>').exportSVG($("#main"));
}
</script>
Please take a look at the following demos:
https://demos.telerik.com/aspnet-ajax/client-export-manager/functionality/export-whole-pages/defaultcs.aspx
https://demos.telerik.com/kendo-ui/pdf-export/index and https://demos.telerik.com/kendo-ui/pdf-export/page-layout
I have several ImageButtons on the top of my page, then I have a textbox and button in the middle. If you type in the textbox then hit enter on the keyboard the browser follows the link of the first ImageButton instead of the submit button next to the textbox. I have ran into this in the pase and had to put the imagebuttons on the bottom of the page for it to work correctly, that is not an ok fix in this case. I tried setting UseSubmitBehavior="true" , but that does nothing. I tried putting the textbox and button in a separate DIV and a separate panel, didn't work either
TOP of the page
<div style="position:absolute; left: 70% ; top: 5%;">
<asp:ImageButton ID="imgFB" runat="server" ImageUrl="Images/facebook_icon.jpg" PostBackUrl="http://www.facebook.com/832586561" />
<asp:ImageButton ID="imgLI" runat="server" ImageUrl="Images/linkedin_logo.jpg" PostBackUrl="http://www.linkedin.com/pub/scott-selby/33/304/44a" />
<asp:ImageButton ID="imgCB" runat="server" ImageUrl="Images/careerbuilder_logo.jpg" PostBackUrl="http://www.careerbuilder.com" />
<asp:ImageButton ID="imgCP" runat="server" ImageUrl="Images/codeplex_logo.jpg" PostBackUrl="http://www.codeplex.com" />
</div>
Middle of Page
<div ID="formPanel" runat="server" style="position:absolute; top:235px;">
<asp:TextBox ID="txtNewCity" runat="server"></asp:TextBox>
<asp:Button ID="btnChangeCity" runat="server" Text="Change City" UseSubmitBehavior="true" />
</div>
You may set the default button via <form/> attribute.
<form defaultbutton="btnChangeCity" id="form1" runat="server">
...
</form>
Or use Panel control to set default button.
<asp:Panel ID="Panel1" runat="server" DefaultButton="btnChangeCity">
<asp:TextBox ID="txtNewCity" runat="server"></asp:TextBox>
<asp:Button ID="btnChangeCity" runat="server" Text="Change City" />
</asp:Panel>
You surround your controls with <div> which is a good idea, but to have it run at all you also need <form>. In case you just didn't include it, the submit button also has to have OnClick="sub" attribute.
Read more here.
Say I have one full-page form, but within the form, there are two or more events that need to take place on submission: Login & Register
Site.Master:
<%# Master Language="C#" AutoEventWireup="true"
EnableViewState="true" CodeBehind="Site.Master.cs"
Inherits="Site.SiteMasterPage" %>
<!doctype>
<html>
<head runat="server">
<%-- stuff --%>
</head>
<body>
<form ID="MainForm" action="" runat="server">
<asp:Login id="LoginControl" runat="server" />
<asp:CreateUserWizard id="RegisterControl" runat="server" />
</form>
</body>
</html>
If my cursor is focused inside of an input type="text" for asp:Login, and I hit Return (with javascript off), the page submits, but I am not logged in.
The same thing happens when I attempt to register (filling out the createUserWizard and hitting the Return key instead of actually clicking "Register", firing some event)
Is there any non-JavaScript solution for getting the Return key to submit the proper, currently focused portion of the form?
The panel control allows you to define a default button within the scope of it's contents:
<asp:Panel runat="server" DefaultButton="submitButtonA">
<asp:LinkButton ID="submitButtonA" runat="server" Text="Submit A"/>
</asp:Panel>
<asp:Panel runat="server" DefaultButton="submitButtonB">
<asp:LinkButton ID="submitButtonB" runat="server" Text="Submit A"/>
</asp:Panel>
The default button sounds like it might be your friend tonight - http://msdn.microsoft.com/en-us/library/system.web.ui.htmlcontrols.htmlform.defaultbutton.aspx
Actually it might not be, I haven't ever tried it with no Javascript.
How can i automatically update a user control after a specific time without updating the whole aspx page. I haven't done it before. Any ideas would be appreciated.
i suppose you are using asp.net ajax and it has timer control.
check this example : http://ajax.net-tutorials.com/controls/timer-control/ and this video : http://www.asp.net/ajax/videos/how-do-i-use-the-aspnet-ajax-timer-control .
If you have the AJAX extension installed, you can use an UpdatePanel and the ContentTemplate to only refresh that region of your webpage when performing a Postback. You can put any content here, as a self created Usercontrol.
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<div>
<asp:Label ID="Label1" runat="Server"></asp:Label>
<br />
<asp:UpdatePanel ID="UpdatePanel1" runat="Server">
<ContentTemplate>
<asp:Label ID="Label2" runat="server"></asp:Label>
<br />
<br />
<asp:Button ID="Button2" runat="server" Text="Click Me Again" OnClick="Button2_Click"/>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
The idea would then be to use a Timer to perform a Postback of that UpdatePanel, as someone else has suggested a link for that.
I'm not really sure what you mean when you say "updating" but if you take a look at the life cycle of an active server page you will see that the whole page will be "refreshed" by the web server.
When the web server responds to a client request the entire content will be transformed to a page displayable by a browser and send to the client.
Update:
There was actually a hidden panel with validator in the user control that was causing page not to be valid on the first postback. Consider this issue resolved.
This is first time I am using this control and it is behaving rather strange. I have to click on the "Next" button twice for it to move to the next step. I tried explicitly setting active index, using MoveTo etc. Nothing works. Here is the markup for the control. Anybody has any ideas why?
<asp:Wizard ID="UserWizard" runat="server" ActiveStepIndex="0"
StartNextButtonImageUrl = "~/App_Themes/Default/images/buttons/continue.gif" StartNextButtonType="Image"
StepNextButtonType="Image" StepNextButtonImageUrl="~/App_Themes/Default/images/buttons/continue.gif"
FinishPreviousButtonImageUrl="~/App_Themes/Default/images/buttons/back.gif"
FinishPreviousButtonType="Image" FinishCompleteButtonImageUrl="~/App_Themes/Default/images/buttons/save.gif"
FinishCompleteButtonType="Image" CancelButtonType="Image" CancelButtonImageUrl="~/App_Themes/Default/images/buttons/back.gif"
DisplaySideBar="false" >
<WizardSteps>
<asp:WizardStep Title="User Profile" ID="UserProfile" runat="server">
<uhc:ctlUserProfileEdit ID="ctlUserProfileEdit" runat="server">
</uhc:ctlUserProfileEdit>
<br clear="all" />
<div>
<asp:ImageButton ID="cmdResetPassword" runat="server" ImageUrl="~/App_Themes/Default/images/buttons/resetpassword.gif" />
</div>
<div>
<asp:UpdatePanel ID="upSchools" runat="server" ChildrenAsTriggers="true">
<ContentTemplate>
<uhc:ctlSchoolLocationSelector ID="ctlSchoolLocationSelector" runat="server" />
</ContentTemplate>
</asp:UpdatePanel>
</div>
</asp:WizardStep>
<asp:WizardStep Title="Roles" ID="Roles" runat="server">
<uhc:ctlPermissionInternal ID="ctlPermissionInternal1" runat="server"></uhc:ctlPermissionInternal>
<uhc:ctlPermissionExternal ID="ctlPermissionExternal1" runat="server"></uhc:ctlPermissionExternal>
</asp:WizardStep>
</WizardSteps>
</asp:Wizard>
I don't know for sure if this is what's causing it, but I find it strange that there is an UpdatePanel within the Wizard control, rather than the Wizard Control within the update panel. This may be causing some strange behavior.
Can you change this and see if the problem resolves itself?