Trouble with page reload. ASP.NET - javascript

So what i have is a web application that uses c# code and javascript code. My javascript code generates some information dependant on the users input. Once this is finished it is saved using a ASP button. Attached to the asp button is a on client click and a on click event. the Javascript code validates the code and makes sure that the string that has been created is valid. If not a error message is sent to a hidden label. The C# code then checks that label and if it is empty (if there was no problem with validation) it executes the C# code. If it has a value inside then the error message from the hidden label is passed to a visible label using the c# code and shown to the user.
However if the error message is shown the page in automatically reloaded (as it is a button click event this always happens). and the users inputs are cleared from the screen.
Is there any way i can stop the page from reloading when the error message is shown?
CODE
Javascript:
if (goalnum > 0 && blocknum > 0 && playernum == 1 && goalnum == blocknum) {
mapsave = JSON.stringify(map);
document.getElementById('<%=mapsave.ClientID %>').value = mapsave;
}
else {
document.getElementById('<%=lblError.ClientID %>').value = "Your map must have one and only one player, one or more blocks, one or more goals and the number of blocks must match up with the number of goals";
}
C#
protected void btnSave_Click(object sender, EventArgs e)
{
if (mapsave.Value.ToString() == "")
{
lblResult.Text = lblError.Value;
}
else
{
AddNodeToXMLFile("filepath.xml", "TileMaps");
}
}

Do you return false on the button click? If not, even if validation has failed a new Post will fire.
Can you post the code perhaps?

Related

ASP GridView double click event only when edit

Hi I having a Gridview where I want to go in edit mode when double click happens:
if (e.Row.RowType == DataControlRowType.DataRow)
{
e.Row.Attributes["ondblclick"] = Page.ClientScript.GetPostBackClientHyperlink(GridView1, "Edit$" + e.Row.RowIndex);
e.Row.Attributes["style"] = "cursor:pointer";
}
And it works fine but when I#m already in edit mode and double click again into the TextBox I get following error:
Invalid postback or callback argument. Event validation is enabled using in configuration or <%# Page EnableEventValidation="true" %> in a page. For security purposes, this feature verifies that arguments to postback or callback events originate from the server control that originally rendered them. If the data is valid and expected, use the ClientScriptManager.RegisterForEventValidation method in order to register the postback or callback data for validation.
Is there a way to catch this, so it doesn't show the erro above?
Thanks in advance

pop up messages once aspx

currently I am facing a problem with pop up msgs.
The messages should prompt out first time click on a NEXT button.
when we go to the next pages and back to the previous pages, and click on the same NEXT button, the pop up msgs should not appear.
how can i fix this?
This is button code
<asp:Button ID="Button1" runat="server" onclick="Button1_Click1" Text="Next" Width="100px" />
This is the function() for my clickedOnce
<script type="text/javascript">
window.document.onload = function()
{
var clickedOnce = false;
Button1.Button1_Click1 = function ()
{
if(!confirm('Please make sure the employee particulars and reporting line details are correct before save. \nClick OK to save and continue if all details are correct.\nClick Cancel and contact HR Admin if details appear is not up to date.'))return false;
clickedOnce = true;
}
}
</script>
Thank you. your kindness and help much appreciated.
Well, since you only want to run it once, could you give the user a cookie that lasts until the browsing session is over when they fist click the button? If they have the cookie, then you could skip over the line of code that you only want to run once.
Your code doesn't work at all. The main issue is how you try to catch click event.
<asp:Button ID="Button1" runat="server" onclick="Button1_Click1" Text="Next" />
It means that Button1_Click1 function runs at server. No client-side event occurs. To do something on client side you have to add onclientclick="someFunction()" to your button declaration.
OK, you add this. Now go to javascript.
function someFunction(){
var clickOnce = getCookie('clickOnce');
//Look #Darkrifts comment (link) how to do it.
//Just in case I reproduce the link http://www.w3schools.com/js/js_cookies.asp
if(!clickOnce || confirm('blah blah')){
document.cookie = 'clickOnce=1';
//no need to return anything
}
//if a visitor doesn't click "ok" then the popup appear again
}
It is also possible to set Session["clickOnce"] = true; on server side and use it from Page_Load server side handler but it may not work if a visitor return to the page using browser Back button.
protected void Button1_Click1(object sender, EventArgs e){
Session["clickOnce"] = true;
//more code
}
protected void Page_Load(object sender, EventArgs e){
if(Session["clickOnce"] != true)
Button1.OnClientClick = "someFunction()";
else
Button1.OnClientClick = "";
//more code
}
This can be achieved in multiple ways. You need to select the most efficient approach for your need. First of all you need to understand the ASP.Net page life cycle, persisting information between pages and ViewState.
In a nutshell...
Whenever your page reloads all elements (including JavaScript variables, be it global or local variables) in your page get's initialised. And then a feature in ASP.Net comes into play. I.e. ViewState. If this is set to true in page level or for each control it'll persist information of the controls in the page (depends on how you set this). But, this is page specific.
And, you could persist information between pages using following approaches
Query string
Session variables
Cache
Form posts
Cookies
Data store (e.g. text, xml or any other database/ data store)
Before you use any of the above mentioned approaches you must think about your requirement. #Alex Kudryashev came up with a good example while I was writing this answer. Let me know if you need example with a different approach or any clarifications.

