Javascript Text Alignment in TextBox

634176

I have a textbox item, P1_MY_AMT, which contains amount value in "$9,999,999.55" format. I have a function that takes user input (numbers) and formats it with a dollar sign, and commas and returns the formatted value to the textbox. I'm using the onBlur event to display the value to the user.

What I need to do is align the "$" to the left side of the textbox (left justified), and the amount to the right of the textbox (right justified). I have to do this strictly using javascript, and cannot use any built-in stuff from Apex, since this function will ultimately be also used in another html based app.

Any ideas on how I can achieve this?

Any help is appreciated.

Tyson Jouglet

I found this LPad function on the internet. It had a bug in the for loop, but it works great now.

<script type="text/javascript">
function LPad(ContentToSize,PadLength,PadChar)
  {  
     var PaddedString=ContentToSize.toString();
     for(i=ContentToSize.length+1;i<=PadLength;i++)
     { 
         PaddedString=PadChar+PaddedString;
     }

     return PaddedString;
  }
$x('P150_EMPLOYEE_SALARY').value = '$'+ LPad('1000',15,' ');
</script> 

Edited by: Tyson Jouglet on Sep 24, 2008 1:41 PM

Tyson Jouglet

Are you using a textbox or a display as text object? if you are using a display as text object you could make the label say something like "Salary: $" and then right justify the text.

634176

As I said in my question, I cannot use anything specific to Apex, because this procedure is also used in some pl/sql cartridges, and so needs to use pure javascript. I found a workaround..not a very polished way but still works fine. I created a table with 2 columns and 1 row. In the first column I put a textbox containing on the “$” and in the second I put a textbox with the amount value. I’m hiding the “$” sign textbox when there is nothing in the amount box. I made the “$” sign left justified and contents of the amount textbox right justified. I made the textboxes without border, and so the table itself actually looks like it is a textbox! Works for me at the moment.

Thanks everyone for the pointers.