We Keep Coding

Hot to update Postback data directly using ViewState or some other method to clear hidden field?

I have a hidden field that stores some Ids of items to be updated when a button is clicked on the page. This is working fine. However, if the user clicks the Update button, then waits for page to reload, and then refreshes the page manually (using browser Refresh button), the data is resubmitted and creates duplicate data in the database.
Is there a way to clear the hidden field in the Postback data so that if the user does refresh the page manually, the hidden field will be empty and no updates to the database will be made?
So far, I have tried to manually update the ViewState using the code below after the database is updated.
ViewState["hdnBulkIds"] = "";
I have also tried to exclude the hidden field from the ViewState and manually clear it using jQuery on page load.
$( document ).ready(function() {
$('#<%= hdnBulkIds.ClientID %>').val("");
});
In both cases, I cannot seem to update the data "instance" that is sent to server on manual page refresh so the hidden field retains its original values from original button click.
I guess the question can be simplified to this: Is there a way to update the Postback data directly using ViewState or some other method to clear the hidden field?

This is a big issue with webforms in general and a big reason you should consider jumping ship to MVC. There may be an elegant way to handle this through webforms, but I'm not aware of any.
Once the user submits a form the browser "remembers" that submission and the refresh will re-submit it. There is nothing you can do about that, you have to detect a second submission through other means.
Your best/most true solution is to do a redirect after you get all of your data, and use your query parameters to re-build the page in the state it needs to be in. Then when the user refreshes the screen it will resubmit the redirect instead of the form submission.
Page.Redirect() or something along those lines is the function that lets you do a redirect. Trouble is, a page redirect will erase all state webforms was maintaining about the page, you have to rebuild all of it.
You also might be able to implement some sort of "CSRF" token style system. Generate a random number and store it in the user session on page load. When the user posts back, invalidate that number somehow. That way, if they post-back again with the number you can cancel the request.
That's a hackey way of going about things, doing a redirect is the "tried tested" method to my knowledge.
Another option is if the postback edits a value, check for duplicates or if the value is edited and if there are duplicates don't let the user double-submit.

Delete textarea text on submit in new tab?

So I'm working on a chat system and even though I know it works in a pretty lame way - submitting messages in a new window () - I'm interested if there's any way to reset the textarea's content after sending the message.
Now, the problem is, I've even actually found ways to do so via JavaScript (editing the textarea's value), but I don't know how to "launch" the javascript after submitting the form.
Obviously, I can just use onSubmit(), but that delete's the value BEFORE sending the data. So it works, but sends an empty text.
Any ideas?
Thanks!

A common solution is to copy the values of your <form> into an object which you can then convert to JSON. That way, you have a copy of the values which doesn't change when you reset the fields of the form. jQuery will make this very simple. See also: serializing and submitting a form with jQuery POST and php
The second solution is to submit the form and as the last thing, add a timeout which resets the form. But there will be a small gap and a user might be able to type while your handler is clearing the form.

Okay, so I've used a JavaScript timer to run the clearing function 300 ms after clicking the submit button. Works. Thanks all :)

How to Retain text in Text box using Javascript?

I have A page for registering user Details and from this page I have an option for adding his Sate/Continent. After Adding Sate/Continent he can navigate to his previous page.. But At this time Already filled Data's are missing so that he can have to enter again this.. Is there any possibility to solve this using javascript??

Since you are navigating away from page you can either use some server side code to create a session and retain values between pages. Or you can use js cookies to retain the values like
document.cookie="continent=asia";

Using javascript to go to the next tabindex of a form AFTER a refresh

I am currently working on an already established system that I cant make very drastic changes to. I need to "autosave" a form every time one of the fields is entered/updated. To do this I bound an event to the onblur of every field
document.form.submit();
It goes to the processing page, does what needs to be done and comes back to the form and retrieves the information from mysql to display it. It does have a bit of a "flash" from the reload but this is not a problem. The real problem is the user loses their tabindex since essentially the page is reloaded. So when tab is pressed the form is submitted and reloaded and the tab starts back from the beginning instead of the next field as the user would expect it to.
Is there a solution using javascript (no jquery) that I could implement that would "remember" the field the user was in and go to the next field after the form is submitted?
thank you!!

How do I add a callback function to .submit() in Javascript?

I am submitting a page onclick of a form element and need a function to run after the submit refreshes the page. I'm trying to add an animated scroll back to the clicked element that caused the submission. I've got the scroll part covered but I can seem to figure out how to cause the function I wrote for the scroll to run after the page refreshes from the submit.
Any timely help would be much appreciated!

If you are doing a full submit, rather than an AJAX submit, then the page that displays afterwards is not the same page as the one that the form was submitted from. Consequently, the identity of the clicked element will not be available on the second page.
What you need to do is, during the submit handler, store the identity of the clicked element (Should probably be a unique ID of some kind) in a hidden field of the form.
When the page refreshes, it should now have the unique ID available (Probably placed in the same hidden field of the form by the server side code) and a javascript function can read this value to control the scrolling.
Does this make sense?
If you update your question to include some sample code, then I might be able to clarify further.

If you do a "real" form submit, where the actual page refreshes, there is no way you can do it from the client (except using frames). Once you leave the page, your javascript is out of scope. You need to insert the javascript to the refreshed page on the server.
If, on the other hand, you are submitting the form and refreshing a part of the page via ajax, then, depending on the framework you use, you'll be looking for a callback hook like onSuccess etc. in your ajax submit function

This would be easier to do in ajax however if you need to do it as a postback then you need to attach an event to the body load event and send some data back with the postback that would identify that the page has loaded as part of a post back and not a new page load.
e.g. create a hidden contol ont he web page and on the postback give it a value , on the postback check to see if that hidden control has a value and if so run your scorll code.