User is able to click a button multiple times when it should close the form after the first click

On the main page, there's a button which popups a dialog prompting the user for their username and password. When they click "Save", the credentials are validated (both JS & SQL) and the window either closes, or tells them their credentials are invalid.
I'm experiencing some weird behavior though, where I can mash the button infinitely and then the "Save" action is performed multiple times.
On the Page_Load, we attach a Javascript 'event' to the button like so:
btnSave.Attributes.Add("onClick", "return ValidateUserPasswordSignPopup('" & txtUsername.ClientID & "', '" & txtPassword.ClientID & "');")
Javascript validation:
function ValidateUserPasswordSignPopup(userTxtBox, PassTxtBox)
{
var userTextBoxctrl = document.getElementById(userTxtBox)
var PassTxtBoxctrl = document.getElementById(PassTxtBox)
if (userTextBoxctrl.value.trim() == '') {
alert("Please enter User Name.")
document.getElementById(userTxtBox).focus();
return false;
}
if (PassTxtBoxctrl.value.trim() == '')
{
alert("Please enter Password.")
document.getElementById(PassTxtBox).focus();
return false;
}
return true;
}
Button click:
Protected Sub btnSave_Click(ByVal sender As Object, ByVal e As EventArgs) Handles btnSave.Click
If SaveData() Then
Response.Write("<script language = JavaScript>window.returnValue='yes';self.close();</script>")
End If
End Sub
SaveData() just creates a few objects, runs a stored procedure, creates a few more objects, then creates a DataTable which is passed to another method and is saved to the DB. Nothing too intense.
I've tried adding code in the JS method to disable the button, then at the end of the code-side click event I re-enable it, but the window seems to hang infinitely that way.
I've also tried toggling its state between the JS (re-enabling it before each return / at the end) and then re-disabling it at the start of the click event and re-enabling it again at the end of the click event, but I'm still able to click the button multiple times with this route.
Anyone have any idea what might be causing this?
EDIT My initial thought was the time it takes for the Javascript to run, as brief of a script as it is, was allowing the user to re-click the button before the postback happens to handle the click event. I completely removed the script that gets added in the Page_Load, in the first block of code above, but the behavior still happens.
The user is able to click the button multiple times due to the lag between form submission to the server and response content coming from the server.
Disable or hide the button just before return true; in ValidateUserPasswordSignPopup.
Another way:
var submittedFlag = false;
function ValidateUserPasswordSignPopup(userTxtBox, PassTxtBox)
{
if (submittedFlag)
return false;
...
submittedFlag = true;
return true;
}
Instead of using Response.Write, try registering the JavaScript using the ClientScriptManager.RegisterClientScriptBlock Method.
Protected Sub btnSave_Click(sender As Object, e As EventArgs) Handles btnSave.Click
If SaveData() Then
Page.ClientScript.RegisterClientScriptBlock(Me.GetType(), "YourKey", _
"<script language = JavaScript>window.returnValue='yes';self.close();</script>")
End If
End Sub

Call JavaScript function after Telerik RadPageView finishes loading?

