ASP.NET - Cursor Control After F5 Refresh After PostBack

Asked By Steve Arndt on 20-Mar-12 03:32 PM
Earn up to 20 extra points for answering this tough question.
Using MS Visual Studio 2010, vb.net

Have a web form that has an updatepanel containing three textboxes - all set for autopostback.   Trying to figure out
how to code the form, so that

1. When a user enters a value in first textbox and then tabs to second textbox, the value is retained and repopulated into the first textbox after postback and the cursor is positioned into the second textbox.  Same for second textbox to third textbox.

2. After the value is postback into the 1st textbox, the user uses the mouse to reposition the cursor into the first textbox, and then hits the F5 button to refresh the form, the value that was entered is retained and repopulated into the first textbox and the cursor is positioned into the first textbox again.  Same situation for postbacks to other textboxes.

I have been able to find code online to handle the postback situation, but not the form F5 refresh after postback.

Any help is appreciated..
Sreenath Kalahasti replied to Steve Arndt on 20-Mar-12 04:54 PM
You can store the Values in ViewState on Postback and retrieve the values from ViewState and load the textbox.

Thanks
Sree
[)ia6l0 iii replied to Steve Arndt on 20-Mar-12 09:55 PM
Enabling Viewstate on the page should help as the other member suggested. 

Page refreshes using F5, should restore the values on the text boxes as that was the last input the user did. But may not be completely foolproof. You might have to save to a safer datasource than viewstate like a SQL server.
Jitendra Faye replied to Steve Arndt on 21-Mar-12 12:13 AM
For that ,

First Enable ViewState for Page and TextBoxes also.

also set the Tab order for all the TextBoxes.
D Company replied to Steve Arndt on 21-Mar-12 12:21 AM
I'm not sure that view state will work here, becoz when the user press F5, page is not a postback, page load again so Viewstate doen´t work because it only works between page postback.in this case u have to  to store data in session variables or as mentioned in previous post u can also use Sql server database , but using sql server for this small task is not seems very good idea. from my point of view session varables would be useful.

Regards
D
Steve Arndt replied to D Company on 21-Mar-12 12:43 AM
I've been able to handle the saving of variables in viewstate and restoring them on postback.  What I'm struggling with is how to recognize the difference between refresh and postback at page_load, and then being able to identify the control that had the focus prior to the user hitting the F5 key and then being able to get the value of the control and restore it's focus - especially after a postback has occurred and the user then uses the F5 to refresh the screen - either in the same field where the cursor is located after the postback occurred or in another field that the user used either the mouse or tab key to move the cursor to.  
Steve Arndt replied to Jitendra Faye on 21-Mar-12 01:17 AM
I've done this already...
Thanks
kalpana aparnathi replied to Steve Arndt on 21-Mar-12 04:13 AM
hi,

try below code:

<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:TextBox ID="TextBox1" runat="server" OnTextChanged="TextBox1_TextChanged"
 
AutoPostBack="true"></asp:TextBox>
<asp:Label runat="server" Text="" ID="Label1"></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
</body>
 
<script type="text/javascript">
var currentCaret;
function getCaret(textbox) {
var textbox = $get("<%=TextBox1.ClientID%>");
var control = document.activeElement;
textbox.focus();
var rang = document.selection.createRange();
rang.setEndPoint("StartToStart", textbox.createTextRange());
return rang.text.length;
}
  
  
function setfocus() {
var txb = $get("<%=TextBox1.ClientID%>");
var t = txb.createTextRange();
t.collapse(true);
  
t.moveStart("character", currentCaret);
t.select();
  
}
  
Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(
function(sender, e) {
currentCaret = getCaret($get("<%=TextBox1.ClientID%>"));
  
});
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(
function(sender, e) {
  
setfocus();
});
  
</script>

protected void TextBox1_TextChanged(object sender, EventArgs e)
{
Label1.Text = "you inputed " + TextBox1.Text;
 
}

Referance link:http://vincexu.blogspot.in/2009/06/keep-textbox-focus-inside-updatepanel.html

Regards,
Steve Arndt replied to kalpana aparnathi on 21-Mar-12 10:03 AM
Thanks
I'll try this.   Couple of questions.   How would modify this code so that it handles multiple controls - not just a single textbox.   And I assume you don't need the OnTextChanged event.
D Company replied to Steve Arndt on 21-Mar-12 12:54 PM
In this case use this

if(!IsPostBack)
{
//it means pressed f5 else postbak
}

or even if u want to check from javascript code u can do this as follows

function isPostBack()
{

  return document.getElementById('_ispostback') == 'True';
}

Hope this helps
Regards
D
Steve Arndt replied to Steve Arndt on 06-Apr-12 02:50 PM
Hi

Was out a few weeks - tried this code today.   Doesn't appear to work with F5 page refresh - only with AutoPostBack.   Still looking for a way to distinguish and handle F5 and PostBack so that the cursor is positioned back into the same textbox field after F5 (while retaining any values previously entered into the textboxes in the form) while moving the cursor to the next textbox (while retaining any values previously entered into the textboxes in the form) after postback.

Steve