Cursor position not retaining after ajax refresh

Hello All, 

I have a strange behaviour in IE , that i have multiple textboxes on the page and which refreshes part of page on change of these textbox values . 

But when i finish giving any value to textbox then due to OnChange action , ajax refresh is done and cursor is moved to last textbox of the page .

How can i retain Cursor position after ajax refresh in  IE because in chrome it is working fine.


TIA,

Nitesh   

Hi Nitesh,

IE isn't even supported as a browser by Microsoft anymore, so yes, you might see strange things. Just don't use IE ;).

Hi,

In the following link https://www.outsystems.com/forums/discussion/27382/set-focus-after-data-entry/ you have one similar issue with solution.

Hope it helps :)

Kilian Hekhuis wrote:

Hi Nitesh,

IE isn't even supported as a browser by Microsoft anymore, so yes, you might see strange things. Just don't use IE ;).

Thanks for replying Killian ,

But what if my client only uses IE :)


Tell him to not use ;)

Well, besides that, if you really need to think about IE, I am sorry to say that you are with problems. The IE is not supported anymore and is not supported by OutSystems as well. This means that you will have to find workarounds to problems like that.

I would try the solution pointed by Nélio first then I would try to see around (google) if someone else already had this problem in IE (not necessarily with OutSystems).

IE was a big piece of ... in its time, always running away of any standard, and this didn't improve when it was discontinued... :(

Nitesh Ahirwar wrote:

But what if my client only uses IE :)

Then they use something that's no longer supported or approved by MicroSoft, and is dangerous (security-wise) to use. There's no good reason to use IE for modern projects, it's legacy, to be used only for legacy apps that depend on it.


Eduardo Jauch wrote:

Tell him to not use ;)

Well, besides that, if you really need to think about IE, I am sorry to say that you are with problems. The IE is not supported anymore and is not supported by OutSystems as well. This means that you will have to find workarounds to problems like that.

I would try the solution pointed by Nélio first then I would try to see around (google) if someone else already had this problem in IE (not necessarily with OutSystems).

IE was a big piece of ... in its time, always running away of any standard, and this didn't improve when it was discontinued... :(

Hi Eduardo / Kilian,

Could you please help me out on this , i tried different things but couldn't find any solution to it , since my client's users are basically farmers and uses IE which comes by default in windows hence have to have workaround for this.


Nitesh Ahirwar wrote:

Hello All, 

I have a strange behaviour in IE , that i have multiple textboxes on the page and which refreshes part of page on change of these textbox values . 

But when i finish giving any value to textbox then due to OnChange action , ajax refresh is done and cursor is moved to last textbox of the page .

How can i retain Cursor position after ajax refresh in  IE because in chrome it is working fine.


TIA,

Nitesh   

Hi Nitesh,

I am also facing same issue on IE 11.

As temporary solution, done below steps. You can try and see if it helps you.

It causes little trouble while sifting focus to original field means you can see that focus is getting shifted with little UI disturbance.


1. Create new hidden input field to store the id of input field, when onchange occur.

2. On Input field, where onchange is added, add below JS code in "onchange" event specified in extended property..


"
var onchangeEleID = document.getElementById('"+ OnChangeEleID.Id +"'); - input element created 
in step#1
var emailEleId = document.getElementById('"+ No.Id +"'); - Onchange field
onchangeEleID.value =  emailEleId.id;
"


3. add below JS code in your web screen to move focus back to original field.


$(document).ready(function() {  
    
    osAjaxBackend.BindAfterAjaxRequest(     
      function(){
        var onchangeEleValue = document.getElementsByName('OnChangeEleID')[0].value;
        var onchangeEleId = document.getElementById(onchangeEleValue);
        console.log(onchangeEleValue);
        if(onchangeEleId != null){
          onchangeEleId.focus();
        }
      });
    
});

Hope it will help you.


Thanks and Regards,

Archana Gholap

Archana Gholap wrote:

Nitesh Ahirwar wrote:

Hello All, 

I have a strange behaviour in IE , that i have multiple textboxes on the page and which refreshes part of page on change of these textbox values . 

But when i finish giving any value to textbox then due to OnChange action , ajax refresh is done and cursor is moved to last textbox of the page .

How can i retain Cursor position after ajax refresh in  IE because in chrome it is working fine.


TIA,

Nitesh   

Hi Nitesh,

I am also facing same issue on IE 11.

As temporary solution, done below steps. You can try and see if it helps you.

It causes little trouble while sifting focus to original field means you can see that focus is getting shifted with little UI disturbance.


1. Create new hidden input field to store the id of input field, when onchange occur.

2. On Input field, where onchange is added, add below JS code in "onchange" event specified in extended property..


"
var onchangeEleID = document.getElementById('"+ OnChangeEleID.Id +"'); - input element created 
in step#1
var emailEleId = document.getElementById('"+ No.Id +"'); - Onchange field
onchangeEleID.value =  emailEleId.id;
"


3. add below JS code in your web screen to move focus back to original field.


$(document).ready(function() {  
    
    osAjaxBackend.BindAfterAjaxRequest(     
      function(){
        var onchangeEleValue = document.getElementsByName('OnChangeEleID')[0].value;
        var onchangeEleId = document.getElementById(onchangeEleValue);
        console.log(onchangeEleValue);
        if(onchangeEleId != null){
          onchangeEleId.focus();
        }
      });
    
});

Hope it will help you.


Thanks and Regards,

Archana Gholap

Hi Archana ,

Thanks for suggesting possible solution but i have already implemented a less complex code to retain cursor position after ajax refresh in IE . 

What i have done is that i have passed an input to the onchange function which is the ID of the input from which it is called and in the end of the function i have called this javascript which focuses on the input id which is passed as input after refresh . It serves the purpose for me on IE and EDGE.


Thanks ,

- Nitesh