I'm using Telerik UI for asp.net. Specifically I'm using RadTabStrip with partial page postbacks to allow the user to tab through different sets of data. When the user clicks a tab, some code executes and loads data just for that tab.
I've figured out how to execute codebehind: I set the OnTabClick property of the RadTabStrip, and then in codebehind I check what tab was clicked.
E.g.
protected void tab_Click(object sender, RadTabStripEventArgs e)
{
if (e.Tab.Text == "Info")
{
populateInfoTab();
}
}
private void populateInfotab()
{
// Do some stuff
}
However, I can't figure out how to execute client side javascript after a specific tab is clicked. What I tried:
Set OnClientTabSelected property, and then add some javascript:
function tab_ClientClick(sender, args)
{
var tab = args.get_tab();
if(tab.get_text() == "Info")
{
alert("Tab Clicked");
}
}
The problem is that I need to set the InnerHtml of some div in the clicked pageview after it is clicked. The div does not exist on page load (that specific RadPageView is hidden) so I cannot set it then. Once the user clicks into the tab, and after the page view loads, I need to be able to update the div's InnerHtml through JavaScript.
How would I go about doing this?
First option - if you do not set the RenderSelectedPageOnly property to true, all page views will be rendered on the initial load and you will be able to use JS to find/modify elements in them.
Second option - just set the content from the server as soon as you load the UC, this will usually make things simpler.
Third option - use client-side events (offered by the native PageRequestManager class or the RadAjaxManager, depending on how you setup your AJAX interactions) to execute when the response is received. The difficulty here is to determine which is the postback you need. Looking for the desired element and only executing logic if it exists is the simplest flag you can opt for.
Fourth option - register a script from the server code that will call your function, something like:
populateInfoTab();
ScriptManager.RegisterStartupScript(Page, Page.GetType(), "someKey", "myDesiredFunction()", true);
where you may want to use the Sys.Application.Load to ensure it is executed later than IScriptControl initialization.

How do I stop the Back and Refresh buttons from resubmitting my form?

