The main idea is to replicate what we see on the Banks or American Express sites, where a MODAL Popup appears to they tell us that the session "is going" to expire.
To this, I wanted to add an "Auto-Close" Popup event that will happen after XX seconds and then I will want to call a button event Onclick to "auto save" the current work, before redirecting the user to the Logout page.
So mainly I would like to know what's the best way to do the following:
1) Display a MODAL Message after let's say 1 minute (for testing purposes). This could be a DIV appearing on top of the current page, or a Dialog Message Box both MODAL.
2) Display a message and also a Reverse Timer, something like "Please save your work before the session expires"
3) Auto Close (or hide) that Message dialog after XX seconds
4) Call a button onclick event.
BackEnd is ASP.NET using C#
Something like this will get you started:
setTimeout(WarnTheUser,10000);//fires after 10 seconds
function WarnTheUser()
{
document.getElementById('warningDiv').innerHTML="<H1>This page will auto save in 1 minute</H1>"; //or whatever
setTimeout(saveData,60000);
}
function saveData()
{
form.submit();//adjust accordingly
}
jsfiddle.
Related
I'm a newbie. I need to be shown a notification using bootstrap when executing server code. only the written code works for me. I do not know how to call a notification when executing code.
static MessageBox()
{
// Create the store
pageTable = new Dictionary<Page, Queue>();
}
public static void Show(string str)
{
// Lets find out what page is sending the request
Page page = HttpContext.Current.Handler as Page;
// If a valid page is found
if (page != null)
{
// Check if this page is requesting message show for the first time
if (pageTable.ContainsKey(page) == false)
{
// Lets create a message queue dedicated for this page.
pageTable.Add(page, new Queue());
}
// Let us add messages of this to the queue now
pageTable[page].Enqueue(str);
// Now let put a hook on the page unload where we will show our message
page.Unload += new EventHandler(page_Unload);
}
}
static void page_Unload(object sender, EventArgs e)
{
// Lets find out which page is getting unloaded
Page page = sender as Page;
// If a valid page is found
if (page != null)
{
// Extract the messages for this page and push them to client side
HttpContext.Current.Response.Write
("<script>alert('" + pageTable[page].Dequeue() + "');</script>");
}
}
but this is a standard page notification.
the call occurs as follows
<asp:LinkButton runat="server" id="LinkButton1" cssclass="badge badge-pill badge-info" commandargument='<%#Eval("tabel")%>' commandname="tabel">tur</asp:LinkButton>
MessageBox.Show("test message");
Well, it really depends on the bootstrap dialog or say "toast" message you looking to display.
For a pop dialog (say confirm to delete), I find jQuery.UI gives you MUCH more control. (and you can control the location of the pop dialog).
For a "message" notificaiton, then I suggest say jQuery toast.
So, in this form for example, I have a delete button. And in fact the WHOLE form was popped as a dialog from the grid view behind:
Then when I clicked on the delete button, I poped another dialog to confirm the delete.
The code to pop that delete dialog was a js routine. And if it returns true, then the server side button runs, and if false, then the server side button code does NOT run.
The button code looked like this:
<button id="cmdDelete" runat="server" class="btn myshadow" style="margin-left:15px"
type="button"
onserverclick="cmdDelete_ServerClick"
onclick="if (!MyConfirmDel(this)) {return false};" >
<span aria-hidden="true" class="glyphicon glyphicon-trash"> Delete</span>
</button>
So, I have both a server side event (plane jane .net code).
And I have a client side event - JavaScript.
So, the js routine MyConfirmDel(this) runs the client side js code, and that was this:
var MyConfirmDelOK = false
function MyConfirmDel(Btn) {
if (MyConfirmDelOK) {
MyConfirmDelOK = false
return true
}
var myDialog = $("#mydelpop");
myDialog.dialog({
title: "Delete Hotel",
width: "26em",
modal: true,
dialogClass: 'ui-widget-shadow',
position: { my: "left top", at: "right bottom", of: Btn },
buttons: {
Delete: function () {
myDialog.dialog('close')
MyConfirmDelOK= true
$(Btn).click()
},
cancel: function () {
myDialog.dialog('close')
}
}
});
}
But, maybe by notification you mean a toast message:
So, when I for example hit this button, I get a pop dialog to confirm (works like above), and then I trigger a toast message.
I have BOTH routine setup to pop dialogs from the server side code, and also a toast message routine that shows a notification as jquery toast.
This example:
the server side code to pop the notification is this:
Protected Sub cmdReSet_ServerClick(sender As Object, e As EventArgs)
MySqlExecute("exec MyRestore")
GridView1.DataBind()
MyToast(Me.Page, cmdReSet.ClientID, "Data Restored", "Data re-set back to original", "6000")
End Sub
And MyToast routine is this that injects the js routine to run.
Sub MyToast(my As Page, ctrlBeside As String, Heading As String,
strText As String,
Optional strDelay As String = "3000")
' same as Mytoast, but a js function called toastcall()
' MUST be placed on the page
' any master page will have this function
' ctrlBesite - do NOT pass # - so Button1 you pass "Button1"
Dim strScipt As String =
"toastcall('#ctrlBeside','#Heading','#Text','#strDelay');"
strScipt = strScipt.Replace("#ctrlBeside", ctrlBeside)
strScipt = strScipt.Replace("#Heading", Heading)
strScipt = strScipt.Replace("#Text", strText)
strScipt = strScipt.Replace("#strDelay", strDelay)
ScriptManager.RegisterStartupScript(my, my.GetType(), "mytoast", strScipt, True)
End Sub
So, it not clear if you looking for a pop dialog or confirm dialog to be triggered from server side code, or a toast like notification that you want to display, and use server side code to do this as per above.
If you want say a "working - please wait" notification, then I suggest the above toast message. (set the toast message to much longer then the processing routine). when your code behind is done, then the page life cycle is completed, and the toast message will go away without any additonal code.
So, attach a client side and server side event to the one button. You click, and the client side toast message will appear, and THEN your server side code runs. When done, with a post-back cycle complete, then as noted, the toast message, or even dialog message will go away on its own.
I love the look and feel of the bootstrap dialogs, but they are a royal pain to position on the form, and even more of a pain to easy pop with js code, so I used jquery.UI dialogs as a result. You get MUCH better control in code, but as noted, I don't particular like the look and feel of the jQuery.UI dialogs - they look somewhat dated.
so you can as the above toast message routine shows, EASY trigger a message from the server side, but it going to occur AFTER the button code (server side) processing is done. If you need the toast message to appear at button click time, then you HAVE to trigger that with client side code.
I suppose you could use server side code, but you would have to:
load up - set the js routine to run + display - allow page code to complete
then in js code, display message, and then trigger another post back
In this case, as noted, better would be to have a client side message event appear, and then have the client side js code THEN call a web method. When the web method is done, then upon return from the web method call, you can close your dialog. This approach is probably the best, but you you wanting to trigger this from code behind, the you have to split this out into two routines:
First routine - trigger js code (like I did for toast)
That first routine ALSO THEN can call a web method while the message is display, and when done, hide message.
So, you can't for example place both the "please wait" and have a long running process occur in the SAME routine (code behind). (the exception I suppose would be adopting SignalR -- which is quite a big system and adopting for what amounts to the goal of a simple message is over kill).
I am trying to make a button that when clicked call a procedure but also opens in a pop-up. I can't find how to do it because all the search i did only tells me to put it on te clientclick :
<asp:Button ID="cmbGen" runat="server" Width="240px" Text="Générer le rapport" OnClick="cmbGen_Click"></asp:Button>
the onclick opens up a pdf, and its not working well on Ie, so, to solve this i would like the pdf to opens in a pop up
not sure what i could do.. anyone got an idea ?
EDIT
The code is pretty big, but basicaly, depending on what checkboxed were checked, it will create a pdf file and show it. this works pretty well, but it opens up in the current page, i would like to make it in a pop-up
A Button always submits a postback to the server on the current window, so you can't directly tie a new window to it. You'll need to write some javascript to do that, and open a popup window.
You can do this lots of ways - you can hook up an event handler to the button so when it's clicked, it immediately opens a new window, and that window is pointed to your server code which returns the PDF. Or you can do a regular postback, and return some javascript that pops up a new window. But either way, javascript is the only way to get a popup from a form button.
Liam's suggestion of making a link instead of a button is probably the simplest method - you can throw an image on that link to make it look like a button if you want.
EDIT
Based on your comment on the other answer, your simplest bet would be to return some javascript on the button click method, using ClientScript.RegisterStartupScript or whatever Microsoft is recommending these days. You can do whatever logic you need to first, then get that into a new handler either through session or querystring parameters, and have the client pop up a new window pointing to that handler.
Can't see you c# so it's not 100% sure what you want but why use a asp:Button at all:
Générer le rapport
I have a home/main menu page. There's a link to the form. If you run the form with inputs, you get Excel output. If you click 'open' to open that output in the browser, the back-button takes you to the home/main menu.
Which is understandable, since if the form page is X.aspx, the binaryWrite that outputs the Excel doesn't really change that.
The problem is that if there's a postback, the back button takes you to the form page. This is inconsistent. If I run the page or a drop down causes a postback, I really want the back-button to take me to the form field, so that I can run the excel sheet again.
Things I've tried.
I tried adding a location header.
e.ContentFileName = "ELTFile.Output.xls";
Before the response.Writing ...
private void SendFileToBrowser(DownloadFileEventArgs e)
{
if (!e.Cancel && e.FileObject != null)
{
this.Page.Response.Clear();
this.Page.Response.ClearContent();
this.Page.Response.AddHeader("Content-Disposition", string.Format("inline; filename={0}", e.ContentFileName));
this.Page.Response.AddHeader("Content-Length", e.FileObject.LongLength.ToString());
this.Page.Response.AddHeader("Location", e.ContentFileName);
this.Page.Response.ContentType = e.ContentType;
this.Page.Response.BinaryWrite(e.FileObject);
this.Page.Response.End();
}
}
And I tried
Response.Cache.SetCacheability(HttpCacheability.Public);
As well as
Response.Cache.SetCacheability(HttpCacheability.Server);
But basically, depending on whether or not I post back before I click the 'Submit' button to generate the Excel, I get the main menu (don't want) or the form page (want). I want the form page every time. Basically I want to tell the browser "I know it's not really a different page, but treat it that way, will ya please?"
You cannot directly add pages to a browser history.
You could make your application such that the form is always a page ahead of the excel output.
To do this, have a separate page to output the excel.
When you have the inputs to generate the excel, Response.Redirect to the generation page.
This will keep your input form in the browser history.
Note: you could redirect to the same page too if you liked, but that would need you to track it.
using (DataServer server = new DataServer())
{
server.ExecuteNonQuery(CommandType.Text, updateuser, param);
}
MessageBox.Show("User succesfully updated");
I have a update button when The fields are updated I show a message box, but the problem is the message box is behind the browser. I have to minimize the browser to close the message box, at the same time I am able to navigate in the website without closing the message box, I want to blur out the remaing area in the website when the message box is displayed. How can I do this in my website.
In this case you would either want to throw up an alert with JavaScript, or use a dialog of some sort.
To throw up an alert, you can do this:
Page.ClientScript.RegisterStartupScript(GetType(), "UserDialogScript", "alert(\"User successfully updated\");", true);
As for using a dialog, I would suggest the ModalPopupExtender or the jQuery UI Dialog.
ModalPopupExtender:
http://www.asp.net/ajaxlibrary/AjaxControlToolkitSampleSite/modalpopup/modalpopup.aspx
jQuery UI Dialog:
http://jqueryui.com/demos/dialog/
Don't do it this way. Instead, emit client side JavaScript to pop up an alert dialog, or add a div that a user can click to make it go away. You can also use a more proper UX convention of adding a message div that simply states "record updated" or similar, in a very specific color, so the user knows what to look for.
The idea of popping up a message box sounds tempting, but stick this out on a server and hit it from a browser on a separate box and you will quickly find out why this is an extremely bad idea.
i have a doubt on how to show a popup???`
if (machineID.Count != 0)
{
checkMachineGrpState(machineID);
}
else
{
FormsAuthentication.SignOut();
Session.Abandon();
Response.Redirect("~/Default.aspx");
}
Ok now what im am doing in else statement is signing out the user and sending him back to the log out page....
I need to how him some pop up message that he is being signed out i cant figure out how to do that...
i tried messagebox but it wont work with servver and client side..
I want to use AJAX but dont know how...
any suggestions.... thanks
There are a couple of different ways you can go about this. Here's a simple example.
Your Default.aspx page will need to display the message to the user when they've logged out, so you might want a way to distinguish when you want to show the message. You could add a query string param to your redirect, like:
Response.Redirect("~/Default.aspx?ShowLogout=true");
Now on your Default.aspx page, you have a number of options. You could simply show a hidden control on the page, or write out some Javascript to show an alert box:
if (!String.IsNullOrEmpty(Request.QueryString["ShowLogout"]))
ClientScript.RegisterStartupScript(this.GetType(), "LogoutMsg", "<script>alert('You have been logged out.');</script>");
This will simply write out a script tag that runs when the user views the page. From here, you can make it more elegant by showing the user a better dialog box. For example, you could use jQuery to create a nice looking dialog box, and call the Javascript function to show it rather than calling alert in my example.