wulanrahayu / jquery-formatcurrency

Automatically exported from code.google.com/p/jquery-formatcurrency
GNU General Public License v3.0
0 stars 0 forks source link

Format as you type: Cursor changes position when trying to edit an existing value (Chrome) #23

Open GoogleCodeExporter opened 9 years ago

GoogleCodeExporter commented 9 years ago
What steps will reproduce the problem?
1. Enter a value into one of the boxes on the demo page.
2. Click somewhere in the middle of the value you just entered.  
3. Enter a digit.

What is the expected output? What do you see instead?
I expect the cursor to stay where I am inside the string, so I could enter more 
digits. Instead, the cursor will be taken to the end of the input, before you 
can type another character.

What version of the product are you using? On what operating system?

I ran this using the demo on here, using Chrome on Windows Vista.
Please provide any additional information below.

Original issue reported on code.google.com by andrew.l...@gmail.com on 2 Dec 2010 at 1:35

GoogleCodeExporter commented 9 years ago
It appears when the formatted string is put back into the field, the cursor 
gets reset to the end of the line.  I experimented with a plugin called jCaret 
to determine the cursor position before the formatting and then reset it once 
the format was applied and it seemed to work.  This is not tested very 
thoroughly but could give someone a place to start to fix this bug (if the bug 
is worth fixing). I inserted some code (and loaded the jcaret plugin in my 
page) around line 134:
// set destination
var startPos = $(this).caret().start; // position of the cursor when the user 
typed something
var startLength = $(this).val().length; //length of the input before we applied 
the formatting

$destination[$destination.is('input, select, textarea') ? 'val' : 
'html'](money);

// if we havent inserted any new formatting, set the cursor back to what it was
if (startLength == money.length)
{
  $(this).caret({start:startPos, end:startPos});
}
else // if we have, adjust the cursor accordingly
{
  $(this).caret({start:startPos +(money.length - startLength),end:startPos +(money.length - startLength) });
}

Original comment by andrew.l...@gmail.com on 2 Dec 2010 at 4:09