I am doing web development.
I have a page to do with credit card, which when user click "refresh" or "Back", the transaction will be performed one more time, which is unwanted.
This include Browser top left "Back" & "Refresh" button, "right click->Refresh/Back", press "F5" key.
This is to be done on certain cgi page only, not all of them.
Can this be done using Javascript? Or any other method?
The standard way is to do it in 3 steps.
the form page submits fields to processing page
processing page processes data and redirects to result page
result page just displays results, reloading it won't do any harm.
This breaks the basic browser user experience model...users should always be able to use the Refresh and Back buttons in their browser. Recommend that you fix your page another way.
If you update your question to include the server language/platform/technology that you are using then someone might be able to suggest a solution.
The simple fact that resubmitting the form generates a duplicate transaction is worrying. You should have some sort of check to ensure each submit of form data is unique.
For example, the page which would submit the form should be given a unique ID that gets submitted with the form. The business logic should then be able to recognise that the form submitted has already been processed (as the (no longer) unique ID will be the same), so ignores the second attempt.
The 'standard way' still doesn't stop clients from clicking the back button twice... or even going back and resubmitting the form if they don't think (for whatever reason) it has been processed.
generate a random string and store it in session,
then output it to your form as a hidden value,
check the submitted and store variable, if matches process your request,
go to 1.
Place this code on the form page
Response.Cache.SetCacheability(HttpCacheability.NoCache);
Response.Cache.SetExpires(DateTime.Now-new TimeSpan(1,0,0));
Response.Cache.SetLastModified(DateTime.Now);
Response.Cache.SetAllowResponseInBrowserHistory(false);
You shouldn't try to "block" these actions.
What you should do is make sure that nothing happends when someone "double submits" the form.
and in some browser you canĀ“t even do that, and this is good!
The best way is to have enough session handling logic that you can recognise the 2nd (and onwards) attempt as "this is just a re-submission" and ignore it.
I didn't see this here so here it is.
Put a unique token in the form.
The submit button triggers an xmlhttp(ajax) request to the server to create a session variable named after the token with a stored value of 1.
The ajax request submits the form after receiving a positive state change.
The form processing script checks for the session variable withe the stored value of 1.
The script removes the session variable and processes the form.
If the session variable is not found, the form will not be processed. Since the variable is removed as soon as its found, the form can only be run by pressing the submit button. Refresh and back will not submit the form. This will work without the use of a redirect.
vartec:s solution solves the reload-problem, not the back-problem, so here are a solution to that:
The form page sets a session variable, for example session("fromformpage")=1
The processing page check the session variable, if its ="1" then process data and redirect to result page if any other than ="1" then just redirect to result page.
The result page sets the session variable to "".
Then if the user is pressing back button, the processing page will not do the process again, only redirect to process page.
I found the above Post/Redirect/Get explanations a little ambiguous
Here's what I followed and hopefully it helps someone in the future
http://wordsideasandthings.blogspot.ca/2013/04/post-redirect-get-pattern-in-php.html
Essentially the process based on the above solution is:
Submit from the FORM page to the processing page (or to itself)
Handle database or payment processing etc
If required, store user feedback message in a session variable, possible error messages etc
Perform header redirect to results page (or to original form page). If required, display custom message from processing page. Such as "Error Credit Card payment was rejected", and reset session variables.
Redirect with something like:
header("HTTP/1.1 303 See Other");
header("Location: http://$_SERVER[HTTP_HOST]/yourfilehere.php");
die();
The header redirect will initiate a GET request on "yourfilehere.php", because a redirect is simply that, a "request" to fetch data FROM the server, NOT a POST which submits data TO the server. Thus, the redirect/GET prevents any further DB/payments processing occurring after a refresh. The 301 error status will help with back button pressing.
Helpful Reading:
http://en.wikipedia.org/wiki/URL_redirection#HTTP_status_codes_3xx
http://www.theserverside.com/news/1365146/Redirect-After-Post
http://wordsideasandthings.blogspot.ca/2013/04/post-redirect-get-pattern-in-php.html
https://en.wikipedia.org/wiki/HTTP#Request_methods
http://en.wikipedia.org/wiki/Post/Redirect/Get
Just put this javascript on the html section of aspx page above head section
<script type = "text/javascript" >
function disableBackButton()
{
window.history.forward();
}
setTimeout("disableBackButton()", 0);
</script>
We need to put it on the html section of the page which we want to prevent user to visit by hitting the back button
Complete code of the page looks like this
<%# Page Language="C#" AutoEventWireup="true"
CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
<script type = "text/javascript" >
function disableBackButton()
{
window.history.forward();
}
setTimeout("disableBackButton()", 0);
</script>
</head>
<body onload="disableBackButton()">
<form id="form1" runat="server">
<div>
This is First page <br />
<br />
Go to Second page
<br />
<br />
<asp:LinkButton ID="LinkButton1" runat="server"
PostBackUrl="~/Default2.aspx">Go to Second Page
</asp:LinkButton></div>
</form>
</body>
</html>
If you are using firefox then use instead of onload
If you want to disable back button using code behind of aspx page,than you need to write below mentioned code
C# code behind
protected override void OnPreRender(EventArgs e)
{
base.OnPreRender(e);
string strDisAbleBackButton;
strDisAbleBackButton = "<script language="javascript">\n";
strDisAbleBackButton += "window.history.forward(1);\n";
strDisAbleBackButton += "\n</script>";
ClientScript.RegisterClientScriptBlock(this.Page.GetType(), "clientScript", strDisAbleBackButton);
}
We can also achieve this by disabling browser caching or cache by writing this line of code either in Page_load event or in Page_Init event
protected void Page_Init(object Sender, EventArgs e)
{
Response.Cache.SetCacheability(HttpCacheability.NoCache);
Response.Cache.SetExpires(DateTime.Now.AddSeconds(-1));
Response.Cache.SetNoStore();
}
Doing this,user will get the page has expired message when hitting back button of browser
Demo is :
This code works for not back from current page me..
Here I put a code which helps you , not open contextmenu and on browser reload ask you leave a page or not...
I am trying the ask click on browser back button
jQuery( document ).ready(function() {
document.onkeydown = fkey;
document.onkeypress = fkey
document.onkeyup = fkey;
var wasPressed = false;
function fkey(e){
e = e || window.event;
//alert(e.keyCode);
if( wasPressed ) return;
if (e.keyCode == 116 || e.keyCode == 8 || e.keyCode == 17) {
// alert("f5 pressed");
window.onbeforeunload = null;
return true;
}
}
window.onbeforeunload = function (event) {
var message = ''; // Type message here
if (typeof event == 'undefined') {
event = window.event;
}
if (event) {
event.returnValue = message;
}
return message;
};
jQuery(function () {
jQuery("a").click(function () {
window.onbeforeunload = null;
});
jQuery(".btn").click(function () {
window.onbeforeunload = null;
});
//Disable part of page
$(document).on("contextmenu",function(e){
return false;
});
});});
Thanks,

Categories

Resources