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
help
PM hi. how to maintain the scroll position of a panel on postbacks. evytime on postback, the scrollbars are running to the top position. i am also using ajax updatepanel on my page. . pls help me. . . thanx. . . Here is the article explaining how to do to store your Panel scroll value somewhere like hidden field or cookies etc. and after postback you need to set it again to panel so that it will maintain scroll position; In following code, javascript is used to maintain scroll after postback and cookies is used to store scroll position. For first time, we need not to columnindex.ToString()); e.Row.Cells[columnindex].Attributes[ "onclick" ] = js; e.Row.Cells[columnindex].Attributes[ "style" ] + = "cursor:pointer;cursor:hand;" ; } } } if (e.Row.RowType = = DataControlRowType .DataRow) { / / e.Row.Attributes.Add("onmouseover", "this.style.backgroundcolor = 'yellowgreen';this.style.cursor = 'pointer';this.style.color = 'green'"); / / e.Row.Attributes.Add("onmouseout", "this.style.backgroundcolor = 'white';this position. hi. how to maintain the scroll position of a panel on postbacks. evytime on postback, the scrollbars are running to the top position.
640px ; height : 20px ; color : Yellow ; background - color : Black ; font - weight : bold ; float : left ; padding : 5px ; cursor : pointer ; vertical - align : middle ; } < / style > < script type = "text / javascript" > function FadeInOrOut () { var obj = $find ( "cpe FadeOutAnimation Register the user control on the page, then put the user control in an UpdatePanel . In this case, I'm clicking a button and accessing the user control in the ajax / Flash_user_confirmation.aspx# < form id = " form1" runat = " server" > < asp:ScriptManager ID = " ScriptManager1" runat = " server" / > < asp:UpdatePanel ID = " up1" runat = " server" > < ContentTemplate > < asp:Button ID = " btnShowMessage" runat = " server" Text = " Show Message" OnClick = " btnShowMessage_Click" / > < uc1:FlashMessage ID = " FlashMessage1" runat = " server" / > < / ContentTemplate > < / asp:UpdatePanel > < / form > In order to flash a message, all you have to do is set the behind. The tricky part was figuring out how to execute the JavaScript after an asynchronous postback. To do that, you have to get a reference to the script manager, then register the code with the UpdatePanel that the user control is nested in. If the UpdatePanel is not in a user control, you can use the usual RegisterStartupScript method to register the script with the page and not the UpdatePanel . Collapse | http: / / www.codeproject.com / KB / ajax / Flash_user_confirmation.aspx# Public Sub Display() ' Set the duration
Hi There, I am writing web application VB VS2008 with ajax page has user control and textboxes. I group the textbox together and have 3 <asp:updatePanel . . . updatemode = "Conditional"> each group has about 6 textboxes each textboxes has AutoPostBack = true when I we type some value into the first TextBox and then click the second one, the cursor would disappear and we cannot type value into the second one. Please tell me whether application would run the server side post back firstly whether these controls are inside the UpdatePanel or not. The cursor which is inside the second TextBox would disappear because the page's post back. This default setting by the ASP.NET Life-cycle. If these TextBoxes are placed into an UpdatePanel, we cannot see the refresh of the page, so, the cursor's disappearance would be weird. To make a workaround, we can set the AutoPostBack property ended. Refer to this sample: CodeBehind = "TestUpdatePanel.aspx.vb" Inherits = "_44456996.TestUpdatePanel" %> TextBoxes outside the UpdatePanel<br / > Type into first TextBox and then click the second one, <br / > the page would
aspx Hope this will help you. hi. . when ever you are using tabpanel(Ajax) the postback which occurs isthe partial postback so the javascript is not loaded after you perform any event because of the partial TabContainer1" runat = "server" AutoPostBack = "true" > < act:TabPanel ID = "TabLocation" runat = "server" HeaderText = "Locations" > < ContentTemplate > < asp:UpdatePanel ID = "UpdLocation" runat = "server" UpdateMode = "Conditional" > < ContentTemplate > < script type = "text / javascript" language = "javascript" > function pageLoad() { } < / scritp > < / ContentTemplate > < / asp:UpdatePanel > < / ContentTemplate > < / act:TabPanel > write your scripts in the content panel so even of the partial postback occurs the jquery functionality will be loaded nicely hope this helps you. . . and if any TableRowSection.TableHeader; gvEmployees.FooterRow.TableSection = TableRowSection.TableFooter; } } If you are using the GridView in an UpdatePanel and binding it in a callback, then it 's better to put it in the ready, using the code below: $(document).ready(function() { $( "#gvEmployees" ).tablesorter(); }); If you are using an UpdatePanel, you need to consider using the PageLoad function (JavaScript): $( "#gvEmployees" ).tablesorter(); refer links http: / / www aspx All, I was able to sort GridView to work by itself and inside the updatepanel. Problem occurs when I use Tab Control and use the GridView inside the Tab Panel
UpdatePanel.Update() not updating a gridview .net3.5 AJAX Modal Popup ASP.NET 28-Oct-12 the data is not updating. This is in spite trying coding the gridview.databind(), and updatepanel.update() in various combinations at different parts of the code. To see the new record gvRequest.RowDataBound If e.Row.RowType = DataControlRowType.DataRow Then e.Row.Attributes( "onmouseover" ) = "this.style.cursor = 'pointer';this.style.textDecoration = 'underline';this.style.color = 'red';title = 'Click to edit or delete'" e.Row.Attributes( "onmouseout" ) = "this.style.cursor = '';this.style.textDecoration = 'none';this.style.color = 'black';" e.Row.Attributes( "onclick" ) = ClientScript.GetPostBackClientHyperlink( Me Font-Bold = "True" ForeColor = "White" Wrap = "False" / > < / asp : GridView > <!- - THINK THIS IS THE PROBLEM - -> < asp : UpdatePanel ID = "UpdatePanel1" runat = "server" UpdateMode = "Conditional"> < / asp : UpdatePanel > <!- - - -- -- -- -- -- -- -- --> < br / > < div id = "divUpdateRecord" class = "div_UpdateRecord"> Service &nbsp; < asp : DropDownList ID = "ddServiceList" runat = "server" AutoPostBack SqlDataSource ID = "ds_Service" runat = "server" ConnectionString = " <%$ ConnectionStrings:RW_CS %> " SelectCommand = "spRWGetServiceDirOrderNotDel" SelectCommandType = "StoredProcedure"> < / asp : SqlDataSource > < asp : UpdatePanel ID = "UpdatePanel2" runat = "server"> < ContentTemplate > < asp : Button ID = "MPEFakeTarget" runat = "server" Text = "Button" CausesValidation = "False ModalPopupExtender1" runat = "server" TargetControlID = "MPEFakeTarget" PopupControlID = "pu" DropShadow = "true" BackgroundCssClass = "modalBackground"> < / cc1 : ModalPopupExtender > < / ContentTemplate > < / asp : UpdatePanel > < / div > < / div > < / div > < / div > < / form > < / div > < / body > < / html > - -- -- -- -- -- -- -- -- -- -- Any ideas where I'm going wrong
the text box. The autopostback property of the textbox is 'TRUE'. The reuiredfieldvalidator should stop postback when the textbox is empty and the cursor moves out of the textbox. But instead it is firing the AJAX call and going on the VS.NET to get the design view. <td style = "text-align: left"> <asp:UpdatePanel ID = "upnStudentRegistration" runat = "server"> <ContentTemplate> <asp:TextBox ID = "txtAdmissionNo" runat = "server" MaxLength = "25" TabIndex = "1 ID = "lblAdmissionNumberAvailable" runat = "server" Font-Size = "Smaller" ForeColor = "Maroon" Visible = "False"> < / asp:Label> < / ContentTemplate> < / asp:UpdatePanel> < / td> Please tell me if I can send something else to help towards solving the problem I have. This worked well for me <asp:UpdatePanel ID = "UpdatePanel1" runat = "server" > <ContentTemplate> <asp:TextBox ID = "TextBox1" runat = "server" > < / asp:TextBox> <asp:RequiredFieldValidator ID = "RequiredFieldValidator1" runat = "server" ControlToValidate = "TextBox1" ErrorMessage = "RequiredFieldValidator" > < / asp:RequiredFieldValidator> < / ContentTemplate> < / asp:UpdatePanel> Hi Dana, I appreciate your quick response. But I could see that in your code stop post back along with these settings. Please suggest. I also tested with this <asp:UpdatePanel ID = "UpdatePanel1" runat = "server"> <ContentTemplate> <asp:TextBox ID = "TextBox1" runat = "server" AutoPostBack = "true"> < / asp:TextBox TextBox1" ErrorMessage = "RequiredFieldValidator"> < / asp:RequiredFieldValidator> <asp:Button ID = "Button1" runat = "server" Text = "Button" / > < / ContentTemplate> < / asp:UpdatePanel> Protected Sub TextBox1_TextChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles TextBox1.TextChanged
to loop through grid rows and make sure that atleast one checkbox is checked. Otherwise, postback shouldn't happen. When I click on submit button without entering any values, first javascrit triggers and wouldn't allow postback. Next what I did was checked checkboxes and didn't enter any values in textboxes PostBack happend and in I am using 'Page.Isvalid' property. So, at that state page shows validator's messages. Then I click on button again, postback is skipping some of Grid's events being getting fired like (updateRowBatch event). So, not Text = "New Physician" ToolTip = "New Physician"> < Labels Selected = "" / > < / iglbar : Item > < / Items > < / iglbar : Group > < / Groups > < DefaultItemStyle Cursor = "Default" Font-Names = "Verdana" Font-Size = "8pt"> < Margin Left = "1px" / > < Padding Left = "5px" / > < / DefaultItemStyle > < DefaultGroupStyle BackColor = "WhiteSmoke" Cursor = "Default" Height = "100%"> < / DefaultGroupStyle > < DefaultItemSelectedStyle BorderStyle = "Inset" Cursor = "Default" BorderWidth = "1px"> < Margin Left = "0px" / > < / DefaultItemSelectedStyle > < / iglbar : UltraWebListbar > < / Template > < / cc1 : SplitterPane > < cc1 : SplitterPane runat server"> < Template > < asp : UpdatePanel ID = "MainContentRefreshPanel" runat = "server"> < ContentTemplate > < asp : ContentPlaceHolder ID = "MainContentSection" runat = "server"> < / asp : ContentPlaceHolder > < / ContentTemplate > < Triggers
something more… Web 2.0. Like last time, I’ll base it on a standard UpdatePanel demo using a button control to set a time / date label, with an artificial delay: < asp : ScriptManager ID = "ScriptManager1" runat = "server" / > < div id = "Container" class = "Normal" > < asp : UpdatePanel ID = "UpdatePanel1" runat = "server" > < ContentTemplate > < asp : Label ID = "Label1" runat = "server" Text = "Update Me" / > < asp Button ID = "Button1" runat = "server" OnClick = "Button1_Click" Text = "Button" / > < / ContentTemplate > < / asp : UpdatePanel > < / div > protected void Button1_Click ( object sender, EventArgs e ) { Thread. Sleep ( 5000 ) ; Label1. Text = DateTime. Now up a class for the progress state: .Normal { border : dashed 1px #000000 ; background-color : #FFFFFF ; cursor : auto ; padding : 10px ; width : 200px ; text-align : center ; } .Progress { border : dashed 1px #000000 ; background-color : #EEEEEE ; background-image : url ( spinner.gif ) ; background-position : center center ; background-repeat : no-repeat ; cursor : wait ; padding : 10px ; width : 200px ; text-align : center ; } Finally, hook up our event handlers for any async postbacks that occur. prm. add_initializeRequest ( InitializeRequest ) ; prm. add_endRequest ( EndRequest ) ; / / Executed anytime an async postback occurs. function InitializeRequest ( sender , args ) { / / Change the Container div's CSS class to .Progress. $get ( 'Container' ) . className = 'Progress' ; / / Get a reference to the element that raised the postback, / / and disables it. $get ( args._postBackElement. id ) . disabled = true ; } / / Executed when the async postback completes. function EndRequest ( sender , args ) { / / Change the Container div's class back to .Normal. $get
Hi All: I have a tabe container enclosed in updatepanel. In one of tabs, I have added a gridview. When I click that tab, and products" gridview is shown but posback occurs even the whole tab container is enclosed in updatepanel. how to avoid postback on link click ( gridview load) Regards, Asif Hameed Pls. show an example code. Possibly you migh have a postbacktrigger set to you linkbutton, not? Morzel <asp:UpdatePanel ID = "upProducts" runat = "server"> <ContentTemplate> <asp:TabContainer ID = "tbProducts" runat = "server" ActiveTabIndex = "2" Width = "97% SortedDescendingCellStyle BackColor = "#CAC9C9" / > <SortedDescendingHeaderStyle BackColor = "#383838" / > < / asp:GridView> < / ContentTemplate> < / asp:TabPanel> < / asp:TabContainer> < / ContentTemplate> < / asp:UpdatePanel> All code is already inside updatepanel so I dont think asynpostback trigger is required. First tip: where is the pnlModalPanel? Morzel