Focal Point Banner
Community Center Education Summit Technical Support User Groups
Let's Get Social!

Facebook Twitter LinkedIn YouTube
Focal Point    Focal Point Forums  Hop To Forum Categories  WebFOCUS/FOCUS Forum on Focal Point     [SOLVED] Automatically add comma's to user input fields
Go
New
Search
Notify
Tools
Reply
  
[SOLVED] Automatically add comma's to user input fields
 Login/Join
 
Gold member
posted
I'm working on an html page in App Studio, which contains several user input fields that will be passed into the reports as parameters. For the numeric edit boxes, is there a way to automatically add comma's as the user types?

This message has been edited. Last edited by: Joel Elscott,


WebFOCUS 8.2.03
z/OS
 
Posts: 66 | Registered: May 20, 2013Reply With QuoteReport This Post
Virtuoso
posted Hide Post
Not sure on the "as they type" part, but once the value is submitted, you can do some formatting before passing it in Js, or in WF before using it in the fex it was passed to. For what you're wanting, you might check the control's properties panel for something like that. They MIGHT have added something in there. Not sure though.


8.2.02M (production), 8.2.02M (test), Windows 10, all outputs.
 
Posts: 1119 | Location: USA | Registered: January 27, 2015Reply With QuoteReport This Post
Expert
posted Hide Post
If you mean formatting numbers, say 123456 will be 123,456, then you can create a keyup function to post format the entry box.


Waz...

Prod:WebFOCUS 7.6.10/8.1.04Upgrade:WebFOCUS 8.2.07OS:LinuxOutputs:HTML, PDF, Excel, PPT
In Focus since 1984
Pity the lost knowledge of an old programmer!

 
Posts: 6309 | Location: 33°49'23.0"S, 151°11'41.0"E | Registered: October 31, 2006Reply With QuoteReport This Post
Master
posted Hide Post
To elaborate a bit on what Waz commented, I tried the following Key Up event and it seemed to work:

 
//Begin function edit1_onkeyup
function edit1_onkeyup(event) {
var eventObject = event ? event : window.event;
var ctrl = eventObject.target ? eventObject.target : eventObject.srcElement;
// TODO: Add your event handler code here

  // skip for arrow keys
  if(event.which >= 37 && event.which <= 40) return;

  // format number
  $(ctrl).val(function(index, value) {
    return value

    //eliminate non-digit characters
    .replace(/\D/g, "")

    //add comma for every group of 3 digits
    .replace(/\B(?=(\d{3})+(?!\d))/g, ",")
    ;
  });

}
//End function edit1_onkeyup
 

This message has been edited. Last edited by: Hallway,


Hallway

 
Prod: 8202M1
Test: 8202M4
Repository:
 
OS:
 
Outputs:
 
 
 
 
 
Posts: 608 | Location: Salt Lake City, UT, USA | Registered: November 18, 2015Reply With QuoteReport This Post
Master
posted Hide Post
You should use a textarea instead of a inputbox.

if it's linked to a parameter that accepts multiple value it will add OR between all values entered by the user.

The user can use , or ; of linefeeds.

e.g.
user enters product ids : 789,923874,34,754,3957

FEX recieves : 789 OR 923874 OR 34 OR 754 OR 3957
CODE can be : WHERE PRODUCTID EQ &USER_PRODUCT_IDS

Good luck


_____________________
WF: 8.0.0.9 > going 8.2.0.5
 
Posts: 669 | Location: Veghel, The Netherlands | Registered: February 16, 2010Reply With QuoteReport This Post
Gold member
posted Hide Post
Hallway and Waz - Thanks for the suggestion. I'm still learning JavaScript, but how do you trigger this js function? On a "selection changed" criteria in App Studio? I also would have expected to see a reference to the edit box, like edit1 in this code...how does this piece of code know I'm referring to edit1?

Sorry for the noob questions!

Dave - Thanks for the suggestion, but in this case the user wants a formatted dollar amount with commas, not passing in multiple values.


WebFOCUS 8.2.03
z/OS
 
Posts: 66 | Registered: May 20, 2013Reply With QuoteReport This Post
Master
posted Hide Post
All that you need to do is go to the properties panel for the input and click on the events (lightning bolt) to bring up the list of available events. The event that you want is "Key Up." This will run the code every time a key is released on the keyboard while inputting text in the input box. Just click in the cell to the right of "Key Up" and you'll see a grey box with an ellipsis show up on the right. Just click on that ellipsis.

This will bring up the Embedded JavaScript tab of the HTML Canvas. You will see that the first 5 lines and the last two lines of the code I posted above were automatically created by AppStudio.

Then just put in the remaining code and it should work

This message has been edited. Last edited by: Hallway,


Hallway

 
Prod: 8202M1
Test: 8202M4
Repository:
 
OS:
 
Outputs:
 
 
 
 
 
Posts: 608 | Location: Salt Lake City, UT, USA | Registered: November 18, 2015Reply With QuoteReport This Post
Gold member
posted Hide Post
This worked brilliantly! THANK YOU!


WebFOCUS 8.2.03
z/OS
 
Posts: 66 | Registered: May 20, 2013Reply With QuoteReport This Post
Master
posted Hide Post
Excellent. I'm glad I was able to help.


Hallway

 
Prod: 8202M1
Test: 8202M4
Repository:
 
OS:
 
Outputs:
 
 
 
 
 
Posts: 608 | Location: Salt Lake City, UT, USA | Registered: November 18, 2015Reply With QuoteReport This Post
  Powered by Social Strata  
 

Focal Point    Focal Point Forums  Hop To Forum Categories  WebFOCUS/FOCUS Forum on Focal Point     [SOLVED] Automatically add comma's to user input fields

Copyright © 1996-2018 Information Builders, leaders in enterprise business intelligence.